FITBIT

Scroll Down

OVERVIEW

Fitbit, one of the front runners of health tracker devices, allows people to track their achievements during exercise and assess the data via the Fitbit smartphone app.

By reorganizing and centralizing large amount of users’ health data collected throughout the day, this project aims to deliver the data easily and more efficiently so that users can get motivated to make healthier choices in their daily lives.

TEAM

Goen Kim,
Jiwoo Kim,
Millie Lee,
HB Park

PRIMARY ROLE

Research, Wire-framing,
UI/UX Development, Prototyping

MAIN TOOLS

Figma, Miro, Adobe XD, Photoshop, Illustrator, After Effects

CURRENT PROBLEMS

My team picked Fitbit app for the case study since the app has many great features but the interface was confusing due to these reasons:

Misleading Menu

Allocating categories to insignificant features.
Could be more intuitive in terms of menu naming.

Scattered Data and Countless Dead-ends

Each data and feature has open-loop resulting in countless dead-ends.
Too many unrelated features are put under the same menu.

Limited Personalization

The lack of customizable features discourages the users.
Limited availability of challenges and adventure features.

MAIN FEATURES

INTUITIVE NAVIGATION

Put important features up front for the menu.
Straightforward menu names.

CONSOLIDATED DATA &
CLOSED-LOOP FLOW

Link data analysis pages from related features to create closed-loop navigation.
Gather related data on the same page.

CUSTOMIZABLE CHALLENGES

Users can create and customize existing challenge features
Customization allows users can diversify their challenges and adventure features.

DESIGN PROCESS

01 EMPATHIZE

EXPLORATORY RESEARCH

In the beginning, my team thought Fitbit users are limited to certain types of health-conscious individuals and approached this case study as a simple usability issue.

However, as we dig deeper into research, we found out that the issue was not as simple as we initially thought. Everyone was using the app and their trackers differently. So, we decided to extend our research to broaden our understanding of the users and the market at a global level.

1 on 1
USER INTERVIEW
SESSIONS

Some of the questions we asked the interviewees and also during our interview sessions were:

Why do you use wearable health trackers?
Why Fitbit or why not Fitbit?
Do you think the health data is reliable?
Do you log on the app or on your device?
Did your attitude toward fitness change after using health trackers?

We also analyzed comments and reviews from various health trackers’ user communities and app store reviews to empathize with users.

Interesting thing was that most of the interviewees were using a limited number of functions according to their preferences regardless of demographics.

“I got it as a present from my friend who heard that I was suffering from sleep deprivation.”
– Jane, 60

“After the COVID pandemic,
I just wanted to know how much I walk in a day.”
– Leah, 27

“The only time I wear the tracker is when I go to the gym. I take it out when I get home.”
– James, 34

COMPETITIVE
ANALYSIS

Other than Fitbit, we researched four different wearable health trackers and analyzed user feedback to understand Fitbit’s market competency.

ARTICLES &
CULTURAL
STUDIES

0 +

Due to the pandemic, global health awareness has increased and market demand for health trackers grew accordingly.

There were many existing academic and market researches on Fitbit and other wearable devices. So, my team gathered raw data from the research on a Miro board. From that, we derived different demographic, cultural and market insights about Fitbit to empathize with users through UX research methods.

To get a broader understanding of the users actually want and need from the Fitbit app, we grouped and categorized collected feedback together.

AFFINITY MAP

02

DEFINE

Fitbit automatically tracks detailed information about users’ physical movement throughout the day. By reorganizing a large amount of collected health data, Fitbit aims to help users utilize the data and have a good sense of their physical conditions in order for them to get motivated to make healthier choices every day.

After interviews and extensive research, 12 common pain points stood out to my team and we decided to focus on 5 of them for our case study.

PAIN POINTS

Navigation

Data
Visualization

A HASSLE TO
LOG activities

Limited
FEATURES

Delayed in
Sync

Dashboard
Layout

Too much
Scrolling

WHAT DO
THESE NUMBERS
MEAN?

Confusing

Hidden
Data & Info

Old app is
better

BORING &
DISCOURAGING

Since each user’s preferences were very different, my team decided to look into causing factors of the pain points and derived some interesting key insights about motivation, navigation, and data analysis.

KEY INSIGHTS

SEEKING FOR
MOTIVATION

Most users expect to be easily motivated by looking at the app.

LOST IN
NAVIGATION

Scattered data makes users feel lost and discouraged.

MEANINGFUL
DATA ANALYSIS

Data remain meaningless to users without delivering analysis and understanding.

We created an empathy map to put ourselves in the user’s shoes.

EMPATHY MAP

PERSONAS &
USER JOURNEY MAP

Using what we learned from the empathy map, we extended three user personas to diversify and specify targeted user types.

Brianna, 20

Brianna is a Motivation Seeker who likes team sports and outdoor activities, but things have changed because of COVID-19. She is motivated for exercise and diet but gets bored easily. She needs a simple food log and exciting challenges.

Alex, 35

Alex is an Aspiring Starter and introverted person. He gained a lot of weight while working from home due to COVID-19. He is motivated to exercise and lose weight. Due to his highly competitive spirit, exciting challenges and adventure programs attract him.

Megan, 45

Megan is a Motivation Seeker and a mother of 2 children working at home during COVID-19. She often goes for a run and do tennis on the weekend. She has insomnia because of increased stress since she stays at home all day with children and overworked tasks.

