HabitHero

Daily Goal

This week points

Update goal

80

pts

Goal history

Daily Plan

9:41

Hi John!

Home

Activity

Scan

Reward

Profile

Steps

4,200

10,000

Steps

Distance

6.3

10

Km

Heart Rate

120

125

Bpm

Calories

1,000

2,000

Kcal

Home

Activity

Scan

Reward

Profile

Rewards

March

Week 1

Claimed

Week 2

Claimed

Week 3

Claimed

Week 4

Claimed

April

Week 1

Claim Reward

Home

Activity

Scan

Reward

Profile

9:41

9:41

1,000

Kcal

120

Bpm

6.3

km

4,200

steps

Activity insight

April 2023

S

1

S

2

M

3

T

4

W

5

T

6

F

7

S

8

S

9

M

10

T

11

W

12

T

13

F

14

S

15

S

16

M

17

T

18

W

19

T

20

F

21

S

22

S

23

M

24

T

25

W

26

T

27

F

28

S

29

S

30

9:41

Activity insight

April 2023

S

1

S

2

M

3

T

4

W

5

T

6

F

7

S

8

S

9

M

10

T

11

W

12

T

13

F

14

S

15

S

16

M

17

T

18

W

19

T

20

F

21

S

22

S

23

M

24

T

25

W

26

T

27

F

28

S

29

S

30

6.3

km

4,200

steps

4,200

steps

120

Bpm

1,000

Kcal

Home

Activity

Scan

Reward

Profile

28

29

27

26

25

23

23

30

22

21

19

18

16

20

17

15

14

13

12

11

10

9

8

7

6

5

4

3

2

1

SAT

FRI

THU

WED

TUE

MON

SUN

􀆊

􀆉

􀆊

APR 2023

You completed your daily goal on 20 days in the last 3 weeks.

Goal history

Home

Activity

Scan

Reward

Profile

PrimeCare . UX Lead . 9weeks

HabitHero is a mobile app that supports users in building healthy, lasting habits through goal setting, daily tracking, and motivational feedback.

Context

HabitHero helps users build and sustain healthy habits through goal-setting, tracking, and motivational feedback. The project's aim was to improve the app's habit-tracking experience by understanding why users struggle to maintain engagement, then redesigning the experience to make progress clearer, more motivating, and easier to sustain over time.

Problems

Underdeveloped tracking flow- Logging meals lacked structure, offering no clear step-by-step process for users to follow.

Clarity Every interface element should be immediately understandable — actions labelled exactly as they behave, removing any guesswork about where to tap.

No macronutrient insight -Users had no way to understand what they were actually consuming beyond a single calorie number.

Disconnected from motivation-Tracking felt like data entry, with no visible link between logging and a sense of progress.

Interface-level friction-Ambiguous CTAs, poor spacing, and inconsistent language further undermined trust in the experience.

To ground the redesign in a real user mental model, a primary persona was developed representing HabitHero's core demographic — motivated but inconsistent users who disengage when tracking feels punitive rather than rewarding.

Daniel Reyes

Junior Marketing Executive

About

AGE: 29

LOCATION: LONDON

FAMILY:Lives alone, visits family on weekends

Traits

BIO

Introvert ———●———— Extrovert

Passive ———●———— Active

Analytical ———●———— Intuitive

Tech-savvy ———●———— Casual User

Goals

​

  • To build and maintain a consistent fitness habit
  • To feel healthier and more energized without needing a personal trainer
  • To track visible progress and be rewarded for hitting achievable milestones
  • To stay motivated through reminders, encouragement, or points systems

​

Frustrations

  • Progress tracking in some apps feels overwhelming or unclear
  • He loses motivation when there’s no personalisation or reward
  • He dislikes notifications that feel too pushy or guilt-inducing
  • Onboarding in many apps is either too long or too vague

​

​

Daniel works full-time in a marketing role that involves long hours at a desk, but he tries to stay active. He plays casual football on weekends with friends and goes to the gym 1–2 times a week, though not consistently. He’s used health and fitness apps before but often stops using them when the experience feels confusing or unmotivating. He’s eager to improve his fitness but wants tools that feel achievable and easy to follow.

​

Tech confidence

