Guru Orange

design with clarity and passion

homepage

Friends of Callan Park ux/ui

By Leave a Comment

The Friends of Callan Park are an organisation set up over 20 years ago to protect the park’s heritage and public space.

Their website was in need of an update after 15 years. As usual, I started the project with a workshop, listening to the client’s needs and to their knowledge about the audience and the project. Then, we started creating an organising system for all that historical content, and established the basics for the new ux/ui. Getting the content back on the site in a more orderly fashion is an ongoing project.

I re-ordered the site pages, injected some calls to action and internal links. I sectioned the home page, creating a summary of content and links to other pages. I also ensured marketing content is available via the site.

We are currently working on strengthening possibilites for interaction with visitors of Callan Park, and streamlining the numerous exsiting social media (particularly Instagram) feeds used by the community that uses and enjoys the park. We are also working on strengthening connections to other organisations, such as NSW Health, who manage the site, so we can share information with them using the new site.

Callan Park front page

The site is, of course, designed for a variety of screen sizes. Our next task will be to evaluate page views and devices used most, and then to re-arrange content accordingly.

see the site at callanpark.com

Sage.fm brand & ux/ui

By Leave a Comment

Sage.fm online video conversation platform

Sage.fm is an online video conversation platform, connecting experts (Sages) with those valuing their advice (Seekers). Currently, the start-up’s focus is shifting from product development to sales and marketing, with a number of early customers using the platform already.

The Sage.fm brand is premised on two principles, of elevating the Sages and of creating a brand that is high-end but stays in the background.

Sage.fm logo | design by Eli Brassé
Sage.fm live conversation screens

The live conversation is, naturally, at the heart of the platform. The design enables browser-based conversations across all types of devices, while delivering information about time and money spent and more.

The profile and dashboard pages are bootstrap-based, mobile-first designs that aim at reducing visual clutter while delivering on the brand principles.

Sage.fm dashboard | design by Eli Brassé
Sage.fm profile page | design by Eli Brassé

See more at sage.fm

Raw Money brand, id & ux/ui

By

Raw Money front page | design by Eli Brassé

Raw Money founder Margie Stewart and I have collaborated on setting up this unusual new business over the last year or so now. Margie came to me with an idea for a brand new business, and has given me the opportunity to work with her on setting up the brand from the ground up. We started with a series of workshops to develop a brand and communications strategy in a collaborative manner, and took these outcomes into creating a set of core images to symbolise the concepts behind Raw Money and the Raw Money logo. We then moved on to using the core brand design on stationery, the Raw Money blog site, and materials used in client sessions, as well as developing a brand style guide and content style guide.

Taking its cues from Renaissance paintings, the image concept speaks to new life being created out of the ruins of the old. All images have butterflies – symbol of transformation – in them, as well as flowers, symbol of youth and the force of life, while many also have hints of mortality. The Sydney houses these images are superimposed on are a representation of wealth that lies dormant.

Raw Money subpages on smaller screens | design by Eli Brassé

Raw Money imagery | design by Eli Brassé

See the site at rawmoney.com.au

‘Made in…’ city travel guides

By Leave a Comment

Made in... city guides | design by Eli Brassé

The Made in… guides are a celebration of a city and the talented people who reside and work here. The highly curated guide profiles the city’s finest artists, artisans, craftspeople, designers, makers and shopkeepers who come together to produce and sell some extraordinary things. There are currently two guides available, Made in Kolkata and Made in Bengaluru. Each book comes with a matching travel journal, designed as a keepsake.

These guidebooks to a city’s makers, designers and craftspeople are the result of a ten-year-long collaboration with author and publisher Fiona Caulfield, aiming to highlight ‘conscious travel’ and socially and/or environmentally sustainable organisations. 

The books are completely hand-made in India, and printed and produced using traditional craftspeople and methods. The entire process is eco-friendly and supports the skills and livelihoods of traditional makers.

Made in Kolkata book cover & travel journal cover | design by Eli Brassé

The book design is based on research of the first travel guides, dating back to 19th century England, and uses hand-drawn illustrations by Ayeshe Sadr and Ishaan Dasgupta. The fabrics used are the result of design collaboration with Aneeth Arora of acclaimed clothing brand péro, based in New Delhi, and the hand-made bookmarks and hand-embroidered labels are created by ladies working in the péro atelier.

Made in Kolkata | design by Eli Brassé

Each book contains introductory essays and hand-drawn maps. The books are printed on paper that is made by hand in the age-old method in the small village of Sanganer, on the edge of Jaipur in Rajasthan. The covers are hand-printed and the books are hand-bound and finished, all at Judge Press in Bengaluru.