To gather further insights, my team started to create How Might We(HMW) questions for major pain points brought up by the users.

HOW MIGHT WE(HMW) QUESTIONS

Communication

Challenge

Motivation

Usability

Visualization

Sleep

Healthy Diet

Workout

In the end, we came up with a single question that encompasses the overall values of our case study.

How Might We
help users to feel in control of their health w/ a large amount of data from fitness tracking?

03

IDEATE

ASSUMPTION MAPPING

My team examined our assumptions about existing and new app features according to ‘Do they?’ ‘Can we?’ ‘Should we?’ questions to sort out and eliminate undesirable features.

OPEN AND CLOSED CARD SORTING

Before constructing Information Architecture, we conducted open and closed card sorting with four participants. Card sorting sessions played a key role in prioritizing and finalizing the entire structure of the new Fitbit.

OPEN CARD SORTING

CLOSED CARD SORTING

INFORMATION ARCHIECTURE

After analyzing the existing information architecture, we reorganized and simplified the structure according to the previous studies.

04

PROTOTYPING

Fitbit is a lot more complex app than how it initially looked. So, our design goal was narrowed down to deliver information efficiently because users had trouble catching hierarchy between each feature from the open card sorting sessions. We sorted out the main features from each tab and created user flow and then created wireframes for each screen.

Low-fidelity Screens and User Flow

PROTOTYPE

Since the Fitbit app initially has a lot of functions, we decided to narrow down the features we want to have for the case study. After making a minimum viable product(MVP), we decided to create about 80+ pages for more accurate usability test results.

VISUAL DESIGN SYSTEM

Fitbit users did not have many pain points related to visual designs. Since my team decided to focus on improving data visualization, various colors were used to deliver information promptly. Even with many colors, the overall design kept minimal by applying colors to small portions of the screen.

USABILITY TESTING + ITERATIONS

Throughout the project, we conducted usability testings multiple times to validate our ideas before articulating the app. During iterations, we were able to modify from IA and user flows to touch target sizes.

HIGH FIDELITY DESIGN

After iterations, we developed from low fidelity to high fidelity design gradually. Because there were so many features to start with, we had to prioritize finalizing IA and data visualization.

1. Today

Displaying today’s overall data and daily goal progress, the Today tab focuses on providing users’ current health status with brief explanations and instant logging options.

2. Challenges

With an intuitive menu name, users can access their favorite challenge programs directly from the home screen. Personalized challenge options are provided for the motivation seekers.

3. Data

For a deeper and more meaningful analysis of the user’s health data, the Data tab is a gateway to every tracked health data. Not only users can find detailed data, but the tab also offers daily, weekly, monthly health highlights.

4. Social

Users can share their photos and videos with other Fitbit users or join groups to stay motivated. Displaying badges next to usernames can encourage more engagement.

FINAL FIGMA MOCK-UP

Please feel free to play around!

05

VALIDATE

USABILITY TESTING

After the completion of our prototype, each team member conducted usability tests. Besides asking questions about data visualization and navigation, we gave participants a task to create a challenge to validate our hypothesis about motivating users with personalization.

We made some changes to the layouts, task flow, and interactions based on their feedback. Here are some of the main feedback:

“I was not sure whether I am supposed to put preferences for every single item or not. Also, didn’t know I was only allowed to select one item at a time.” (too much information on a single screen)

> For creating a challenge, an inconsistent number of selecting options confused several users during the testing. So, we put 1 selection for each page and also clarified by utilizing selection controls such as checkboxes, radio buttons, and drop-down menus.

“Why are there the same contents under two different menus?” (lack of visual differentiation)

> Initially, there were no clear differences between today’s dashboard and the data tab in terms of visual presentation and contents. So we decided to show weekly highlights and trends for each item to emphasize data analysis for the data tab and today’s status for the dashboard.

“I didn’t know I could tap and open the ring on the main page.” (lack of visual clarification)

> We decided to make all the tappable sections on the dashboard to card layouts to give visual consistency for same functions.

OBSERVATIONS

Interesting things we have observed were:

Users were very curious about the health data and analysis regardless of their age and fitness preferences

Having customizable challenges helps users to engage more about their health consciousness.

WHAT I LEARNED
& NEXT STEPS

WHAT I LEARNED

For this case study, we prioritized working as a team focusing on delivering complex data to users to motivate them to have a healthier lifestyle. Besides learning prioritizing and other skills, there were big lessons I learned. Here are the two most important ones:

1. WORKING AS A TEAM

The best thing we earned by working as a team was that members can bring a lot bigger synergy than just multiplying by our member numbers. For us, it was being able to have multiple iterations based on user feedback. This led our project to become more of a Lean UX and agile experience even though we originally followed the Design Thinking process which is a waterfall cadence.

2. FILLING THE GAP WITH RESEARCH

Throughout the project, we were able to execute various UX research methods by hosting many in-person interviews and research sessions.

It was interesting to actually experience the importance of user interviews and usability tests because there were gap between our assumptions and how users actually think. Also, making modifications based on user feedback helped me truly empathize with users and see the gap between our personal preferences.

NEXT STEPS

For the future direction, it would be nice to elaborate on these features:

Inclusive design
Onboarding screens
Achievement celebration
Wearable device interface design

Especially for the inclusive design, elderly users had major pain points caused by complex onboarding experience and also small text sizes. Visualizing a large amount of data with bigger texts will be challenging yet significant work not only for the users but also designers.