Eatwell
UX Case Study
by Jason McCabe
Project Overview
The product
EatWell is a recipe app for people who want to make quick, healthy meals their family will love to eat. EatWell makes it easy to find, save and use great new recipes.
Project duration
June 16- July 18, 2023
The problem
Most recipes are too difficult and time consuming for weeknights. Home chefs need to be able to quickly find and organize healthy, easy, recipes that taste great.
The goal
Deliver an app that allows users to quickly find easy recipes that match their tastes and nutritional requirements.
My role
UX Designer
Responsibilites
My responsibilities were global throughout the project and included competitive research, user research, personas, user journeys, affinity map, wireframes, Lo-Fi prototypes, usability studies, mockups, Hi-Fi prototypes, accessibility considerations, testing, design iteration, etc.
Understanding
the user
• Research summary
• Pain points
• Personas
• Problem statement
• Journey maps
• Affinity Diagram
User research: summary
In order to gain a deep understanding of the users I am designing for and their needs, I conducted interviews and developed empathy maps. Through my research, I identified a primary user group consisting of busy working adults who struggle to prepare healthy weeknight meals their family will enjoy. While this group confirmed some initial assumptions about EatWell customers, further investigation uncovered additional user issues beyond simply providing simple recipes. These issues included complex dietary preferences, specific tastes, and difficulty with finding the recipes they are looking for.
User pain points
Usability
It's difficult for users to find what they are looking for on existing recipe sites.
Accessibility
Recipe apps and sites are often not equipped with assistive technologies.
Trust
Recipe apps and sites offer recipes they say are easy but take an amateur hours to make.
Disorganized
Users need an easy way to easily find new recipes quickly so they can move forward with their day.
Persona: Brianna
Statement
“I want the best for my family.”
Brianna is a single mother who works as an office manager. She loves to cook but knows she needs to make changes for the health of her whole family.
Background
Age: 34 Education: Some college
Hometown: Los Angeles, CA
Family: Single Mother
Occupation: Office Manager
Goals
• Set a good example
• Treat her family right
• Finish education
Frustrations
• It's tough to find the time
• Cooking great meals seems so hard
Problem Statement
User Journey Map
Affinity Diagram
Key pieces of information from the user interviews was used to create an affinity digram. Data was organized into groups of pain points which were further organized into high level goals for improvement.
Starting
the design
• Paper wireframes
• Digital wireframes
• Low-fidelity prototype
• Usability studies
Paper Wireframes
Demonstrating that there are lots of great recipes to choose from on the home screen was very important. Drafting different design options on paper provided a quick way to to compare and decide on the best design to use in the digital wireframes.
Digital wireframes
The goal was to create a simple, straight forward, UI that people can use intuitively.
Low-fidelity prototype
The home screen provides thumbnails of the most popular recipes. Easy navigation to recipe categories is imperative.
View Lo-Fi Prototype
Usability study: findings
I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype revealed what aspects of the mockups needed refinding.
Round 1 findings
Some users want recipes that focus on taste vs health
Users want separate pages for each category
Saving recipes is confusing
Round 2 findings
The categories are still difficult to use
Users wanted to see recipes for sides and desserts
Users want more nutritional information
Refining
the design
• Mockups
• High-fidelity prototype
• Accessibility
Early Mockups of app
Users could not easily find recipe categories so they were moved from the search screen to the home screen. It was also decided that all recipes would be fast and easy to prepare, making them suitable for any night of the week.
Before
usability study
After
usability study
2nd Round wireframes to Hi-Fi mockups
Hi-fidelity prototype
A clickable prototype was created in Figma. Through the use of category buttons and horizontal sub-menus on the home page content is easily accessible without using search or digging through traditional menus. This allowed for early user testing and will serve as a useful tool for developers as the application goes into production.
Accessibility considerations
Fonts were checked to make sure size, style and contrasts meet standards of clarity for the visually impaired.
Alt text is added to images and graphic buttons for screen readers.
Consistent layouts and simple gestures are used.
Sticker Sheet
Going Forward
• Takeaways
• Next steps
Takeaways
Impact
A quality user experience and lots of great easy recipes make folks feel like EatWell helps them do right by their families.“It’s very easy to find recipes that look great". "The options at the top of the home screen make it easy to find what I'm looking for.“
What I learned:
In order to best serve the users I was first to come up with a new (to me) type of navigation. Though it took several tries, this challenged was fun to solve.
Next Steps
One more round of visual design
refinement as well as copy editing.
Conduct an additional round of usability studies to demonstrate whether existing issues have been addressed and no new pain points have come to surface.
If no issues are found it’s time to decide if the app is ready for development.
Thank you!
I appreciate your taking the time to review my work on the EatWell app!
Reach out to me using the form below if you’d like to get in touch.
