Sign in

A step-by-step process on designing an app that helps to track your food intake

A UX case study on how to eat better by changing dietary habits.

Background

Duration : 2 Weeks, group of 3

Tools: Figma, Miro, MarvelApp, Photoshop, Illustrator

Main role: User Research, Market Research, Ideation, Prototyping, Branding Strategy

Teammates: Ellie Warson, Ethan Wong

TL;DR

Personal Learnings and Reflection

  • Trust in the double diamond process especially the emphasis on the “divergent” and “convergent thinking”. Collecting as much information from user research is as important as refining and narrowing down to the best idea.
  • Importance of understanding a persona’s motivation and how motivation can change depending on the context.
  • To be a good researcher is to be a good storyteller too. Now that we have interesting material, next step is to find the right tone to engage your audience from the start to the end.
  • I was not the biggest fan of front phase of double diamond. But at the end, I found UX research fascinating since proving or disproving an assumption helps you to design better for the long run.
  • This story is being told from the group POV, but for my own iteration and if I have the time, I would like to dive deeper into the affinity map to come up with a different solution.

Project Introduction — the WHY?

The project brief given:

According to Australian Institute of Health and Welfare in 2019,

“Chronic heart disease is Australia’s number one silent killer. Anyone aged above 25 could be put at risk. However, early prevention can be done through making better life choices.”

Who is our client and what do they expect from us?

As prevention is better than cure, our client Vita wants to help people to change their habits and live free of chronic disease. By giving people the power to make better decisions through diet choices, the first step is to change their eating habits.

Once people get on board with a healthy diet, Vita’s second mission is to help people implement a plant-based diet.

The question is how can we help people make small choices in their eating behaviour to change their life for the better?

Finding an opportunity to enter the market

As for Vita’s business goal, they would like to scale their program to 100 million users by 2023.

Then we looked at current state of health app markets:

Number of Health App Users from 2017–2020. Source: Statista Survey

As almost 90% of time on electronic devices is spent on apps, we believe that building a health app is the most convenient way as there is a necessity to stay fit.

So is it possible to reach 100 million users by then?

We then looked at the biggest health app users group which are people at the age of 18–45. They are also the early adopters as they are familiar with app usage, and they could give us insight into what potential users will value in a mobile health experience.

Behavioural science behind habits

As we are still in our 6th week of the course, this is a research heavy project.

Looking into most successful habit forming apps..

Momentum and Streaks use goals to increase likelihood of behaviour recurring and making their users feel good. While Habatica gamify the app, unlocking a feature every time you complete a desired task.

Flora — another app that found feeling good about one’s progress was a better predictor of intentions to maintain healthy behaviour in the future compared to people who felt bad about their progress.

This is consistent with VITA’s findings, with participants from IRL (in real life) program that celebrated small wins by displaying better results in the program and the abilities to meet their goals.

Why is positive reinforcement important in changing behaviour?

Positive reinforcement of behaviour helps to form habits because it reiterates peoples success and provide them with a sense of euphoria with their performance.

We found this reward system was present in exercise apps (e.g. Fitbit Watches, Nike Run Club) that congratulate you on your achievement. However, reward was something people did not feel in respect to eating.

Exercise Apps vs Food Apps, High Effort vs Low Effort.

Using this matrix above, we noticed the majority of exercise focused apps are able to provide users high impact with minimal user effort, in contrast with food focused apps which require high user effort, that is sitting on the other side of the spectrum.

This is simply due to the fact that with the existing health tech products such as watches that connect to your apps, whereas there is no such easy technology out there to track eating habits. Thus, one of our goals is to create an easy way for people to do so.

Based on this research, some form of reinforcement or reward is essential in creating long lasting change for individuals. With this being the case, competition to produce a food app is fierce.

Differentiation is KEY

We then looked into MyFitnessPal, our largest competitor and also a primarily food focus app.

MyFitnessPal has a strong focus on calories, macros and nutritional details. However, when you go over your calorie limit for the day, get a negative minus symbol and your calorie intake number goes red. This often acted in a reverse way to which they intended, demotivating individuals to continue monitor their eating habits on a daily basis.

MyFitnessPal calories intake goes red when you exceed your calorie limit.

As mentioned previously, people who receive positive reinforcement do better at healthy eating habit than those who don’t.

VITA’s IRL program has also proven that with the acknowledgement of positive reinforcement can increase participants’ motivation to self-track their dietary habits.

