Mobile App Design
HealthyOut
Help diabetics count nutrients of meals to eat more healthily when dining out
Try prototype here
OVERVIEW
HealthyOut is a mobile app that helps diabetics eat healthily when dining out. It allows them to find diabetes-friendly restaurants, calculate nutrient information of meals and share with other diabetics.
MY WORK
UI/UX Design, User research
BACKGROUND
This is a project from a Hackathon held by Glooko which commits to making diabetes management easier. In the event, how to help diabetics control their symptoms when traveling abroad became a hot topic.
After some exploration, I found a deeper problem behind this topic is that for diabetics who are very careful with their food, calculating nutrients (e.g. carbs) is a laborious process, especially when the meals are not what they usually eat. This prevents them from enjoying eating out with their friends or traveling abroad with families.
HealthyOut aims at solving the issue by establishing an online community where diabetics can easily calculate and share with others nutrition information of meals in restaurants.
DESIGN PROCESS
And it's never linear.
Every stage in the process have impacts on earlier or later stages.
DISCOVER + DEFINE
What's the real problem?
It all starts from a question
How can diabetics better manage diabetes when traveling abroad?
To manage diabetes, diabetics need to keep their blood sugar level within a certain range and avoid frequent fluctuations. Among many things which may impact blood sugar level, what they eat and what nutrients they take in are main concerns in the population.
Traveling abroad, however, means breaking routines in life: eating unfamiliar food, having irregular meals, forgetting to take medication, taking the wrong dosage of insulin, less exercise, etc. One major problem is that, because many diabetics eat in restaurants when traveling, they easily take more nutrients (mainly carbs) than usual without even knowing it which may lead to extreme fluctuations in blood sugar level.
At first, I think that losing control over food during traveling is attributed to irregular schedule and unfamiliar meals. But after digging deeper into interviews with diabetics, I notice this loss of control is more caused by the effort-consuming process of calculating nutrients in meals when eating in restaurants.
To calculate nutrients in a meal, diabetics need to write down all ingredients, find nutrition facts for each ingredient and add them up. This is such an arduous task that many just stop doing it.
Now the problem is reframed to
How can diabetics easily calculate nutrients in meals when dining out in restaurants?
DEFINE
What an ideal solution should be like?
Several existing products provide solutions to calculating nutrients for diabetics, but they are not doing a good job due to a variety of reasons: the solution is not accessible, the solution is not efficient, the solution is too complicated, etc.
Therefore, before depicting a solution, I decided to create design principles to give a clear direction of what an ideal solution will be. These principles are extracted by gaining empathy with users and analyzing existing products users use.
Who are the target users?
One main question I asked during the user research is "what prevents diabetics from calculating nutrients in their meals when dining out?" To answer the question, I reviewed research data from our user researcher and used a food tracking app for diabetics for 2 weeks. I also talked to diabetics I know and asked questions like "How do you count carbs?", "What tools do you use?", "What do you like or dislike about the tools?"
From all research findings, I realized diabetics could be divided into two categories, "Active Manager" and "Passive Manager" The main difference is how motivated they are to control diabetes. This means the solution should be as easy as possible so that even a "Passive Manager" will not quit halfway.
Two personas are created and used throughout the project to guide decisions for prioritizing functions and designing interactions and visual appearance.
Then, evaluate current products in use ...
Researches into current tools diabetics use, especially digital products, helps me understand what works and what does not work for users. To analyze their strengths and weaknesses, I listed 4 main groups of product competitors and did a competitive audit for each group.
One important finding is that current solutions rely on each individual to log their meals and is too laborious to insist on doing it every day. Another finding is that current solutions focus on logging food while lacking actionable insights pulled from logged data.
PERSONA
Anita
Active Manager
Background
Anita was diagnosed with Type 1 diabetes when she was young. Diabetes has become a part of her life ever since. She now takes both insulin and oral medications to control her glucose level. She is very careful with how much carbs she takes in every day to avoid developing serious symptoms.
Pain point
-
Calculating carbs of the meals she does not eat frequently is not easy
-
Not sure what to order when eating out with friends
Highly motivated
Expert in diabetes
Willing to spend time and effort
Patrick
Passive Manager
Background
Patrick has Type 2 diabetes. He likes sweets and fried food and does not exercise a lot. He does not know much about diabetes and mainly follows his doctors' guidance to control symptoms. He often does not pay much attention to diabetes even though the symptoms could be worse.
Pain point
-
Do not know what food is harmful to his diabetes
-
Do not know how to calculate carbs in meals
-
Easily lose control and eat unhealthy food
Less motivated
Novice in diabetes
Impatient and easily give up
COMPETITIVE AUDIT
Thus, an ideal solution should be ...
Based on research findings, three design principles are identified to illuminate designs. This will also be used as measures of success for final deliverables.
Minimize operational efforts
Easy and intuitive enough so that even diabetics who are less motivated are willing to use.
Provide actionable insights
Benefit users by clearly telling users who to do to keep their blood sugar in range.
Get support from community
Provide support from friends, families and other diabetics to get encouraged and keep active.
DEVELOP
Pick one idea to proceed
The first step to designing a solution is to explore as many ideas as possible. Some ideas I brainstormed include a forum for healthy eating, an add-on calculation feature to current diabetes app, etc. I use three metrics to filter out a direction: user impact, technical feasibility, and market space. Finally, I decided to design an app sharing nutrition information for meals in restaurants because it helps healthy eating and has no direct competitors at present.
EVALUATION OF SOME IDEAS
STORYBOARD
Context and user flow
Before sketching out app screens, it is important to map out the user journey of eating in restaurants using the app since it clearly shows when, where, and how users interact with the app and main tasks required to reach their goal. I created a storyboard to display the flow.
What information do users care most?
Another step before sketching is to establish an information hierarchy that matches users' mental model. In this case, it is focused mostly on restaurants and meals. All information should help answer the question "Does this restaurant provide a meal that is good for my diabetes?"
SKETCHES & WIREFRAMES
From task flow to designed wireframes
To translate a user flow to a designed app, I started with rough sketches to envision the solution visually. Then I created wireframes for three main tasks to test, review and iterate on.
CHALLENGES & ITERATIONS
Make the design more useful and usable
What is the function of the home screen?
Users want to easily find a restaurant they can go to. This means the home screen should provide brief but important information for users to quickly decide if a restaurant meets their demand or not. Therefore, instead of allowing users to view multiple restaurants at one time, more space is given to one restaurant to display more information such as images of dishes and open time. Also, filters and sorting are added to the top to support restaurant finding process.
Empowered by a community
Having only one person count nutrients in meals is discouraging. Having a community work on it is not. The core intention of building the app is to let diabetics share their calculation results with other diabetics to avoid repeating the calculation work for the same meals.
Make the calculation efficient
Efficient calculation means fewer steps and easier operations. This influences what UI widgets to use, where information is displayed and what the interaction will be. I created two concepts and decided to use the second concept because it allows adding all ingredients at one time without jumping between screens and the operation is more intuitive.
Concept 1: A central hub for added ingredients
Concept 2: Adding multiple ingredients at one time
DELIVER
Final design
Browse
Search
Browse & search restaurants
Users can explore a recommended restaurant list, filter and sort the list and search a specific restaurant by its name.
View a restaurant and its dishes
Users can look at basic information and menu of restaurants. For dishes in the menu, its nutrition information is provided in the app. Users can also look at tips given by others who tried the meal.
Overview
Dishes
Nutrition Facts
No Nutrition Facts
Tips
Calculate and share nutritient
If no nutrition information about a meal can be found, users can easily calculate nutrients by themselves using the in-app calculator and add the information to the meal so it is shared with the whole community. They can also choose to save it as their own private meals if they do not want to share.
Saved restaurants and meals
Users are able to save restaurants and meals they are interested in to review later.
Saved restaurants
Saved dishes
Profile & activities
Profile screen shows all meals users calculated and saved and all reviews and tips they published.
