UX design/Branding – Keep Austin Fed

UX design/Branding – Keep Austin Fed

  • 2 Nov 2017

I recently volunteered at a Design hackathon(createAthon) hosted by ‘BuildASign’ in association with AIGA(the professional association for design). I am very glad I got this opportunity to work with talented designers MARA FLEET, JACK PEWITT and  ADAM DUDD.

PURPOSE OF RE-DESIGN
To present an aesthetic, modern, trustworthy outlook of the Keep Austin Fed’s website from the existing barebones, information scattered design.

GOAL OF PROJECT

The goal is to redesign user experience so it is engaging, smooth & effortless right from the beginning.

The following are 6 important issues we chose to address:
1. Need to attract more volunteers.
    – research and identify the demographic to target and social media channels to promote the image of KAF in order to attract more volunteers.
2. Build brand image of Keep Austin Fed throughout the entire process of donating food.
    – For example, restaurants should know KAF volunteers are taking food from them and not some random individuals. The recipients should also know that KAF’s volunteers are delivering fresh food to them so that the brand gets more recognition, building trust along the way.
3. Users cannot easily register to volunteer in KAF’s website.
   – place a clearly visible CTA button to register users interested in volunteering.
4. Organizations cannot easily schedule to donate food.
    – place a clearly visible CTA button to ‘Donate’ and ‘Schedule to donate'(calendar) for organizations willing to donate & schedule regularly to donate fresh food.
5. Users don’t know who the recipients of the donated food are.
    – clearly indicating the NGO’s, organizations who are benefitting by Keep Austin Fed’s donations is very essential in building a trustworthy image KAF; hopefully attracting more volunteers to pitch in for them.

 

1. RESEARCH TO UNDERSTAND; LISTEN TO LEARN

After the initial brainstorming session about Keep Austin Fed’s(KAF)

  • vision, 
  • mission, 
  • pain points & 
  • goals we moved on to the research phase where we delved deep into the Brand overview, the demographic that is/can be targeted for volunteering opportunities and website analysis(as part of the UX audit requested by Keep Austin Fed).

We came up with each of our own idea of their Brand Values. We combined the most common words listed that could be used to clearly resonate their Brand Value.

I also performed site audits of similar websites. It helped me to develop an overall need assessment for the site I was planning to design. 

  • Content audit                       
  • Competitive analysis (heuristic analysis)

2. SYNTHESIZE TO DEFINE CONCEPTS

Analyzing from the demographic that might have most of their time at disposal for volunteering work, we decided that senior citizens(in particular Austin’s active, hippie & eco-friendly new retirees in addition to stay at home parents and college students) with their daytime completely at disposal would be a huge demographic to target for volunteering.


We modeled their experiences, tasks and mindsets to articulate the user goals & presented them as empathy maps and personas for quick, easy reference & guidance throughout the design process.

 

  • Personas                       
  • Moodboards
  • Sketching                      
  • Storyboards
  • Photography/Typography

We also proceeded to draw inspiration for new colors, photographs and typography from their website & also took a fresh look at visual elements that pronounced the significance of the involvement of passionate, selfless humans in the everyday delivery of food to our neighbors in need.

MOODBOARD, PHOTOGRAPHY, TYPOGRAPHY

We wanted the illustration and typography to convey the hand-drawn/handwritten, personal touch kinda feeling.

ILLUSTRATION AND BRANDING 

Keep Austin Fed’s existing website(annotations during UX audit)

3. VISUALIZE THE INTERACTION; COMMUNICATE THE IDEA

Sketches and wireframes formed the basis for low, high fidelity prototypes at multiple stages to get our perspective right.
     

  • Sitemap             
  • Wireframes              
  • Visual mockups  

WEBSITE REDESIGN (WIREFRAMING)

4. TEST THE PROTOTYPE; REFINE & REPEAT

Getting timely and useful feedback on prototyped ideas in a structured/informal setting is crucial to the iterative process.


The feedback from the testing(since this was just a 24 hrs rapid prototyping/design sprint, I got feedback from my team members) is what drives the iterative process, giving me essential insight into refining the prototype, rethinking the interaction & even generating more concepts.

WEBSITE REDESIGN (MOCKUP)

CONCLUSION

Keep Austin Fed’s Program Director Lisa Barden was very happy with the outcome of the project. She thanked us immensely and really loved the powerful yet playful imagery that can be used in posters and social media platforms to promote the brand image of  Keep Austin Fed.


She was glad that we were able to capture the essence of Keep Austin Fed – the Donors, the volunteers & the recipients in the website redesign; who she thought were key to running the non-profit organization too.

Overall an Exhilirating & exhausting experience. We couldn’t have done it without the super helpful staff at BuildASign such as Margaret, Laura, Bobby and so many others.

Like & Share with friends:)
(Visited 48 times, 1 visits today)

Leave a Comment