“I want an app that makes me feel good for small wins, not guilty for missing a workout.”

  • Uses iPhone and smart wearables occasionally
  • Has used apps like Strava, Fitbit, MyFitnessPal, and Nike Training Club
  • Comfortable with tech, but prefers simplicity over too many features

Motivation Factors

​

Visual feedback

​

Rewards

​

Peer comparison

​

Reminders

Health Habits

Doesn’t follow any strict diets but consciously tries to eat clean.

​

​

Enjoys casual cardio and social sports more than strict routines

​

​

​

​

Keeps hydrated.

​

​

​

Struggles with keeping a sleep routine usually only sleeping 4-6 hours.

​

​

​

USER JOURNEY MAP / Daniel Reyes’ Experience with progress Tracking in HabitHero

Daniel Reyes

“I want an app that makes me feel good for small wins, not guilty for missing a workout!”

expectations

Wants a simple, motivating way to track his progress and stay consistent without guilt.

scenario

Tracking gym or cardio activity over the week in HabitHero.

Stages

Goals

Actions

Thoughts

Pain Points

Emotions

Touchpoints

opportunities

stage 1

Get back on track after a break.

  1. opens HabitHero.
  2. looks for tracking.
  3. skips intro tips.
  1. “okay, lets try again.”
  2. “ Hope, this feels easy”
  1. Too much information at once.
  2. No motivational re-entry feels generic.

Cautious/Hopeful

  1. Add motivational “Welcome back” message.
  2. Weekly goal preview.
  3. Context aware prompts.

stage 2

Log gym or football session quickly.

  1. Logs a cardio session.
  2. quickly scans optional notes.
  3. logs session and exits app quickly.
  1. “Did i log this correctly?”
  2. “ Does this contribute to my rewards?”
  1. Logging feels repetitive.
  2. No immediate feedback is provided.

Disengaged

  1. Instant encouraging feedback “Good job”.
  2. Visual confetti feature or micro rewards.
  3. Save logging preferences.

stage 3

Track visible progress and stay encouraged.

  1. Opens dashboard.
  2. Checks current streak.
  3. Scrolls for progress visuals.
  1. “Am i improving?”
  2. “I wish this graph was more simple”
  1. Graphs are unclear.
  2. No trends shown.

​

Confused

  1. Weekly change summary.
  2. Use colour graphs.
  3. Show streaks & missed days.

stage 4

Feel a sense of accomplishment.

  1. Receives a milestone badge notification.
  2. Reads short motivational message.
  3. Shares with a friend.
  1. “Nice, I wasn’t expecting this!”
  2. “I could use ore moments like this”
  1. Reward is vague (doesn’t connect to long-term goals).
  2. Message too short.

Motivated

  1. Link badge to real milestones.
  2. Prompt user reflection.
  3. Suggest next challenge.

stage 5

Stay consistent and avoid guilt spirals.

  1. Ignores reminder.
  2. Opens app briefly.
  3. Feels bad about not logging.
  1. “I’m falling behind.”
  2. “This feels like a chore now.”
  1. Guilt based push notifications.
  2. No re-entry strategy.
  3. No new challenges or rewards.

Demotivated

  1. Gentle re-engagement notifications.
  2. Offer goal resets or new streaks.
  3. Reinforce small wins from the past.

HabitHero User Journey Map

Prime Care

Mapping the end-to-end experience across a full tracking cycle — actions, thoughts, and emotional state at each stage — surfaced two critical friction points: a lack of immediate feedback when logging progress, and vague, guilt-driven messaging that risked disengagement rather than encouraging return.

The Dashboard

Initially built around raw numbers and dense daily stats, HabitHero's early interface struggled to make progress feel motivating rather than transactional. This limited how clearly users could track their own consistency, and created friction at the exact moment the app needed to build trust.

HABITHERO DASHBOARD (MVP)

Usability testing on the mid-fidelity wireframe surfaced specific friction points as the design evolved:

Users struggled to locate detailed calorie information from the dashboard

Feedback requested clearer insight into macronutrient consumption

Confusion around how and when to log meals

A preference for quick access to high-priority health metrics

To address these findings, the redesign focused on making progress legible, trustworthy, and quick to scan:

MID-FI

HIGH-FI