From the research above, we have learnt that if you are going to build a habit, it’s important to learn how they work and how to structure them. So that we can ultimately design our own habits to work for us instead.

3 step model on how habit is formed

The common stage of building a habit:

  • Reminder (a positive reinforcement that motivates the changing behaviour)
  • Routine (the action of tracking their dietary, built up by habits)
  • Reward (the benefit users gained from completing their task and continuously wanting to repeat the cycle)

This is the spot on approach we want to like to implement as our app features.

Validating our research

This research is to be validated throughout our research by talking to the key drivers of our project — the users.

We went on social media to ask questions on what people think about eating healthy, dieting, plant-based diet and health related products that they used. 164 people responded to the survey and our key findings were that 98.4% people agreed that poor diet impacts health but most of them find it challenging to eat healthy.

We dug deeper…

From the 17 people we interviewed..

Time lapse of synthesising our affinity map
Categorizing and giving each subcategory an “I” statement

The 4 main findings of the current landscape:

  1. Everyone has different perception of what health means to them and they all have tried to be healthy.
  2. Most people use health products to help them stay healthy, mostly health apps, for the purpose of socialising and companionship, ability to track improvement and for constant motivation.
  3. The common challenges that users face to stay healthy are lacking control, motivation, time and effort.
  4. Formation of good habits are formed because they saw the rewards gained from doing the behaviour.
  5. Bad habits are hard to break because they have yet to experience any negative consequences.

We looked into reasons why people failed to eat healthy and their perception around health. The question remains: how can we help people make small choices in eating behaviour to change their life for the better?

Creating Personas

Synthesising our extensive body of research, 3 main used cases that constantly emerges are:

  • Those who consistently eat healthy
  • Those who consistently eat unhealthy
  • Those who eat healthy for the most part but struggle to maintain this at time — and we named them the “fluctuators”

To start with a specific group first, we have chosen to focus on the “fluctuators” because this is where majority of our users/surveys respondents lied. We believe we can provide these people with the greatest impact in relation to effort.

Focusing on our “fluctuators”

We created Samantha — who sometimes slip up up on her healthy eating habits due to “lack of time”.

We went on creating Samantha’s user journey and ideating on “how might we provide Samantha a convenient healthy food option“. Our ideation felt restricted as the solutions we produced does not align with the users and business goals combined. Soon, we realized that there should be a more in-depth reason behind why an individual lacks time to eat healthy.

We went back to our affinity mapping and revisited our archetypes. Upon closer analysis, these archetypes could represent what every individual goes through at different stages towards a consistently healthy eating life.

It is not always a linear process from unhealthy to healthy eating, as people often move fluidly between these 3 groups. This is when we recognised an individual’s experience with food is personal and often fluctuates throughout their journey.

We then created another 3 personas based on the used cases: Peggy, John and Miranda.

Peggy became our primary person because our research allowed us to empathise better with her situation.

A journey map helps us to understand her mix of emotions when she caught herself eating too much while the dip helped us to look for opportunities.

This dip in emotion such as guilt, disappointment and regret is a common experience between our other personas — John and Miranda.

Then we were able to generate the following statement:

Peggy needs a way to break her indulgent eating habits so that she doesn’t feel guilty afterwards.

2 “How Might We” statements we developed to help us with ideation:

HMW help Peggy create better eating habits?

HMW help mitigate Peggy’s feelings of guilt after her indulgent eating?

Ideation

We generated a few Crazy 8 sketches based on the “How Might We” statement above..

To narrow down on the final solution, we did a final voting on the best idea.

We agreed that joining a team with your friends could create a healthy competition. This is to motivate users to work towards a healthy goal together and also a possible way to scale as many people as possible.

On the side, we also agreed to give users a diet budget, that shows amount of your diet you can fill with unhealthy snacks and lets you indulge guilt free.

Deciding on the best solution

These decisions were the highest impact, lower effort in order to produce a good outcome for Peggy’s needs and business goals.

Hypothesis

We believe that by providing our “fluctuators” a way to share their food tracking progress with their friends will achieve better eating habits and concurrently reduced feelings of guilt.

We will know this to be true when each user refers an additional 2 people by using word of mouth.

Solution

Users Goal

An app will be the best possible deliverable because mobile is an easy and convenient way to track your food progress as you can access it anytime and anywhere.

After making a healthy diet change, we want to provide individuals an instant result to see improvement — as long as they continue their new eating style. Individuals will receive a daily point budget from which the food they ate are accumulated towards. This is a positive way to reinforce users eat whatever they want, as long they stay within their daily budget.

