Project Overview
Role: UX Designer & Researcher
Duration: July 2022 – September 2022
The Product: Mobile fitness app & responsive website
Goal: Design an app that focuses on helping people stay consistent and motivated to accomplish their fitness goals.
Responsibilities: Competitive audit, user research, personas, user journey maps, information architecture, wireframing, prototyping, usability studies, design iteration.
A lot of people struggle with staying consistent with their fitness.
I’ve always had a positive relationship with fitness and wanted others to enjoy it the way I do. This led me to become a personal trainer, where I realized that not everyone has the tools needed to be fit and healthy.
The solution is a fitness app that can serve as a trainer and provides the knowledge people need to be successful in accomplishing their fitness goals.
The main challenges that came up with this project was determining how to keep users motivated and engaged.
THE DESIGN PROCESS
DISCOVERY
I began my research for this project by conducting a competitive audit. I identified the following market gaps: not all of the apps were geared towards achieving their users’ specific training goals and most seemed to only target individuals who worked out at home.
To make sure I came up with a solution that people would actually use, I decided to do user interviews. For the interviews, my target audience were:
Participants who had experience using mobile fitness apps.
Participants who had used a fitness app within the last 6 months.
I interviewed 7 participants through Zoom and asked the following questions:
1) How did you go about finding a workout app to use?
2) What were some of your fitness goals? Did using an app help?
3) Did you find using a fitness app successful? Why or why not?
4) What were some challenges you faced?
5) Do you still currently use the app?
60% of participants interviewed expressed that the fitness apps they used in the past weren’t helpful or were only successful for a small period. Users said that they “got busy with work” or “struggled to find the time or energy to deal with their health.” If they had the motivation, participants struggled with long-term consistency and accountability.
As a result, 50% of participants no longer currently their fitness apps. These insights made me aware of the user need to have a fitness app that makes it easy to stay motivated and consistent.
UNDERSTANDING THE USER
To gain a better sense of my users’ behaviors and emotions, I created two user personas based on the responses from my initial interviews. I grouped them by their characteristics and behaviors – gym experience, workout preferences, and lifestyle.
Next, I created user journey maps for each person to identify frustration points and come up with possible design solutions. I realized that having the option to do single workouts or follow a workout program was important to make sure both users could feel satisfied with their user journey.
With this in mind, I started to map out what a complete user flow of the app would look like. There needed to be two log-in screens for new and returning users. I also needed to create screens for users to find workouts to do and find healthy recipes.
INITIAL IDEA
During the first round of brainstorming, the ideas was to have a content feed that would function as a way for users to share workouts and give status updates on their workout journey. I also had the idea to do a survey at the beginning to function as a “fitness consultation,” like the ones I would give as a personal trainer. Information gathered here would help recommend workouts based on their goals and needs.
I drew my paper wireframes based on this idea and transferred them to Figma, where I created a low-fidelity prototype to use to get feedback from users.
To get feedback and critique on the early stages of my design, I conducted a usability study using Google Forms. I asked participants to complete four tasks:
log into the app and complete the onboarding survey
navigate to workouts and schedule a future workout
navigate to a friend's profile
create and post a status update in the community feed
75% of participants rated navigation ease 3 out 10 (with 1 being easy and 10 being difficult). This told me that the navigation could be made clearer, which meant I needed to rethink the purpose of the app and how it could be made more intuitive.
50% of participants said that they felt neutral about actually using the app. This meant I needed to determine what in the design was causing friction for the user. I had to be honest in thinking — “what feature would provide a well-rounded experience for my users?”
REDIRECTION / FINAL DESIGNS
Looking back at the interview transcripts and drawing on my experience as a trainer, I decided to replace the community feature with a nutrition feature. I remembered the interview participants mentioning that they didn’t use their meal plans because the meals provided were Westernized or lacked flavor.
Since I already had a good idea for the visual design of the app from the previous prototype, I skipped to making digital wireframes for the app. In this version, I also changed the navigation to just a single bar at the bottom of the app since users had trouble with navigation previously.
MEASURING IMPACT
I conducted another usability test to measure the effectiveness of the new design. I recruited 5 participants in-person on a college campus and asked them to complete the following tasks:
Create an account and complete onboarding survey
Schedule a future workout
Navigate to a recipe
All of the participants were able to complete the tasks without frustration. Furthermore, the following insights were identified:
100% participants found the app easy to navigate.
“It reminds me of other apps, so it was easy to use. Finding a recipe was the easiest part.”
91% said that they would download & use the app.
Conversion increased 41% from last round of testing when only half said they would use the app.
100% of participants found the app useful.
“This app can help a lot of people with their fitness journey. If this was free, I’d download it right now.”
WEB DESIGN
I also designed desktop and mobile screens in Figma for the website. My aim was simple visual design with an emphasis on the download button to convert users - hence the bright yellow buttons. Here’s what the Landing Page and About Us looked like:
TAKEAWAYS
This project emphasized the importance of talking to the people you’re designing for. It’s never too early or too late to test the designs with real people! If I hadn’t tested the designs with users, I could’ve kept iterating on a design that people would never use.
I learned how to know when to let go and change courses. It can be hard to admit that a design you’ve spent so much time on isn’t the right solution. What helped me for this project was talking with other designers and putting the users first instead of my ego. I think that learning this now has shaped me into a better designer.