karmen wong
UX designer

HABEAT:
Pocket Diet Coach

A personalized diet coaching app designed to set you on the right path of developing healthier habits towards weight loss

Image alt tag

Type:

Individual Project

Tools:

Sketch, Miro, Invision

Duration:

6 weeks

Role:

User Research, Product Design, Branding, Usability Testing

The Problem

The process of starting, enduring and transitioning from a weight loss journey is an emotional experience where issues of information overload, stagnation and confusion can arise. Moreover, the time and energy spent figuring out why weight loss isn't happening creates frustration and wreaks havoc on one's confidence.

How might we help to provide the tools for people to establish and maintain a diet that works for their lifestyle?
HABEAT: Your Pocket Diet Coach

Research

Understanding the broad problem scope

  • According to the Global Wellness Institute, the global health and wellness industry is now worth $4.2 trillion.

  • While the industry of health and wellness continues to throttle, obesity continues to be one of the world’s largest health problems.

  • Healthy weight loss (in the most basic sense) can be achieved by consuming less calories than your total daily energy expenditure (TDEE) a.k.a. your maintenance calories.

The industry is saturated with different diets, products and methods for weight loss when there's money to be made. This includes the variety of applications that have come to fruition in response to peoples’ great desire to lose weight. A lot of the solutions available today are either too overwhelming with information overload or too underwhelming and do not set the user up for success from the start. We look to meet the user in the middle with their needs and set them on the right path to success, self-empowerment and accountability.

Survey & Interviews

To understand the problem scope and the dieting experience, I conducted an online screener survey that had 8 respondents and selected 5 people to continue on in semi-structured interviews to learn more about their experiences with their journey with weight loss.

Key Findings:

  • Though all respondents had varied lifestyles, they all had a job that kept them mostly at their desks which contributed to a large sedentary portion of their day.

  • Everyone has a different reason for their spark of interest in weight loss. This varies from looking good for a specific event to inspiration for overall change to becoming healthier to avoid disease.

  • People do not enjoy manually tracking and logging meals because it is tedious. This also made dining out a struggle.

  • Hitting a plateau was also a glaring issue in the weight loss journey.

  • The lack of accountability is another challenging obstacle in the commitment to change. Everyone has different levels of motivation but are all susceptible to straying off path of their goals.

Synthesis
Affinity Map

Affinity Map

Personas

The key findings helped me gain a deeper understanding of the potential users of HABEAT as well as helped guide what features that I should focus on within the app. Deeper understanding of the problem and the user aided in the development of these user personas.

HABEAT: Your Pocket Diet Coach

Design & Ideate

User Flows

After conducting user interviews, competitive analysis and creating our user personas, I decided on three flows that I'd like to focus on in this mobile app concept to address the frustrations and needs of our potential users- onboarding, weekly check-in and post goal completion.

HABEAT: Your Pocket Diet Coach

Sketches

To quickly test the concept, I created paper prototypes that demonstrated the key user flows. The paper prototypes allowed me to brainstorm solutions for three paths I wanted to focus on without overextending.  I conducted guerilla usability tests using the paper prototypes to further iterate on any changes I should make when moving into the mid-fidelity wireframe stages.

Onboarding screens

Onboarding screens

Wireframes for onboarding

Wireframes for onboarding

Wireframes

Sketches then translated into digital form on Sketch through mid-fidelity wireframes to better convey the design from screen to screen.

Style Guide

I started designing high fidelity prototypes after creating a style guide for the user interface and determining major design components of the app. Sketch was used for UI design. (See below video for style guide. There is no audio.)

HABEAT: Your Pocket Diet Coach

Prototype

Onboarding

The inspiration for starting on a weight loss journey varies from user to user. However, the confusion that comes in where to begin is a common complaint that users share, particularly those who are new but also to those that have become stuck in the journey.

The onboarding process on HABEAT consists of:

  • Filling out a basic profile

  • Setting a goal and timeframe for weight loss

  • Caloric and macronutrient targets are personally determined by your profile selections

  • Optional walkthrough of dashboard features

HABEAT: Your Pocket Diet Coach

Weekly Check-Ins

Accountability is a cornerstone of success when it comes to dieting strategies. The solution for lack of accountability was explored in the form of weekly check-ins. The weekly check-in process on HABEAT begins with a notification that motivates the user with a positive message and prompts the user to check in for the week.

