VITA — Building better lives through sustainable lifestyle change

A UX Case Study

Eastina Zhang
UX Planet
Published in
9 min readMay 1, 2020

--

The problem

Australia’s top cause of death is Coronary Heart Disease— a Chronic disease that most of the time, could be preventable through making better life choices.

Our mission was to empower people to achieve healthier, fuller lives through sustainable lifestyle change. We designed a mobile app that would help people make healthier food choices, as part of a larger vision to reduce the risk of chronic diseases.

Put simply, we needed to help people eat better.

This was a student project completed in a 2 week sprint, with a team of four.

My role: project management, leading user research, ideation, low-fi prototyping & testing

The design process we followed

This project was research heavy

We had to find out people’s motivation on why people strive for a better life. But before that, we had to conduct secondary research that framed how we would proceed with user interviews. We wanted to know:

  1. Who were the main players in the mobile health industry ?
  2. Where were people currently going for their source of information?
  3. What else was out there creating and encouraging habit change?

We used a combination of competitive, comparative research and referenced behavioural science papers to answer these questions.

We wanted to see who the main players were

  • MyFitnessPal — main function is calorie and macro tracking
  • Strava — GPS tracking outdoor exercise
  • Apple Health and Google Fit — native apps that collect health data without much user effort

We found that the industry is huge and continually growing, but there’s a lot of competition. It was interesting to note that the leading competitor was MyFitnessPal, even though logging meals required high amounts of user effort (even with their barcode scanning feature).

This contradicted our initial assumptions, and reframed our perspective on how to position ourselves in the market.

We looked into where people currently sourced their information

Top responses from our survey of 103 respondents were:

  • The Internet/Google
  • Specific Websites or Apps
  • Scientific Studies

We were surprised to find that at close 4th was Reddit. We realised that people were living amongst an abundance of information at their fingertips — to set ourselves apart, we’d have to consider how we present information to come across as reliable and trustworthy.

We wanted to learn how other apps were using behaviour science to build and encourage habit change

Duolingo gamifies education by introducing streaks, friendly reminders and competitive leadership board

Flo analyzes user input on period cycles, generating personalised health insights. They had an anonymous forum feature to build a community while keeping personal privacy

Habitica uses temptation bundling: “bundling” something you want with something you should do

Noom published a research paper that discussed painting the bigger picture, celebrating small wins, and also temptation bundling

We spotted some patterns from this comparative research, and these findings later influenced the features of our MVP. At this stage, it was already clear to us that our solution should adopt a friendly, active tone of voice.

Understanding motivations & behaviours

To start defining our target user group and better understand their motivations, we conducted 17 user interviews. We began by speaking with people who had different relationships with food:

  • Those who had never tried or considered changing their diet
  • Those who had tried but failed
  • Those who had long-term success in changing their diet
Affinity mapping interview insights

Key findings

I think healthy eating means…”

I feel like I know what’s good for my body”

  • We often heard users say “I think” when asked what healthy eating meant. Why weren’t they saying “I know”?
  • There were many personal reasons why someone would make a diet change, but everyone went after the ‘feel good factor’ — they just want to feel good both physically and mentally
  • The main reason why someone didn’t make healthier food choices was because they “felt fine” right now — they couldn’t see the long term impacts their actions were making on their future selves

Defining the user

Our target group were people aged 18–35

  • From research, most of the people in this age group were open to using health apps.
  • We considered that people of this age group were starting to live independently, and had more control over what they ate.
  • We wanted to educate people about healthy eating before heart disease becomes the first underlying causes of death.

Leading underlying causes of death, by age group, 2015–2017

Source: AIHW National Mortality Database

The Solution? Or so we thought…

We defined a problem statement for Rachael, and continued on to hold a full day of design studio, sketching out 100+ ideas.

  • We found it very difficult to distill all the ideas and find the MVP
  • Going back to the persona’s needs and frustrations, we realised that something wasn’t right…

Rachael’s needs and frustrations seemed to cover just a bit of everything — we couldn’t work out what would be valuable to her

Our initial persona, Rachael

Revisiting the Persona

Our initial persona felt ‘fake’. We had boxed ourselves into this imaginary user who seemed to need a bit of everything, and did not have a lot of depth.

Perhaps it was because we were dealing with such a huge amount of information. 17 user interviews had landed us at 400+ insights (thank god we were using virtual sticky notes and not real paper ones here).

We revisited our research insights, and reorganised our information by similar experiences, attitudes, and values of all the interviewees. That generated these three main Archetypes from user journeys and mindsets:

We chose the persona that would be able to complete our tasks the easiest: Derek

Meet Derek

