Nutrition Hero
Nutrition App for kids and Responsive Website
Project Overview
The Product:
The Nutrition Hero App is focused on educating kids about healthy eating by teaching them the benefits of eating different kinds of fruits, veggies and grains. Nutrition Hero’s primary target users include kids ages 6 - 10 years.
The Problem
In the United States, about 40% of children are overweight and obese. Teaching kids about healthy eating at early stage of their life is crucial.
My Role
UX designer leading the app and responsive website design from conception to delivery
Project Duration
May 2022
The Goal
Design an app that educates children about nutrition to make healthy food choices with fun and engaging activities.
My 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.
Understanding the user
User Research : Summary
I used the data from USDA, Myplate.gov and Dietary Guidelines for Americans websites on how the food we eat have profound impact on our health, to develop interview questions, which were then used to conduct user interviews. Most interview participants(parents) reported feeling badly about their kids missing important nutrients they need.
The feedback received through research made it very clear that children need a fun and engaging tool to help them build nutrition skills.
Personas
Cooper
“I want to grow strong and tall as my dad”
Goals
●Want to grow strong and healthy
●Learn more about veggies and fruits he eat
●Wants learning to be fun
Frustrations
●Doesn’t know how eating veggies and fruits help him grow
●Picky eater
●Eating fruits for snacks is boring
Cooper is an active and happy child who lives in Wichita with his parents and older sister. He loves to play baseball and tag with his friends. He wants to grow stronger and healthier, but he is a picky eater. He like carrots and apples, but doesn’t like broccoli and bananas. His parents wants him to know the importance of eating vegetables and fruits.
Problem statement: Cooper is a very active child and a baseball player, who needs to learn how eating veggies and fruits help him grow strong and healthy.
Lalitha
“Nutrition education in early childhood is important”
Goals
●Teach kids about nutrition and benefits of eating healthy balanced diet
●Make kids love the food they eat
●Make learning about nutrition fun and engaging
Frustrations
●Kids are not eating enough fruits and vegetables on a daily basis
●Not have enough time to teach kids about nutrition
Lalitha is a mom of three who also works a Business Analyst. She is worried that her kids are not eating enough fruits and vegetables and missing important nutrients they need. She has tried many tricks, but nothing worked. She wants to teach her kids the importance of eating fresh, healthy, balanced food and about nutrition, but doesn’t have enough time.
Problem statement: Lalitha is a mother of three children and a busy working women, who needs to teach her kids about nutrition and benefits of healthy eating because she is worried that her kids are missing nutrients they need.
User Story
Writing a fictional one-sentence story told from the persona’s point of view, helped me to define a design problem that is user-centered, actionable, and clear. It deepened my ability to connect to users' needs by prioritizing design goals and inspiring empathetic design decisions.
User Journey Map
Mapping out the steps, or journey, that users will take when they interact with my designs, helped me frame the users needs more clearly.
Ideation
In this next step of the design process I put all that research from the initial stages of the design process into action. In this phase, I came up with a couple of key deliverables: a Competitive Audit to check out the strengths and weakness of our competitors, and second, ideation sketches through an exercise called Crazy Eights.
Competitive Audit
An audit of a few competitor’s products helped me understand what user needs are already being met in the marketplace, how my design can improve on current solutions and provide me direction on gaps and opportunities to address with the Nutrition Hero App.
The competitive analysis shows that all the apps simply track the food kids eat and reward them. Also what I found missing is that there are currently no apps that teach the kids why they have to eat healthy food or allow them to log a specific fruit or vegetable and learn more information about its benefits.
Crazy Eights
I did a quick ideation exercise to come up with ideas for how to address gaps identified in the competitive audit. My focus was specifically on providing an easy account creation process for parents and reading about important facts about fruits and veggies for kids.
Starting the Design
Digital Wireframes
After ideating and drafting some paper wireframes, I created the initial designs.
Parents can customize each child’s account
Large home button for small hands
Low-fidelity prototype
To prepare for usability testing, I created a low-fidelity prototype that connected the user flow of Parent creating the child account and child learning the facts about fruits.
Usability Study
Parameters
Study type:
Moderated usability study
Location:
Boston, MA
Participants:
3 Children ages 6-10 years,
3 Parents/caregivers
Length:
15-20 minutes
Usability Study Findings
1
READ ALOUD
Younger kids need an option to read the text aloud
2
WORD MEANING
Some kids could not understand the meaning of particular words
3
ENCOURAGEMENT
Kids were feeling bored after a while to read
Refining the Design
Mockups
Based on the insights from the usability studies, I applied design changes like adding Read To Me button and display meaning of a word when you tap on it (add built-in dictionary)
Before usability study
After usability study
After usability study
Additional design changes include adding pages to set daily goals for a child and an animated congratulation message after achieving their goals.
High-fidelity Prototype
The high-fidelity prototype followed the same user flow as the low-fidelity prototype, including design changes made after the usability study.
Accessibility considerations
1
Color contrast between different elements of a page (e.g. text and background)
2
Hierarchy and layout of the pages are logical and organized
3
Leaving enough room to breathe between lines of text and images helps the user focus more on what is important
Responsive Website Design
Sitemap
With the app designs completed, I started to work on designing a responsive website. I used a sitemap to guide the organizational structure of each screen’s design to ensure a cohesive and consistent experience across devices.
The responsive website is used for parent information and account management. It does not have content.
Screen Size Variation
The designs for screen size variation included mobile, tablet, and desktop. I optimized the designs to fit specific user needs of each device and screen size.
Desktop
Tablet
Mobile
Going forward
Takeaways
Impact:
Users shared that the app is very helpful for the kids who are picky eaters. It explains why they need to eat fruits/veggies and knowing about nutrition in early stage of life is important.
What I learned:
Designing for adults' mobile apps is not the same as designing for kids.
Going through each step of the design process and aligning with specific user needs helped me come up with solutions that were both feasible and useful.
Next steps
1
Add more content and other activities like games, videos, challenges
2
Conduct research on how successful the app is in reaching the goal to teach children about Nutrition.
3
Add features to track what kids eat and earn rewards or badges