Pura — Nutrition app UX Case Study
I designed this conceptual application and website as a personal project, with the structure of a Google UX Design course.
The Product:
Pura is a self-care app that helps you track meals, learn about your habits, and reach your goals through mindful eating- offering a wide range of suitable recipes and customized meal plans based on your lifestyle.
Project Duration:
February- March-2022
Role:
UI Designer, UX Designer, and Researcher.
Responsibilities:
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs, determining information architecture, and responsive design.
The Challenge:
When users commence their health journeys, much of their success or failure in reaching their goals are based on their diet. Even with a great plan, tracking your eating after every meal is difficult. Users lose inspiration and motivation during the dieting process.
The Goal:
Using a combination of gamification, intuitive nudges, and effective data visualization, Pura aims to help users meaningfully engage, make better food choices, and successfully change their dietary habits for the long term.
Empathize
Stage I — Preliminary Research
With a concerted effort, I conducted research on general well-being to have a rudimentary grasp on health management, as well as the existing nutrient tracking apps in order to get an understanding of what is already existing in the market, the characteristics, specialties, and usability.
There are a considerable number of nutrition tracking apps existing in the market. They aim to track daily calories/macros intake by logging meals to achieve users’ preset goals. To log meals, users can input the food in the app, or scan the barcode of a package. Most apps allow users to connect with associated activities apps to track exercise progress. With a premium upgrade, users can get access to tailor-made recipes according to health goals or specified diets.
Below are statistics on industry leaders and target users:
● As of March 2020, the leading health and fitness mobile apps in the Google Play Store were MyFitnessPal, Calm, and Headspace. (Source: Statista)
● The typical user of a diet app is young. As of 2017, 17% of 30- to 45-year-olds and 26% of 18- to 29-year-olds regularly use apps to track their diet and nutrition. (Source: Statista)
● Eating healthier was one of a New Year’s resolutions for 48% of Americans. (Source: Statista)
● Users download healthcare apps to monitor nutrition, track exercise, learn to work out, and reduce weight. (Source: Translational Behavioral Medicine).
Stage II — Primary Research
In order to build a realistic initial target group, I wanted to conduct some usability tests with 5 users that regularly engage in physical activity and food tracking, including both first-time and regular users of meal planning and fitness apps. I asked these individuals to perform tasks related to general usage of the MyFitnessPal, Lifesum, and Nutrition Coach apps (such as food logging, searching, and checking their caloric breakdown.)
A few of the interview questions asked:
I was also able to gather insights related to users’ daily experiences with the app which helped me further gauge people’s UX with them. Understanding their motivations was important in ensuring that the product and features that I developed got to the root of the problem.
The interview questions aimed to understand their overall tone while using the application. The participants were then asked to enlist their pain points and also general challenges that they might have faced during the process. Suggestions as to how these challenges could be overcome were also enlisted by the users.
Main takeaways:
Even though people have a relatively high consciousness of healthy dietary concepts, they lack the discipline to stick to the diet.
When they were asked how conscious they are about their health and diet, 4/5 answered they were already conscious about it, and would want to be more conscious and learn more about their own health. The reasons for adopting a healthy diet are for fitness, awareness, and lifestyle purposes. They also want to have more healthy choices, to look and to feel better.
Define
Must-have features of a diet and nutrition app
I wanted to address the user pain points by including (and improving) the core features of the application.
Personal profiles
After downloading the app, a user needs to register and create an account. At this stage, users should fill in personal information like name, gender, age, height, weight, food preferences, allergies, and level of physical activity.
Food logging and dashboard
Allowing users to analyze their eating habits. They should be able to log food and water intake and see their progress on a dashboard that can track calories, fat, protein, and carbs.
Push notifications
Push notifications are an effective tool for increasing user engagement and retention. To motivate users to keep moving toward their goals, it’s pertinent to deliver information on their progress toward the current goal and remind them to log what they eat.
Calorie counter
Enabling the application to calculate calories users have burned and eaten based on the data they’ve logged.
Barcode scanner
Let users count calories and see accurate nutrition information via a built-in barcode scanner.
Recipe book
Users will appreciate the opportunity to find healthy recipes in the app. Including pictures, videos, and even voice instructions in your recipes would be a valuable feature. Also, allowing users to rate recipes and sort them by keywords, ingredients, categories, and calories.
Diet plans
Help users maintain a healthy diet by offering diet plans. Usually, a diet plan includes meal suggestions, nutritional tips, recipes, and recommended total calorie intake per week or day.
Gamification
Including game elements to increase user engagement and retention. Using ranks, badges, and points to reward users for achievements such as losing weight or completing goals.
Integration with wearables
There are different trackers and wearables to integrate with. For example, Apple Watch, Android Wear, Jawbone, Fitbit, and Samsung Gear to synchronize data on physical activity and health metrics.
Nice-to-have features of a diet and nutrition app
Since nutrition apps can have different purposes, their functionality can differ accordingly. Below are features that I considered including later on or that could be useful for some nutrition apps.
Blog
A lot of users want a diet and nutrition application to not only count calories but also share some diet tips to help them improve eating habits. This is where blogs come in handy. There, the latest food and nutrition research, news, and health tips could be shared.
Shopping list
Letting users import ingredients from a diet plan or a recipe to a shopping list or add groceries manually.
Experts
Users will definitely appreciate being able to get in touch with diet coaches for expert advice. This could be a paid feature.
-User Personas
From the interview and observation sessions, I collected and synthesized some information that can be used in the upcoming design process. I could clearly define 2 user profiles from the research data.
A casual dieter who does not follow a health plan regularly:
Enise is a full-time student who needs reminders, suggestions, and coaching to cook more often with fresh ingredients because they want to stay on top of their health and make it a part of their routine.
A strict dieter who is very conscious of their health:
David is a full-time financial analyst who follows a very health-conscious regime in his day-to-day life and would like to maintain that discipline with a meal-tracking tool.
Ideation
I did some quick ideation exercises to come up with the general information architecture and jot down any ideas to address gaps identified in the competitive audit.
-Paper Wireframes
Once the initial framework of the application was ideated, I sketched out paper wireframes for each screen in the app (I started to work on designs for additional screen sizes as well, to make sure the site would be fully responsive) keeping the user pain points about navigation, browsing, and flow in mind.
-Digital Wireframes
After ideating and drafting some paper wireframes, I created the initial designs for the app, and a website dedicated to the app. These designs focus on space allocation, prioritization of content, functionalities available, and intended behaviors.
-Low-fidelity prototype
To prepare for usability testing, I created a low-fidelity prototype that connected the primary user flow of inputting new meals, viewing recipes, and tracking health details.
View Prototype
Test
To validate my proposed design solutions, I tested my prototype on 5 people.
I observed my users to understand how easily they navigated through the app, what they thought would happen when certain buttons were pushed, and any moments that tripped them up.
I discovered that the designs (thankfully) did not have any catastrophic usability problems that stopped users from accomplishing the core tasks.
Here is the general feedback:
“One of the main focal points of the app is to have your personalized health data be readily available to you, to help you see how close you are to achieving your goals. The health data is only about 30% of the homepage screen.”
I’ll be addressing that concern by making the health data the focus of the homepage with little to no divergence.
The user also stated the center “+” button made inputting data very straightforward. Being as the most relevant action for a fitness and nutrient tracker was logging foods, metrics, and activities, this function located in the center of the navigation bar made it all easily accessible.
None of the participants had trouble locating diets/recipes.
4 out of five of the participants found it confusing that there were CTA’s for Tracking a meal and adding a meal to your Favorites, but not to add a meal directly to your food logs.
“Final” Iteration
-Onboarding
The main value of the onboarding process needs to serve, is to set initial expectations from the app, and to get the most pertinent information we need from the user in order to get started. I did this by showing a simple walkthrough and using forms that are as frictionless as possible with no need to type.
-Homepage
The main usage of the app should be the daily tracking of the nutrients consumed.
For the ‘Home’ tab, there are animations illustrating your calorie allowance and consumption for the day.
I included Gamification (‘Streaks’) in order to encourage users to use the app for every meal. Allowing users to turn everyday activities into games by awarding points for consistency as encouragement.
Research has shown that almost 30% of healthcare patients don’t understand their medication recommendations. 50% don’t understand the dietary recommendations given by medical professionals.
I hoped to circumvent that problem by breaking down information into bite size chunks in forms of easy to read diagrams and illustrations. Every day the app shows users habit-forming tasks on the home page — weigh in, log your meals, water, sleep and reach your activity goal.
Integration with wearable devices
Synchronization with platforms like Apple Health, Google Fit and other workout and health applications would give the statistical data for the app.
The method for adding food needs to have the least friction as possible, and give data regarding how this food affects the daily goals, I wanted to have that process have its own format.
When users will search for new food to add, they’ll be able to select their favorite food, and the recent food added at that time in the past day will be shown there as well. This might help them save time as well.
Barcode Scanner
A barcode scanner can add the product to the daily intake just with the help of the smartphone’s camera. It’s a convenient feature because it doesn’t only detect the product but its manufacturer. Users can get the full information about their meal in seconds.
-Recipes & Diet Plans
A common paint point with users was the lack of variety in terms of recipes and diet plans. I wanted Pura to have a diversity of both to impassion users to maintain their health journeys. If the app doesn’t have enough content, it’ll be hard to retain users.
View Prototype
Website dedicated to the Pura app:
Takeaways
Nutrition app development can be quite a challenging task. I went into this project not knowing much about the foundational elements of nutrition that were vital to the making of this app, but I’ve learned so much along the way.
Health is a delicate topic, and I wanted to make sure I treated it as such when interacting with users. I wanted to foster a respectful, comfortable environment when conducting usability studies and only asked the most pertinent questions I could.
So far the feedback has been definitely positive, and testers seem to find it useful and fun to use. But for now, the design process is still ongoing. The more data I gather through research, prototyping and user testing, the more avenues I see for potential improvements. I am excited to work on the next iteration, which will involve:
- Researching on features
- Improving visual design consistency and user flow
- Designing interaction animations, and
- Conducting usability tests of the app.
It has been an amazing learning experience designing my first nutrition app and preparing this case study.
Thanks to my fellow students, friends and strangers who have given insightful feedback and support during the course.
Thank you for reading! if you have any questions or you’d like to reach out, don’t hesitate to contact me on Linkedin, Behance, Instagram, or email- (ElleDiazMorales@Gmail.com)