Refined into clear, card-based groupings (Steps, Distance, Heart Rate, Calories), improving scannability

Improved visual hierarchy through consistent spacing and grouping

INTRODUCING

INTRODUCING

Calorie Detail

Made visually distinct and clearly tappable from the dashboard, resolving the navigation confusion testing revealed.

​

Replaces raw numbers with a circular progress ring and structured macronutrient table, giving users an at-a-glance visual read instead of requiring interpretation.

Progress & Streaks

Meal logging was separated into clearly labelled tabs, breaking a confusing task into manageable steps.

​

Streaks and an achievements section were introduced to reinforce motivation and celebrate consistency, directly answering the core finding that users needed to see their own progress to stay engaged.

Design Principles

Project takeaways

Designing Before There's Anything to Design — Much of this project happened before any interface existed: understanding Daniel's motivations and frustrations, mapping his emotional journey through the app, and identifying friction points shaped every screen that followed.

Testing, Shapes Better Decisions Than Assumptions — Usability testing on the mid-fidelity wireframe surfaced real points of confusion I hadn't anticipated, directly informing the calorie detail redesign and the shift to card-based meal logging.

Motivation Is a Design Problem, Not Just a Content Problem — The biggest insight wasn't a missing feature — it was that users couldn't see their own progress. Solving that meant rethinking visual feedback across the entire app, not adding one new screen.

This project reinforced that motivation isn't just a content problem it's a design problem. Making progress visible, trustworthy, and easy to track turned out to be the difference between an app users try once and one they actually stick with.

Users struggled to locate detailed calorie information from the dashboard

Requested clearer insight into macronutrient consumption

Preferred quick access to high-priority health metrics

What usability testing revealed

MVP version

9:41

Hi, User

Home

Goal History

January

January

Jan

Your Plan

Steps

Steps

10,000

10km

125bpm

2000kcal

Nearly there, keep going!

7,000

3.0km

120

1200

Distance

​

Heart Rate

​

Calories

​

Trends

Unavailable

--BPM

--BPM

Latest

Range

Active Energy

9:41

Steps

Today

Resting Energy

1,486kcal

7,000

​

3:09pm

8:12pm

53

pts

Daily Goals

This weeks points

Update goal

9:41

Daily Goals

Browse History

Steps

Distance

Heart Rate

Calories

Home

Activity

Rewards

Profile

Home

9:41

Calories Details

Breakfast

Lunch

Dinner

300kcal

Calorie intake

Great Job!

You burned an avergae of 141 kilocalories a day over the past 7 days.

Active Calories

Average kilocalories

141kcal

F

T

W

M

T

S

S

LOG

Carbs 28g

Fat 12g

Protein 11g

Macros

Nutrients

Calories

Protein

Carbohydrates

Fiber

Total Goal Left

11

1

28

102

91

256 228

25 24

1815

kcal

Your progress

​

Remember a healthy outside starts from the inside.

​

keep going!

9:41

Your Progress

Home

Daily

Monthly

Weekly

Fat

1500

5 days in a row

Start a Streak Challenge to boost your activity!

Start Streak Challenge

Log 3 meals to meet your goal and start a streak!

Goal

Goal: 1815kcal

2000

1000

Daily Calorie Intake

Today's Achievements

Today

So far your calorie intake has been higher than recent days

2315

kcal

909

kcal

906/1815

kcal

Protein

Carbohydrates

Consumed

Burned

Remaining

Macronutrient Targets

Proximity & Common Region Related elements are grouped, unrelated ones are separated — using spacing and containment to signal what belongs together at a glance.

Match to the Real World Interface language should reflect what users already know — familiar units and terms, not invented ones that add friction.

Continuity The eye follows a continuous line — streaks and trend visuals let users read progress as one sustained journey, not disconnected data points.

Investigating engagement more broadly, meal and calorie tracking emerged as the area with the clearest gap between what users needed and what the MVP delivered. With problems such as :

Progress you can't see isn't progress you'll stick with.

The objective was to transform an unclear, inconsistent interface into one that makes daily progress visible, motivating, and easy to trust. This was achieved by establishing which design principles to prioritise.

CHALLENGE

Understanding Users

Closing Thoughts

Process

New ways to build habits that stick.

RESULT

Home