Derek started dieting a year ago with his main focus being on losing weight and changing the way he looked.

He has since felt more confidence in himself, and along his journey, he started noticing other benefits like having more energy and higher levels of productivity at work. He wants to go deeper into it to realise his full potential.

Behaviours

  • Uses MyFitnessPal for calorie counting
  • Cooks at home for most meals
  • Tries to do some of his own research into nutrition science to stay informed
  • Really enjoys the sense of accomplishment

Needs & goals

  • Needs a reliable source of information about diet & health
  • Needs a centralised way to measure progress and the impacts of diet on his health & wellbeing
  • Wants sustained productivity & physical performance from diet

Pain points & frustrations

  • Wants to try some different diets but self control & discipline are challenges when starting a new diet
  • Not sure if information online is reliable
  • Some diets he tried in the past were too restrictive

The Solution?

An app that gives users healthy food suggestions as alternatives to things they’re craving. The recipes are largely plant based and have a whole-foods focus. This is paired with a mood journal that also visualises health data from integration with their other apps.

VITA would also provide personalised insights and dietary advice, so that users could have a centralised way of seeing their physical and mental wellbeing, in relation to what they ate over time.

VITA — Changing lives, one broccoli at a time

Ideation

We tried to salvage any relevant ideas we had from the design studio we held based on our previous persona first. Prioritizing features for the MVP was surprisingly easy this time round, as the needs, frustrations and values of our persona were now clearer and more specific.

Initial user flows and wireframes

How might we make it a long term lifestyle change for Derek, instead of a short term diet?

  • Give healthy recipe alternatives to things he’s craving
  • Suggest healthy recipes that are personalised for vegetables he loves
  • Use gamified streaks and achievements to reward his consecutive good habits

How might we provide Derek a trustworthy source of information?

  • Attach articles and scientific studies to suggested recipes
  • Include recipes that are created by certified dieticians and nutritionists

How might we show Derek the impacts of his diet choices?

  • Daily logging into mood tracker
  • Generated insights on the long term effects of certain food choices
  • Visualise the rest of his health data together against his diet choices

Prototyping & Testing

Testing to validate user flows, clarity of copy, and hierarchy of content

Low-fidelity paper prototype

Key findings

  • Main page ‘LOG MOOD’ button stood out too much, and was unnecessary
  • Charts and graphs meant nothing without the proper copy
  • Users expected to be able to click out of notifications when they pop up
  • Achievements and badges feature was a winner — All 5 users expressed delight at this feature
Mid to high fidelity prototype development & iterations

Iterating the design based on user feedback

  • Simplifed the data visualisation on the Journal page, as the hierarchy and copy was difficult to understand
  • Adopted a graphical traffic light system to indicate additional info instead of blocks of text to improve readability
  • Added more information such as calories and recipe difficulty at a glance, as users had expected to see it

Considering about color, and VITA’s visual brand

We looked at the colors used in the healthcare industry, and as expected it was predominantly blue. We needed to position ourselves differently, so we chose purple as our brand colour — it’s modern, youthful and playful.

Left :Colors used in the healthcare industry, Source: 99 Designs | Right: our logo and design system

We reasoned further that purple is a warm and cool combination that blends the passion of red with the serenity of blue, and helps to make us come across as cutting-edge and wise.

We set up a design system before we approached the high-fidelity prototype, which helped keep the project unified.

Onboarding click-through
Craving swap suggestion
Achievement badges
Journal page

Conclusion

Next steps

  • Further user testing on hi-fi prototype, optimise visuals (fix the contrast on call to action buttons)
  • Integrate native food & activity logging so the app will be usable for wider audiences / not be dependent on integrated apps
  • Refine copy to reduce cognitive overload on certain pages
  • Test on a secondary user group and iterate based on feedback

What I’ll do differently for future projects

Two very important process-related takeaways for me.

  • Create high-level personas/mindsets. We lost a bit of time going back to research and making sure our persona and MVP were strong, but it was worth it — Research is the foundation for design
  • Use proper copy from the start. We could really see from this project that so much of the design is in the copy. We should have started doing content strategy earlier on to create a stronger final design.

Learnings on remote collaboration and presentation

Lastly, this project was carried out from start to finish remotely. We worked for 2 weeks collaborating in Figma, Miro, and Google slides while on a Zoom call.

It was even more important for video presentations to have engaging slides and have a tight speaker dynamic — the audience is seeing just our slide and speaker video on their screens.

I was really proud of the tight collaboration we maintained as a team — open communication, making sure our visions were aligned the whole way through. This is definitely something I will strive to bring to my next project.

--

--

An architect turned UXer. I’m a perpetually curious, critical and creative thinker hungry for next my adventure