Gif animation Going Through a user Flow For tracking A Run
Introduction
FitHQ is a mobile app designed for gym goers and fitness enthusiasts to learn more about different exercises and expand their knowledge about how to perform these exercises safely.
Role
Researcher
UI/UX Designer
Tools
Figma
Photoshop
Illustrator
After Effects
Microsoft Teams
Google Meet
Zoom
Miro
Problem Statement:
People who workout need a way to access fitness information
and record their progress so that they can reach their fitness goals.
Design Process
In this project, I followed the double diamond flow of development. Each phase of the diamond helps refine the project and allows opportunities to revisit steps and improve on aspects in a cycle.
Discover
During this phase, I researched the problem and gathered as much feedback from users.
Define
From that research, I then define a problem that’s a common thread amongst most users and refine it down to a single problem statement.
Design
After defining the problem, I come up with multiple solutions. Many ideas won’t make it to the final product.
Deliver
During this phase, a prototype is developed and tested. Many rounds of development and testing can occur with feedback provided by users.
User Research
I interviewed around 5-6 individuals with varying levels of interest in fitness. Some were moderate gym goers, others were runners and walkers, and some were fitness trainers.
Affinity Mapping
After the interviews were completed, I started aggregating all the notable points from each interview into overarching themes. Most people were afraid of injuring themselves from performing an exercise incorrectly.
Major Themes:
I want access to credible information so I can perform these workouts correctly
My lack of knowledge hinders me from growing
I like quick access to pre-planned workouts to fit in my busy schedule
I like to track my growth and progress so I can see my journey
Persona
I want to safely maintain a healthy lifestyle
-Brendan
Meet Brendan
Age: 25
Occupation: Software Developer
Fitness Level: Average
Brendan is a young adult with a 9 to 5 job. He has a gym membership and goes at least 3 times a week. He likes to research different exercises to keep his workouts more interesting. He likes to track his progress.
Motivations:
Finding new exercises to keep workouts fresh
Reaching short term fitness goals while keeping progress in mind for long term goals
Shirtless progress photos
Frustrations:
Getting injured from a workout
Progress being hindered from injuries
Being bored because of doing the same routine repetitively
Task Analysis
Before building out the prototype, I performed a task analysis to see how competitors accomplish the normal task of finding an exercise and learning about it. For this task analysis, I used the Nike Training App as a basis for my research.
Finding: Overall, I felt the task of finding an exercise flows really smoothly. I think the focus here is more towards home workouts, which is why the Chromecast notification is there. For a gym goer, this would be a step that should be omitted.
Feature Prioritization
When trying to figure out what should go into the MVP, I used the 2x2 matrix to plot out which features would be most desired and which would be added down the line.
User Flow
Low Fidelity Wireframes
Usability Tests
After building out a lo-fi prototype, I set up a moderated usability test with a few individuals. Some were from the previous interview while a few were new to the project.
The tasks assigned to testers were:
Find a video on an exercise, watch it, and read the help tips for performing the exercises
Search for an exercise, add it to your workout for the day, add some reps, and save your workout
Pain Points
Observed users having difficulty clicking buttons
Finding: Buttons might be too small
Testers found calendar flow confusing and expected it to take them to that specific day’s work out rather than directly to copying it
Finding: Need to reorganize flow of calendar interaction to better fit user expectation
Testers seemed to instinctually click buttons without reading, which would take them to somewhere they didn’t expect
Finding: Position buttons in a way that takes into account a user’s mental model
Positive Feedback
Testers were overall happy with the navigation of the app and how the experience flowed
Testers remarked on how neat and uncluttered the app felt
Testers appreciated seeing the variety in terms of exercises as well as the option for pre-planned workouts
High Fidelity Prototype
Please click Through this Prototype to Get the FITHQ Experience.
Unmoderated Usability Tests
Once the high fidelity prototype was built, I ran an unmoderated usability test using Maze.co. This method allowed me to send out the test to multiple individuals without having to be there in person or set up interview sessions.
This method also is a great way to simulate how the app would function in the real world without me there observing outcomes. For this test, users were asked to perform the same tasks from the Lo-Fi usability test.
14 Testers
0% Direct Success
85.7% Indirect Success
14.3% Give-up/Bounce
Insights
Most users completed the task in a way that I did not mark as the direct path in Maze.co. This was because I created multiple paths for users to reach the same end goal, so the design worked as intended.
The bounce rate was actually alarming at first. When I spoke to users after the fact, it seemed the Maze.co platform was confusing so they closed the page causing a bounce. The tasks themselves also could have been written more clearly so users can understand what they were being asked to do.
Next Steps
As for my next steps, I’ll go through and further refine the design and retry the Maze.co usability testing. If I better frame the users on what to expect during the tests, then my data might be cleaner.
Once the usability scores improves, I’ll feel more confident in pushing this project into development.