Business Goal

Users then are able to share their achievement with their friends and see their friends progress on a simple dashboard.

Our research has also proven that health app is on the growth, making our digital product easily to scale effectively to 100 million users in 2023, as they could refer their friends by using word of mouth.

Getting first impression of the app

Task Flow

Assuming our users has already downloaded the app and input their information, this is a simple flow of a user entering a food they ate — Mars Bar.

First Proposed Task Flow

This task flow guides us through the sketching of our wireframe.

Sketching Wireframes

3 tasks given to users for usability testing:

  • Log in a mars bar
  • Sharing this entry with your friends
  • View leaderboard to see how much their friends have achieved
Quick Sketch of paper prototype

Usability Testing Feedbacks

Conducted 5 moderated remote tests with potential users and 1 with one of the stakeholders. The feedbacks we gathered are:

  • Daily login rewards look like a calendar that they didn’t understand
  • Seeing the summary of what they ate yesterday on the home page doesn’t make them less guilt of what they ate
  • Button to carry out the main task wasn’t obvious
  • Suggestions of “tuna sandwich” was weird — are they supposed to eat it after eating a mars bar?
  • Most users were reluctant to share what they ate on Facebook timeline

The feedbacks were mostly positive but there were few issues that we needed to look into. We iterated the design for the second time based on user feedback before moving into Figma.

Branding Strategy

Here comes my favourite part of the design process.

Now that we have adopted app-approach plan, we can start to implement brand guidelines with a consistency theme including logo, icons, typography and colour schemes. It is a way to define a brand by using visuals and language. As VITA is a made up brand, we get to design the brand from scratch.

To maintain consistency throughout the flow of the app.

We did a research on colour palettes used in the industry and opted with colours that will evoke emotions.

Green represents growth and improvement, We used this colour as the logo and progress bar. We are hoping to see improvement and balance lifestyle

Orange represents liveliness and uniqueness. We thought that orange will make a good contrast with green as the tone of these colour could engage and energize users in a less obstructive way.

Font of the logo is different compared to the body text because we wanted to add a fun twist of personality.

The bordering of buttons also appears to be consistent across various screens. This is to make it easier for users to remember and recall the app over a longer period of time.

The Final Design

The first time when a user open Vita, we want them to get the impression that the app is intuitive and fun to engage with.

Final Prototype

Click here for final prototype

Does the outcome reflects our research?

OnBoarding Pages

  • Added onboarding pages at the start to explain point and reward system
  • Restructured daily reward page to encourage users to log in on a daily basis

Log Food

  • Seeing improvement from their health eating habit on home page by feeding them fun facts and a summary of what they ate
  • Provide users positive reinforcement way to enter their food log by adding points instead of deducting
  • Changed ‘claps’ to ‘health point’ that contributed to a health balance
  • Recommendation of healthy alternative food that they are familiar with

Social Elements

  • Sharing achievements with friends who are already on the app
  • A leaderboard to see your ranking based in your country or global
  • Invite friends via social media and earn points from it

Future Features

Now that we have nurtured a strong relationship with the users, it’s time to consider the next steps.

  • Plant Based Diet

As for the second step, Vita wants to help people to effectively implement a plant-based diet, once they get on board with healthy eating.

  • Social Media Sharing

Taking a picture, have the app automatically analyse the macro content of the food

  • Basic Game-design Principles

Now that we have used motivation as the core idea to change their habits, the other elements such as badges, virtual currency can come in. These tangible components will serve as visual indicators as progress.

  • Possible Monetization

VITA operates as a not-for-profit organisation, with most money coming via government grants and philanthropy. Once the app is launched, eventually users will be willing to pay for the app. In the future, we are hoping to use this monetization to reduce on Government’s funding.

  • Future threats

Potential issues this app might have is that people might cheat, however we think this is unlikely. The purpose of users using this app is to solely improve on their eating habits.

Shout Out

Although with COVID restrictions, I think we worked pretty well as a team fully remotely with the help of collaboration tools such as Miro and Figma.

A big thanks to Ross, John and Miranda — our tutors at GA for their guidance throughout this project.

My teammate, Ellie and Ethan for taking charge during the research phase and working together towards a successful outcome.

Interested to have a chat on this project? Feel free to drop me a message on LinkedIn!

UX designer. I take great pride in creating visually elegant designs.