FOOD ALLERGY RESEARCH AND EDUCATION (FARE)

Screen+Shot+2019-08-09+at+1.23.27+PM.jpg

Client Project| Summer 2019

Team: Lead Strategist, Project Manager, Creative Director, Designer, Managing Partner

Role: UX Strategist Intern



OVERVIEW:

This summer as part of my internship at the D.C. based digital agency Interactive Strategies, I was assigned to two nonprofit client teams: American Association of University Women (AAUW) and Food Allergy Research and Education (FARE). FARE is the world’s largest non-profit organization dedicated to food allergy awareness, education, research, and advocacy.



The Task:

FARE is undergoing a strategic shift in their vision, adapting from focusing on sustainability with food allergies, to focusing on research in prevention and treatment. In order to reflect this internal realignment, their website needs to reflect the new goals and missions of FARE.



Goal:

To redesign the FARE website to reflect this pivotal shift and modernize the current website. 



STAKEHOLDER INTERVIEWS:

We began by interviewing several key stakeholders at FARE: the Chief of Finance and Operations, the Director of Marketing and Communications, and the Director of Advocacy. Some of the key questions we asked were:


  • With FARE’s shift in strategic direction, what are the most important goals your team needs to accomplish? 

  • Who are your primary audiences? 

  • What content is important to retain? What content is ready to be sunset? 

  • How does the website need to evolve to meet your long-term goals?


As we spoke with the team at FARE, we saw common patterns across all departments. We determined our objectives based on this feedback from the executives.

 
Objectives for FARE.png
 

Important Stakeholder Quotes:

“If we’re going to be a research engine, we need research to shine through on the new website.”

“We want to bring our new FARE narrative and mission to the forefront.”

COMPETITIVE ANALYSIS:

We researched roughly 30 direct and non-direct competitors to get ideas and inspiration for how we wanted to structure and design the site. In the collage below, you will see examples we found across industries of examples of storytelling, audience directed user journeys, navigation structures, and user-oriented data visualization.

 
Competitive Collage.png
 

This competitive analysis helped show us trends in the non-profit space as well as give us inspiration for specific components that would drive the website. 

 
sitemap.jpg

SITEMAPPING:

From our research and interviews, we began brainstorming navigation structures, important resources, and audience pathways. A topic of hot debate we had was addressing people living with food allergies as “patients”. On one end of the argument, people who live with food allergies do not consider themselves to be patients. However, with FARE’s shift towards research and innovation, addressing people as “patients” creates a sense of urgency. This was our initial navigation structure, but you will see later how this changed.










 

WIREFRAMING:

Based on our initial interviews and research, these are some of the wireframes sketches that we created.

Wireframes - Rights.png
Wireframes - 101.png
Wireframes - Frosty.png

These soon turned into active low-fidelity wireframes that we presented to the client along with our strategy recommendations.

Low-Fidel Wireframes.png

INITAL FEEDBACK:

As a team, we presented our strategy recommendations to the FARE executives. Our ideas of storytelling and audience based pathways were big hits, but (and now it comes up again!) our navigation structure was put to the test. FARE executives agreed with one of our previous points and felt that calling those who live with food allergy “patients” seemed ill fitting. This was changed to “Living with Food Allergies”.

A specific feature we added that directed users to their audience-specific resources in the resource library was a huge hit. We found a similar component to this in our competitive research, and weaved it into our designs with our own special touch. This provides users with the option to directly get the information they’re looking for, or continue scrolling on whichever page they wish.

 
Screen%2BShot%2B2019-08-09%2Bat%2B10.07.07%2BAM.jpg
 

REVISIONS:

After our initial check in with the client, we moved back to the drawing board and continued to grow out design. We updated the navigation structure and began focusing on the story of each user. Wording was everything when it came to this project, and we wanted to focus on driving a sense of humanity and urgency with this disease. Throughout the wireframes we incorporated storytelling through quotes, videos, individual stories, and less stock images. When it came to telling the story of research, we felt it was more impactful to tell this story through the eyes of a patient rather than just throwing data and research findings at a user. It was important to show that the research, education, and sustainability of food allergies were all connected to one another, so this is how we designed the new homepage.

Round 2 Wireframes.png

STYLE TILES:

We revamped the FARE branding and refreshed the look of the website. We created style tiles to show the client the future of the website from an aesthetics standpoint, allowing them to better visualize the finished product. With two options, FARE was able to decide the direction that they wished to head for their branding visuals.

direction 1: Vibrant Science

Serious research improves lives - that’s the concept behind this direction, which brings together science-inspired design elements with modern layouts and a vibrant color scheme.

Round 2 Wireframes (1).png
Screen Shot 2019-08-09 at 1.22.19 PM.png
Screen Shot 2019-08-09 at 1.22.28 PM.png

DIRECTIon 2: HUMAN TOUCH

This patient-centric direction combines organic and hand-drawn elements to reinforce that people living with food allergies are behind everything FARE does.

Round 2 Wireframes (2).png
Screen Shot 2019-08-09 at 1.23.40 PM.png
Screen Shot 2019-08-09 at 1.23.27 PM.png

NEXT STEPS & TAKEAWAYS:

With the strategy and research completed, it is now time for design and development. These phases are currently in the works and I will update continue to update my site as they become public.