Case study: nutrition app to fight childhood obesity
Project overview
I can’t start this article without saying that this is my favorite project from the entire Ironhack UX/UI Bootcamp.
It all started with the briefing:
Wellness and health are subjects that I really value and seek in my personal life, so having to think about a wellness tool that can make people’s lives better is something very exciting to work with.
The wellness scope is very broad and can go in multiple directions, such as fitness, mental health, nutrition, and many other niches. To start, I decided that I had to find a real and big problem to target, considering that this app is a tool promoted by the National Wellness Institute. I adapted that to the Brazilian reality, so the first step was to find a wellness problem or gap in that country.
Project Duration: 4 weeks
Tools Used: Figma, Illustrator, and Photoshop
Role: Research, Information Architect, UI, Interaction Design, Prototyping, and Visual Design
Branding : Jhessyka Freitas
Research
Primary research goals:
- Find a relevant wellness issue in Brazil
- Discover the habits associated with that issue
Methods:
- Desk-research
- Qualitative research: in-depth interviews with 5 parents
To start the research I found alarming data about obesity worldwide and in Brazil:
Considering all this data, it was impossible to ignore how childhood obesity and overweight were fast becoming a big problem for public health in Brazil and worldwide. One of the many problems of childhood obesity and overweight is that these children are more likely to develop chronic diseases than healthy children, such as diabetes, high blood pressure, and high cholesterol. Not only that but 8 in 10 obese or overweight children will remain obese or overweight for the rest of their lives, decreasing their quality and length of life due to the many problems they will develop without mentioning the psychological problems these children will face due to that problem.
But why does that happen? How did our civilization go from hunger and starvation to overfeeding and obesity? And why are children so affected by that? All these questions could only be answered by more research. So I decided to go even deeper on my desk research followed by interviews with 5 parents to find out about their daily routine with their kids and how they manage the day-to-day meals and activities.
Definition
With all that information together, it was time to think about what was the main problem I should target. For this project, the creation of the user persona was crucial to think about the problem statement, so I would like to introduce to you, Aline:
Ideation
Now comes the funny and challenging part: what are the ideas and solutions that could help with the solution of that problem?
Although this is the funny part, that’s when I like to research the market and see what solutions parents could find to solve that problem, a benchmarking was needed. So I checked some of the apps and blogs available, not only for nutrition but habits apps that could help people develop new and better habits. I wanted to understand here mostly the mechanisms used to make people stick and succeed at the new habits they wanted.
I analyzed 13 apps in total, not only for the aspects described above but also for Brazil's most downloaded apps to understand what UI elements Brazilian users were most used to (such as navbar, search bar, colors, etc). The reason for that is that Brazil is a country with a low literacy rate, which means, that people either can’t read at all or they read but don’t understand what’s being said. Because of that, many usability problems can come along, so I needed to see the most popular apps in the country and try to replicate some of the UI elements that made such a great audience download and stick to it, including people with low literacy.
Also, I felt I was missing one important part of that equation, the health professionals such as nutritionists and pediatricians, so I decided I also needed to understand what is the protocol they follow once a child is diagnosed with obesity or overweight. I interviewed two professionals, one nutritionist, and one nutrologist MD. Both professionals told that the protocol for childhood obesity involves the entire family, no diet or medicine is allowed for patients up to 12 years old. So the recommendation is that the entire family changes its habits, by introducing a better diet with more fruits and vegetables and less industrialized foods, such as cookies, fries, sodas, etc. They said, that the main problem they face is that the parents often don’t have the time or don’t know how to introduce that “diet”, so they give up after a few times. Also, there’s a lot of nutrition misconceptions such as that calories are bad, or that some industrialized foods are healthy when they aren’t, so there’s an entire education process involved that is very hard to make during the consultation.
So I already knew what direction to follow. The new tool needed to be simple but educative and, should provide features that would allow parents to not only have a better diet but make them learn about the food and actual nutrition facts.
Prototype
I split the prototype phase into two processes: the wireframe and experience development and the other was the branding and UI. The wireframe was developed at the same time as the branding. I did that mainly because I am not the best graphic designer you will find out there, so I had to ask for the help of my super talented colleague Jhessyka Freitas. I shared with her this mood/concept board below:
The most important thing for me was that the app informed and educated parents in a useful way, not as an educational tool. So every feature in the app is useful and informative, in order to make parents visit the app on a daily basis for many purposes. The main features and sections the app offers are the meal planner (main functionality), the food scan that scans and classifies food based on the ingredients list and, the community with tips from health professionals and users of the app. As side functionality, there’s the recipe book, where users can customize and learn new recipes as they wish. With all that I believe the tool will become useful in many situations for the users, helping them achieve the ultimate goal of the app.
Now let’s jump into the part that everyone loves: the high-fidelity prototype. There was a lot — a lot!- of back and forth with the final version of the prototype, mainly with UI elements, such as color, font, and forms. I was not satisfied with anything I came up with. I had put so much effort into the research and experience phases that I felt it was time to show that in the UI in the best way possible. As I am not a designer by graduation, most of my experience is with digital marketing, sometimes it’s hard for me to come up with the best UI solutions on the first or second try. With all that said, I am super happy with the final result for Grow. You can check the prototype in Figma here and some screenshots below. Enjoy!
