The Right Fit — Fitness App Case Study

Jennifer Su
10 min readOct 24, 2021

Type: Bootcamp Project

Timeline: 4 months

Tools: Figma, Sketch, Google Docs, Skype, Zoom

My role: UX/UI Designer: Comparative Analysis, User Research, Synthesizing Research, Style Guide, Wireframing, Visual Design, Prototyping & Testing

Link to The Right Fit Prototype

During the 2020 lockdown, I was looking through online videos and apps for exercises I could do at home. Since I was a beginner just looking for easy routines, I felt like I needed to use multiple platforms to achieve what I wanted. I was watching routines on Youtube, tracking my workouts on an app, and also looking for advice on fitness sites. I wanted an app that allowed me to do it all on one platform. That’s why I took this as an opportunity to challenge myself and design my own fitness app.

The Goal:

To design an at-home mobile fitness experience that allows users to customize their experience, track their workouts, and seek advice on the platform.

The Solution:

The Right Fit is a mobile fitness application that targets fitness needs in the comfort of the users’ homes. The app provides a variety of workout videos for its users and allows them to customize their workout experience by replacing, reordering, or removing individual exercises within workouts. When users have questions they can also reach out to professionals via a call or live chat.

Research

1. A little background…

The shift in my physical activity levels during lockdown prompted me to pay more attention to my physical wellness. Without being to go out and walk around freely, I wanted to find a way to stay active at home. I started with Youtube fitness routine videos, which were enjoyable, but I didn’t find the interface easy to use for exercise purposes.

I then switched over to fitness apps, which allowed me to keep track of my fitness/activity metrics, but I didn’t routines as enjoyable as the ones on Youtube! A combination of these frustrations definitely decreased my motivation to stay active.

Is this an important problem? I can’t be the only one struggling to stay active… right?

I did some research and found that a report stating that over half the adults in the US do not engage in the recommended amount of exercise despite being aware of the health benefits.

  • A survey of 2,000 Americans who exercise at least twice a week found that after gyms reopen (post-COVID19), 1 in 4 Americans said they will never be returning to gyms.
  • A survey of 1,000 Americans done by BeachBody found that the top benefits of working out at home are convenience (44%), privacy (41%), and cost (40%).

Comparative Analysis

What makes a good fitness application? I took a look at the top-charting fitness applications and charted how they displayed workouts, onboarded, milestones, how to search, if they allowed exercise modifications, etc.. This allowed me to identify patterns and best practices in fitness apps.

Screenshot of Comparative Analysis

What I learned:

  • The exercise routines within the apps were predetermined and often not modifiable, only 3 out of 6 applications offered exercise modifications, which showed me that this was an area of opportunity.
  • Each application had a special feature such as a social aspect, competitions, diet logs, badges, and milestones, these help to motivate the users and keep them engaged with the experience.

2. Survey

I sent out a Google Form that included questions about exercise frequency, challenges, motivations, and locations (full list of questions here). I was also able to reach out to interview participants through the survey.

What I wanted to learn:

  • People’s current exercise habits
  • What do people think about working out at home?

What the survey taught me:

  • It disproved my assumption that most people exercised at a gym or fitness center before the lockdown.
  • Similar to what I found during my secondary research, many people value the privacy and convenience that comes with exercising from home.

Summary of Findings:

  • 103 Respondents
  • Majority ages 25–34 (41%),
  • Majority of women respondents (65%),
  • Most respondents exercise 3–4 times a week (31%),
  • 60% of respondents have experience with fitness applications.

3. Interviews

To learn more about individual experiences, I interviewed 6 people with various exercise experiences via video call:

Summary of Interview Participants

What I wanted to learn:

  • How can I improve the at-home workout experience?
  • How do they select which workouts to complete?
  • What are roadblocks to completing a workout?
  • What information about workouts is important to the participants?

What I learned:

  • 4 of 6 participants — when workouts provide exercise modifications (alternative movements), they find it to be helpful especially on days they might not be in the best physical condition.
  • When following alongside pre-recorded/virtual workout videos, it could be difficult depending on their exercise experience and easier to give up if they’re exercising alone.
  • Workout goals play a huge factor in exercising consistently; without a clear goal, it’s difficult to maintain a routine.
  • Pain points of working out at home: distractions, lack of equipment, lack of space, disturbing neighbors.
  • How to select workouts: The participants most often selected workouts based on the duration and workout type (e.g. cardio, yoga).
  • Why track workouts? 3 out of 6 participants mentioned that they mainly track their workouts to monitor their activity levels rather than changes in calories or weight.

Synthesizing My Research

I learned from my research that I wouldn’t be able to replicate the gym experience at home because equipment and space are things that can’t be controlled. However, I would still be able to improve the experience through features such as exercise modifications or offering trainer assistance from the comfort of the user’s home.

My interviews also confirmed that everyone has different fitness goals and they’re looking for a personalized experience that is suitable for them.

After completing my secondary research, survey, and interviews, I compiled all my information into an affinity map on Miro. Using this affinity map, I created Janice, who acted as my target user.

Persona

Janice encompasses my main demographic, tech-savvy women between ages 18–34 who exercise 3 to 4 times a week.

