Nutrio app
Your personal nutrition tutor
2 months
Personal project
Jan 2022
Overview
The problem
Studies determined that population in Lithuania lacks knowledge about healthy eating recommendations. Currently, national nutrition policy targets include reducing adolescent and adults overweight, however, statistics show that obesity and overweight rates in Lithuania are consistently growing.
It is also determined that education to improve understanding of nutrition principles should start as early in age as possible since habits acquired in young age, will more likely to remain in adulthood.
In addition, I have noticed that it is difficult to find a reliable, up to date and free information sources on nutrition topics relevant for young adults.
The goal
Design a tool that would help to improve eating habits of young adults.
Nutrio is an app that helps to track nutrition, gain knowledge and grow healthy eating habits.
Dec 2021 - Jan 2022
My role
UX designer leading the app and responsive web design from conception to delivery:
-
user research (conducting interviews & synthesizing results)
-
paper and digital wireframing
-
low and high fidelity prototyping
-
usability studies
-
iterating on designs
-
determining IA
-
responsive design
Main findings
-
young adults understand the importance of healthy diet and nutrition.
-
most of them would like to improve their nutrition habits if they knew an easier way.
Understanding the user
The research
In order to find out user expectations and motivations while learning about nutrition, I developed several questions and interviewed five people. It also helped me to identify gaps and challenges users face while looking for information about nutrition & healthy eating habits.
Major challenges and pain points:
Meet the users
In order to better understand and empathize with the user, based on user research I created personas.
.jpg)
Wrote down user stories
And created user journey maps
Getting to know the market | Competitive audit
I needed to understand how similar products position themselves in the market and identify potential gaps. I analyzed 4 direct and indirect competitors on the market.
Main findings:
Ideation
To come up with initial ideas for the product, I did a How Might We exercise and tried to generate as many ideas answering the questions I raised, such as:
-
How might we provide users with relevant, personalised content so they don't have to put much effort and time looking for it?
-
How might we make experience engaging and fun?
-
How might we make content easy to access anytime from anywhere? With slow/no internet connection?
-
How might we make content consistent and trustworthy?
-
How might we make content free?
-
etc.
Followed with a Crazy Eights exercise to brainstorm how could those ideas look like.
Starting the design
Before moving forward to create paper wireframes, I needed to think about information structure within the app. Thus, I created a sitemap to guide the organisational structure of each screen’s design.
After ideating and drafting paper wireframes, I created the initial digital low - fi wireframes.
Designs focused on providing indulging learning experience as well as easy and quick way to get daily balanced recipes.
To prepare for usability testing, I created a low fidelity prototype. First, there is a learning about nutrition experience and second, there is a recipe search.
Usability testing
Study parameters:
-
Moderated usability study
-
5 participants
-
25 min session
After completing interviews, I needed to synthesize study results and find common themes among them. For this I used Miro.
Then I turned themes into patterns & insights.
Main insights from study findings
Nutrition tracking:
Add an easier option to add consumed food items to see its nutrition info.
Nutrition facts:
Add nutrition info section next to recipes and also include vitamin information.
IA:
Reorganize main learning page so that main information is easier to distinguish among other information.
Refining the design
Based on insights from usability study, I added an way to quickly add a nutrition info to user's nutrition tracker by scanning a barcode of food item label.
Secondly, I redesigned how users see main information in their learning page. My goal was to make the ongoing lessons easier to distinguish among the rest of information on screen.
Accessibility considerations
Different size headers and body text used to make content accessible for a screen reader
Use of icons to make usage of app more accessible and easier to understand
I used colours which contrast ratio is considered accessible as per WCAG requirements
Responsive design
Sitemap
With the app designs completed, I started working on responsive website design. Same as when creating the app, at first I created a sitemap to come up with the structure of each screen’s design to ensure cohesive and consistent experience across devices.
Responsive designs
Designs for screen size variation included mobile, tablet and desktop devices. I optimised the designs to fit specific user needs of each device and screen size.
Project takeaways
Impact
During usability studies users shared that they would try using such tool as they feel that it could really help deepen knowledge about nutrition and help improve their eating habits. Here is a quote:
“I would like to see how my eating habits and well being change if I had access to easy to use and free tool like Nutrio".
What I learned
Even though the problem I was trying to solve was a big one spread worldwide, diligently going through each step of the design process and aligning with specific user needs help to come up with solutions that are feasible and useful.
Next steps
Conduct a round 2 usability study and iterate on designs.
Conduct research on how successful young adults are in improving their nutrition and dietary habits.
Prioritise and implement changes in the app & web, identified after usability tests.
Final notes
As this case is one of my first projects, my goal was not to achieve perfection but rather to experiment, practice and learn by following design best practices.