Made in Kolkata map | drawing by Eli Brassé

Love Travel Guides also produces more extensive city guides for ‘luxury vagabonds’. More information can be found in this post.

All books at lovetravelguides.com

Made in Bengaluru | design by Eli Brassé

Supercalla ux/ui analysis & update

By Leave a Comment

Supercalla founders Bede and Holly came to me because they didn’t think their newly created website delivered for their startup business. Together, we analysed and evaluated the site and refined the business plan. Supercalla then extended the contract into a new UX design, looking at possible early-stage calls to action for a more interactive site, and at a more defined business structure throughout. That complete, the UX naturally was extended into a UI design, which I delivered into their existing Squarespace site container.

Below is the resulting homepage.

See the full site at supercalla.com

‘Love Travel’ brand & guidebooks

By

Love Travel guidebooks | design by Eli Brassé

Love Travel guidebooks are a collaboration that has now lasted over a decade. These travel guides to Indian cities are based around sustainable and ethical production, celebrating and continuing the rich artistic traditions of the subcontinent while supporting the livelihoods of artisans and craftspeople.

The book design for each Love Travel Guide is based on the very first travel books, dating back to the 19th century. Each guide is available with a paper cover or as a luxury edition khadi cotton cover, wrapped in a khadi cotton or silk bag.

Author Fiona Caulfield takes her readers beyond the obvious tourist attractions. The entries are personally sourced from in-the-know locals including chefs and chaiwallahs, artists and architects, photographers and princesses. The ‘Conscious travel’ symbol highlights the many businesses supported by the guides that give back to their communities.

Completely hand-made in India, Love Travel Guides celebrate authentic Indian luxury and pay homage to India’s rich craft legacy. Love Travel Guides are printed on paper hand-made in Jaipur and the book covers are made from khadi cotton hand woven in Andhra Pradesh. Love Travel promotes sustainability and conscious, ethical travelling. Love Travel also runs a foundation supporting charitable organisations around India.

The Love Travel Guides website has more details and information
lovetravelguides.com

Patrice Newell’s farm shop ux/ui

By

Patrice Newell wordpress website design
Patrice Newell’s new homepage

Patrice Newell’s biodynamic farm produce has long been available exclusively from her own online shop. A true innovator in farming, a writer, progressive political thinker and art lover, her online presence as well as legacy technology were in real need of an update to accomodate and reflect her multi-faceted business and personality, and create a space for the community that is involved in the farming business.

The website is at the core of this project, which to a large extent involved sorting out all technical issues and re-writing, ordering, migrating and updating a huge amount of existing content. A similar exercise on a smaller scale to update Patrice’s email marketing was the natural extension of it, and the online spaces that host her large community of garlic fans, book fans and fellow country based progressives are an equally natural next step.

Patrice Newell online fram shop front page | design by Eli Brassé

A screengrab of the pre-existing site, before we took it on

Patrice Newell old site

See the site at patricenewell.com.au

HepCheck 1 2 3

By

HepCheck 1 2 3 homepage

Hepcheck 1 2 3 was a project by the Eastern Sydney branch of NSW Health. It created access to and uptake of Hepatitis C treatment for people in Sydney who experience homelessness. It was a collaboration of NSW Health with a variety of non-government and government health service providers in the inner city of Sydney.

Hepcheck 1 2 3 was delivered by guru orange in collaboration with various organisations that are part of NSW Health and the NSW Health IT team in 2015. The project was discontinued in 2018 due to new treatments for HepC being delivered across Australia, taking treatment time from 1 year to 3 weeks.

We kicked off the project with a series of UX workshops with all stakeholders. We worked together with health staff from various organisations to deliver the content for the site, delivered the UX and UI design on both the front and back end, and collaborated with the Health department’s IT team to implement these. We designed a new brand for HepCheck 1 2 3 and built the front end website in Drupal. We conducted customer feedback and usability testing sessions. We wireframed the back end website and art directed the Health Department’s team. Lastly, we conducted training sessions for health staff.

Supporting documents:

Process document examples:

Following an initial workshop, the outcomes were condensed into flow charts using balsamiq.  See Early UX flow chart for backend

This was then turned into wireframes. See Front end wireframes (iteration 1)

The front end design, tailored to users with low language/literacy skills and poor access to the most current technology was then developed. Here’s an example of the information section in step 1. See Front End Design (chosen suggestion, iteration 1)

A screengrab of the working backend section during testing phase.