The check-in process includes:

  • Weighing yourself and logging your weight. This feature aims to ensure the user is on the right track within the timeframe of their goal and the goal weight selected.

  • The weekly changes will determine whether or not the user will need an adjustment in their caloric and macronutrient targets.

  • The user will then have a updated dashboard with either the same targets or newly updated targets.

HABEAT: Your Pocket Diet Coach

Post Goal Completion

As mentioned previously, users have different motivations to embark on a weight loss journey. Thus, having the option to sustain the accomplishments of their weight loss journeys or make progress otherwise should be a staple feature in a dieting coach app. A majority of the users we interviewed stated they gained back the weight they lost after going on a diet because of the lack of accountability.

To aid in the user's ability to sustain their lifestyle while keeping the weight off (or making further progression), post goal completion focuses on that transition by:

  • Celebrating the accomplishments of the user, whether they've successfully completed the goal or not.

  • Providing options, steps and tools to transition to the next stage of their goals.

User Testing

After prototyping my wireframes, I did a testing round in order to reveal possible usability problems. Due to Covid-19, I performed user testing remotely with the users.

Key Insights

  • Keep onboarding as simple as possible. There was previously a group of screens in the onboarding path that required users to input their schedule (which included times they anticipated waking up, going to bed, days they worked out, etc) - A couple users found this to be a little too time consuming in the onboarding process, which made onboarding process more lengthier than they anticipated mostly because they haven't given their schedule much thought. These screens were taken out to better simplify the users experience when onboarding.

  • Try not to overwhelm the user with too many options. When completing your weight loss goal, you had the ability to continue on with using the app to help maintain your weight but also having the option to lose more weight (if possible), gain weight or enter manual mode where you could set your own goals and pace. This turned out to be confusing in terms of the number of options to a couple of the users. They felt that it could be reduced and simplified. With this feedback in mind, the options were reduced to maintain, lose or gain weight on the next iteration.

However, all of the users shared many of the same positive sentiments.

  • Friendly, simple, non-threatening interface

  • Cheery, positive copywriting to align with color scheme

  • Easy to understand when needing to complete a task

  • There are opportunities to learn more about certain things along the way (IE: explaining the important of eating at maintenance)

  • Users grasped the overall roadmap of using the app from setting the goal to finishing. They enjoyed the accountability that it seemed to present and how it takes into account the end stages of when you complete a goal and transition to the next goal- where a lot of similar dieting apps don't provide.

Solution

HABEAT is a mobile app concept that aims to simplify the experience of embarking on a weight loss journey, from start to finish.

To solve the problem mentioned above, I designed HABEAT to alleviate the user's common issues from starting to completing a weight loss goal. Due to the constraint of time, I focused on 3 key features of the app.

  • Providing a proper onboarding experience for a personalized diet coaching app is key to starting on the right foot. It's already confusing enough to figure out where to begin.

  • Weekly check-ins keep users knowledgable of their progress and puts them in a position of control. Lack of accountability plagues the user and their weight loss journey.

  • The opportunity of transitioning off from completing a goal gives the user the ability to maintain their accomplishments (keeping the weight off) or move on to further achieve different goals.

Reflection

Overall, I feel that I was able to successfully build a mobile app concept that really answered the major frustrations and basic needs of my targeted audience and their journey of weight loss.

  • In this project, I was only able to focus on 3 different paths as opposed to a full concept due to the constraint of time. Because of the focus being on these 3 paths, the full potential of them didn't come to fruition because it required building out other connect features. (IE: The weekly check-ins and post-goal completion requires you to edit your meal entries if you have any pending meals. Without the food entries feature built out, I found that it was a little hard to grasp for a couple of the users trying to test.)

  • Interviewing and conducting users tests remotely is already a fairly foreign to me being new to the process. Having to conduct these parts of the process remotely feels like it robs you of a lot of helpful insights that you could have picked up much more naturally in-person. However, with time and practice, this is just another muscle that can be built up.

  • It's incredibly easy to get lost in the sauce when you're in the final wireframing stages nitpicking the aesthetics. The user testing stage after first prototyping brought me back to the problem statement and I was able to iterate a better version at the end of this project. If I had more time, I would have definitely been interested to conduct user testing with a different group of people as I am deeply curious about what other users think and feel about the new version.