Background
One in three consumers are following a specific diet or eating pattern. 80% of consumers say there is conflicting information about what foods to eat or avoid*.
My project partners and I realized that each of us were restricting our diets in some way for health reasons, and had little resources to help us make better choices for our diets. We decided to conduct research to see if others were experiencing similar issues.
The Problem
Through research and analysis, we confirmed that a large portion of people are limiting their diets. As consumers become more health conscious, they want to know what exactly they are putting in their bodies. Nutrition labels and confusing ingredients make it difficult to truly know.
The Solution
To create an aid that helps individuals make quick decisions about foods they could eat based on their unique diet.
Contributors
Melanie Perry — UX/UI Designer + Front-End Developer
Haley Ugwuibe — UX Designer
Cindy Guo — UX/UI Designer
My Roles
User research
User interface
User testing
Front-End Development
Scope & Constraints
3 weeks
$20 budget
The Process
[Research]
Competitor Analysis
We discovered a lot of apps in beta or that had very narrowed targeting. For example, we found an app specifically for people with food allergies. We determined our biggest competitor to be ShopWell, but also learned a lot from Food Intolerances.
ShopWell had a good amount of usage and positive reviews. Users could update their dietary preferences and scan items to find nutritional information. Foods were given a score based on expert knowledge, age, gender, and preferences. The lower the score, the more users should avoid that food. ShopWell also had the ability to create shopping lists.
Food Intolerances was an indirect competitor catering to those following Low FODMap, gluten-free, or diets for Irritable Bowel Syndrome, however, the nutrition database was vast and informative.
The competitor analysis was very important since we were building this app from the ground up and wanted to develop a strong value proposition.
User Interviews & Surveys
We conducted 4 in-depth interviews and received 57 survey responses, distributed primarily through social media.
81% of our survey respondents were restricting their diets in some way.
42% were regularly checking nutritional labels.
69% did not feel fully aware of the ingredients they were eating.
There was a correlation between survey results and our in-depth interviews. We found that those with health issues struggled the most with the uncertainty. Even if they researched nutritional ingredients the best they could, they were still afraid to eat foods and unsure of how their bodies would react.
During one of our interviews, a user mentioned she completely stopped grocery shopping and started ordering gluten-free, home delivery meals. She knew she could trust the ingredients.
Many questions arose from these interviews:
- How could we make grocery shopping easier for those restricting their diets, especially for those with health concerns?
- How could we provide more insight into how ingredients will affect their bodies to help build confidence and remove fear of eating?
[Definition]
Affinity Diagram
An affinity diagram helped us generate ideas and narrow our focus. After our interviews and thinking about how we could help these people, we were moving in too many directions. Through the diagram, we learned the major problems/health issues our users were dealing with and their current nutrition research process. More importantly, we learned how they preferred to research nutritional information.
Insights
- Most people are very busy and do not have the time to research every ingredient in their food. This is especially true while grocery shopping.
- Some users are eating the same foods over and over again because of fear of feeling sick.
- Users do not understand or trust nutrition labels.
- Users trust online reviews or reviews from friends.
This provided us with problems to solve.
The User
Ursula has a health condition and wants to use the app to start feeling normal again.
Blake is Ursula’s friend. She trusts Ursula’s opinion around health and fitness because Ursula has tried everything to feel better. Blake doesn’t have a health condition, but focuses on living a healthy lifestyle.
Value Proposition
Eat Well helps those with special dietary needs eat better and feel better without the need to do a ton of research on complicated ingredients.
Why we’re better: We educate individuals on hidden ingredients they may not realize are poor choices for their unique diet, send personalized grocery lists with acceptable foods, and help them discover reviews of food reactions from others in their community.
Why we’re believable: We’re a transparent, supportive health community enabling those who want to feel better and live healthier lifestyles.
[Ideation]
I Like. I Wish. What If?
We compiled a list of possible features using the I Like, I Wish, What If ideation method.
- Personalized to show only information about a specific user’s diet; ability to create a personalized profile with diet restrictions
- Scan barcodes on food packaging and quickly show whether food is good or bad for their diet
- Provide pre-generated, “safe” grocery lists based on their unique diet
- Ability for users to create custom grocery lists and receive food suggestions
- Ability to leave comments after trying new foods as a way to track their symptoms and reactions or read reviews from those with similar health issues
We couldn’t include all of these features in 3 weeks, so we had to choose what could serve as the best solution possible for our users.
Information Architecture
We based our site map off of the primary features within the app. These five features would later become the static navigation.
[Prototype]
Sketches
Cindy and I designed the UI while Haley helped with strategy and ensuring our designs were fulfilling our promise to users.
From the beginning, we wanted include rounded shapes and buttons, static navigation, personalization throughout the entire app experience, and labels for everything. This app had the potential to contain an overwhelming amount of information, but we needed to educate the user within seconds of scanning or searching a food item.
Wireframes + Testing (and making hard decisions)
With the limited amount of time, we eliminated the auto-generated grocery lists feature. It would be a part of future development so we could focus on the primary features — personalization, scan and search, view nutritional information, leave reviews, and building grocery lists.
Also at this point in the project, we decided it would be best to not to tell users which foods are good and bad for them, but rather provide them with all the information to help them make their own decision.
So instead, we used a caution icon and pointed out ingredients that could irritate them based on their personal profile.
After testing our sketches and wireframes, we learned our onboarding process was overwhelming. We simplified onboarding.
Styling
I designed our styles and Cindy added the final touches.
We wanted to promote health and positivity which is why we selected green colors. The orange accents added a sense of energy. The Quicksand font family felt friendly and when paired with Roboto, allowed us to communicate directly and in an accessible way.
I feel most proud of our style guide and the meaning behind every element selected.
Hi-Fi Prototype + Testing
We received a lot of positive testing feedback, but needed to make our shapes consistent, enlarge our buttons, and adjust some of our hierarchy so it was clear and easy to understand. So we did.
[Front-End Development]
I brought our design to life using Webflow. This was completed the day before project presentations.
Future Development
- Automated grocery lists based on personal dietary needs and preferences
- Allow users to input information for unknown items to grow food database
- Enhance the scan feature by allowing users to scan a list of ingredients with needing a barcode
- Expand Eat Well outside the U.S. with the addition of international foods
- Partner with food brands or grocery stores to market their products within our app / shop feature
What We Learned
This project had a lot of requirements with little time to iterate. To fully implement this, we’d need much more testing. Testing and listening to the user is vitally important when building an app dealing with a user’s health.
We learned how important information architecture is with an informational app such as this. The goal was to educate the user within seconds.
This project was very rushed and I felt strongly one of biggest differentiators would have been auto-generated grocery lists. I would go back and add that in. I’m still very proud of the work we achieved within three weeks. There is a definite need for this type of app with the potential to help many people.
*2018 Food & Health Survey | International Food Information Council Foundation https://foodinsight.org/one-third-of-americans-are-dieting-including-one-in-10-who-fast-while-consumers-also-hunger-for-organic-natural-and-sustainable/