Problem Statements

After synthesizing my research, I revisited the pain points I found and came up with some How Might We statements that I wanted to tackle.

How might we help users feel comfortable and confident while they exercise on their own and from home?

How might we reduce the number of obstacles between starting to completing a workout at home?

Hypothesis: If I design a fitness app that curates recommended virtual workouts, allows for personalized exercise modifications, and provides the option to connect with professionals for assistance, then users will be able to confidently complete workouts and maintain their activity levels from the comfort of their home.

I felt that these statements encompassed my overarching goals and would help me design something that would solve my problem. With these questions and Janice in mind, I began to design my fitness app!

Design

The Right Fit Brand Guide Summary

View Full Brand Platform & Style Guide Here

Wireflow Sketches & Low Fidelity Wireframes

  1. Onboarding — an introduction to The Right Fit’s features and account creation

For The Right Fit’s onboarding experience, I wanted to provide a few screens that gave first-time users insight into the app’s features. They are able to swipe to learn more or skip the onboarding if unnecessary.

After creating an account, the user will be asked a few questions, which begins the personalization of the experience. The app will begin to choose workouts that are best suited for the user.

2. App Dashboard — customize the dashboard to what you want to focus on

When the user first logs onto the app, their dashboard will show very minimal information. They will be prompted by a coachmark that they’re able to customize their dashboard with widgets of what their main focuses are. This feature adds an additional element of personalization that can align them better with their goals.

3. Browsing & Modify Workouts — easily find workouts you enjoy and modify them to your liking

When the user goes to the workout page, they are able to search, choose by categories, or filter the workouts. The Right Fit will recommend popular workouts, which helps to reduce the number of obstacles between choosing and completing a workout.

When they first click into a workout, they’ll be shown a coachmark that shows the replace, reorder, and remove features. The users can customize the workout down to the individual exercise movement to make the workout most enjoyable for them.

4. Complete Workouts — power through your workouts and let us know if you’ve enjoyed it

Once the user starts a workout, the interface shows the video, a countdown timer, and the upcoming exercise. After the workout, the user will be prompted to rate the workout, which helps The Right Fit recommend similar workouts and avoid ones that are disliked.

5. Schedule a Call & Start a Live Chat — get some additional help from professionals to boost your confidence at home

For extra assistance or advice from professionals, the user will be able to schedule a call or start a live chat. The profile of the trainers shows a few of their credentials and ratings by other users on The Right Fit.

Low Fidelity User Testing

After completing the low-fidelity screens, I wanted to test the usability of the application, especially the exercise modification feature. I recruited 5 participants and used my Figma prototype to conduct moderated user tests both in-person and using video chat.

View the full usability test script

What I wanted to learn:

  • Can users easily complete the app’s red routes (onboarding, browse and complete workouts, schedule a call & start a live chat)?
  • Is there any confusion about the exercise replacement, rearrangement, removal feature? Can participants easily use the function?

What I learned:

  • 3 of 5 participants — were able to complete the “replace, rearrange, remove” exercise task unassisted; the other 2 were able to complete the task after some verbal guidance
  • 1 participant — mentioned that the exercise replacement feature would be very helpful to her due to her preexisting knee injury to replace any exercises that would make her uncomfortable
  • 3 participants — mentioned that the coachmarks are helpful in letting them know what features are available
  • All participants were able to complete the red routes successfully.

This first round of testing was quite successful and showed me that the major red routes could be completed with minimal assistance. It also pointed out any UI misalignments and inconsistencies in the text hierarchy.

High Fidelity User Testing

From my low fidelity to high fidelity screens, the iterations were on the visual designs. After finishing my high fidelity screens, I did a second round of testing that focused on the “replace, rearrange, remove” exercise task and scheduling trainer calls task.

What I learned:

  • (referring to the exercise modification feature) “…different from the apps I used to use since the workouts were prerecorded videos with instructors. This way I’m pretty much able to build my own routine.” — Kathleen
  • “… being able to contact a professional is helpful because with my experience with other apps, although you’re following an instructor you can’t ask them specific questions.” — Jamie
  • “It would help to be able to read comments/reviews on the trainers rather than just see the stars.” — Megan

Final Screens and Prototype

View The Right Fit’s final Figma prototype

Future Considerations

Megan who participated in my second round of user testing wanted a way for The Right Fit to pair her up with a trainer that suits her best based on her activity on the app or her location. I thought that was interesting and could be incorporated for an even more seamless experience.

Gamification was also a feature I wanted to incorporate into The Right Fit to further motivate the users and make their experience more enjoyable.

Final Thoughts

I had a lot of fun working on this project because it taught me that more than anything the app would function as a tool that supplements a person’s habit or routine. In the beginning, I kept trying to think of ways to motivate people to exercise, but throughout my research and design process, I realized that The Right Fit could only try to incorporate features that would reduce the obstacles between starting and completing a workout, but everything depends on the person’s motivations and goals.

Also, this project was the most amount of screens I designed by myself, which was exciting for me! I felt very accomplished after seeing the completed screens and going through the prototype.

--

--

Jennifer Su

www.jensudesign.com A UX Designer based in Vancouver, BC. Passionate about helping people achieve their goals through design.