athos coaching app redesign
Case study
Timeline
Aug 2019 - Oct 2019
What I Did
performed as the sole product designer on the project
user experience research
user journey & empathy mapping
user flows
design sketching & wireframes
persona development
storyboarding
competitive analysis
ideation & rapid prototyping
user testing
UI + visual design
design system creation & implementation
worked w/ iOS engineering to implement design
Who I Worked With
CEO, business development & marketing to understand stakeholder needs.
Customer service & outreach teams to understand our customer pain points.
Applied sport scientists to understand sports science concepts & metrics.
Data scientists to understand the captured data.
Front end/back end/iOS engineering to build & implement designs.
The Background
Athos was already being used by pro & D1 athletes to improve their physical performance & reduce the chances of injury through EMG data & was now expanding into the consumer market.
The Challenge
Athos had an outdated unintuitive app with high user friction that impeded users from completing their workouts & did a poor job of communicating training performance insights to the user.
The app was due for an overhaul because…
Workout completion rate was below ~35% - The user experience was buggy, confusing, and had bottlenecks that impeded users from completing workouts.
High levels of in-app user friction & cognitive load limited Athos’s efficacy in optimizing physical performance & reducing musculoskeletal injury (MSI).
The app lacked necessary core features & neglected to educate the user about Athos’s training framework.
Users didn’t understand the in-app post training insights provided & the app was missing a personalized coaching experience that was desired by users.
The visual design was outdated, uninformative, and UI elements were too small for optimal tactility (Fitts Law).
Athos Goals/KPI’s
Alleviate in app user friction to increase user workout completion rate from ~35% to 80% within 3 months.
Provide training & performance insights that achieve Athos’s goal of reducing musculoskeletal injury (MSI) occurrence for 500 users in six months & 1,500 users in a year.
Create a more effective MVP for a personalized training/coaching in-app experience for consumers to help alleviate the cognitive load involved with achieving their fitness goals.
Create & implement a design system while modernizing the visual design.
EMPATHIZE WITH THE USER
The first step was to empathize with the current user experience via user testing. User testing was the best way to observe the expectations vs the reality of how our users interacted with & navigated through the app to complete a workout.
I selected 10 individuals that were representative of our target customer base & scripted a simple condensed workout program for the test subjects to complete which covered key Jobs To Be Done (JTBD). As the participants went through the user testing they were asked usability questions & instructed to think out loud while executing the JTBD.
KEY JOBS TO BE DONE
Access the assigned workout program & view its sets/exercises.
Complete the assigned sets for the workout.
View & receive the post set + session performance feedback & explain back the insights shown & their perceived value.
our Users Said…
“This UI is complicated, it’s unclear what’s a tappable object and what’s not.”
— user test subject
“For training feedback it’d be more helpful if it showed how my performance relates to my goal; like am I trending upwards, getting worse, or have I surpassed my goal?”
— user test subject
“What I’d expect to see is an example of how to do the exercise but I don’t see that anywhere, so I guess I already have to know how to do the exercise.”
— user test subject
“I see there's effort, balance, and movers & I have no idea what they mean.”
— user test subject
“When it comes to my training I need more insight into what I’m doing, how I'm progressing & what changes to make.”
— user test subject
DEFINE THE PROBLEM & PAIN POINTS
User testing enabled me to flush out the most common pain points our users faced which were categorized into 3 key insights…
Key Insights
The app experience of executing a workout has too much friction & cognitive load for the user to extract value.
The app experience doesn’t account for real world limitations and bottlenecks during training.
The reward step of Athos’s habit forming loop is broken and doesn't keep users engaged.
Who are our users
In addition to using the Jobs To Be Done framework to help identify user needs, user personas were created to highlight the pain points, goals, and foster empathy for Athos’s two major target user groups, which was the strength training archetype and the cardio/circuit trainer.
Personas helped to highlight that strength trainers & circuit trainers had different user needs & constraints.
Strength Trainer
Require time in between exercises to move to different machines (e.g. leg press to quad extension)
Require time in between exercises to set up equipment (e.g. hip thrusts)
Require time in between sets to add or remove weight plates.
Require time in between sets to rest for the next set.
Equipment/weights/dumbbells might be in use (e.g. public gym)
Need time to before set begins to establish a mind muscle connection
Exercises may not be done in a linear order
Circuit Trainer
Exercises are done in rapid succession & in a linear path.
Circuit stations are already set up before beginning the workout.
Rest sessions happen after circuits vs after each set.
Users are busy going through the circuit segments & don’t want to stop to interact with the app for each set.
After defining the problems & understanding who our users are, ideation begAn.
mapping out the full product customer journey…
Mapping out the customer journey highlights the core stages of the user experience: Discovery, Onboarding, Planning, Execution, Retention, and exposes the user touchpoints in those stages along with any emotions & constraints.
Touchpoints with the user can be leveraged as both learning & teaching opportunities…
A touchpoint can be used to learn more about the user’s needs, pain points, mental and emotional states across the user experience.
A touchpoint can also be used to educate & inform the user; and facilitate, guide, condition, and reinforce user behavior.
The customer journey exposed that Athos missed a key touchpoint to alleviate user friction & cognitive load early in the product journey…
PAIN POINT 1
Educating users through onboarding.
Athos doesn’t hold the user’s hand the first time.
A major pain point causing high cognitive load was that the current app provided no onboarding experience to educate users about its interface or any of the Athos training framework & metrics.
Reframing the problem into an opportunity
How Might We better educate new users about Athos training framework & the app interface to alleviate cognitive load + user friction while highlighting Athos’s value.
Pain points alleviated through onboarding the user
No user education of Athos training framework/concepts.
No user education about app functionality/screens/interface/gestures.
No user education about Athos metrics or performance evaluation framework.
Value of Athos insights & product differentiation are masked by the high in-app friction.
The assessment workout is the user's first touchpoint with the app making it the perfect opportunity to educate users in the moment about the app's interface & Athos training framework.
In the planning phase a new user is required to complete an initial assessment workout with the app that’s used as a benchmark by an Athos coach to create a personalized workout program for the user to follow. This was an unutilized opportunity to onboard the user through ‘Learning by Doing’ (aka Active Learning).
Mapping Out The Assessment Process
Active learning is more effective than passive learning.
Active Learning (learning by doing) is an education theory that we learn better & more when learning is done through actually “doing” the activity, as opposed to passive learning where you absorb material (e.g. reading, lectures, etc.)
Video game onboarding is a great example of Learning by Doing.
- Video games use in-game onboarding to quickly educate users about the game’s framework, its interface, and the controls.
- Players learn by doing in the moment (e.g. learning new combos via an in-game tutorial as they fight an enemy) which is more engaging & effective for info retention than watching a tutorial or reading/memorizing a guide book.
Benefits of an active learning based onboarding experience…
Integrates & retains knowledge better because the user learns through being immersed in the actual product experience (performing a workout).
Is more engaging than a passive tutorial because it includes the user’s participation.
Is more personal because it’s holding the user’s hand during the first product interaction & highlights Athos’s value.
Kills two birds with one stone by making the most out of a single interaction touchpoint (onboarding the user while assessing their baseline performance).
Where would onboarding be useful?
The key jobs to be done when performing a workout session were used to storyboard the onboarding process. Onboarding by key jobs to be done ensures users are being educated in the moment on the actions they'll most frequently encounter & perform.
Competitive Analysis
I did a competitive analysis of several apps in the fitness + wellness space to examine how they onboarded & educated their users about their functionality, interface, and metrics.
Insights:
Athos doesn’t highlight the structure or framework of its training programs.
Volt & Fitbod educate users about their programing structure so users understand why they're doing what they're doing which builds trust & highlights the product's value.
Athos doesn’t educate users about how it evaluates training performance.
Apple fitness educates the user about their fitness metrics & the desired goal while providing visuals that intuitively cue users into how those metrics work (e.g. closing rings).
Turning the user's first experience with the app into a learning by doing moment
Since the assessment workout is the user's first touchpoint with the app, it was the perfect opportunity to educate and walk the user through the app's functionality while explaining Athos concepts & metrics reducing user friction & cognitive load.
As the user completes their first assessment workout an app tutorial walks the user through each screen they’ll see along the way & what the respective training content means; like how to understand the post session feedback metrics used to rate the users performance.
Tooltips and call outs are used to highlight & explain the apps gestures, interface elements, and training concepts which primes the user for their next use.
The Solution
PAIN POINT 2
Users don’t know how to perform unfamiliar exercises.
users need guidance on how to perform an exercise.
Athos training programs consist of many different exercises but the app provided no instruction or education on how to perform the exercises forcing users to leave the app & Google how to perform an exercise which interrupts the user’s workout flow & takes them out of the Athos experience.
User Need Statement
As a consumer or athlete working towards a fitness goal, I would like to be educated on how to perform an exercise properly so that I can achieve optimal performance & ensure that I don’t get injured or waste my effort.
Where in the flow do users need to access how to perform an exercise?
Competitive Analysis
Other fitness apps all have examples on how to do exercises in their workouts. They all seemed to have either video, animated gifs, narration, or some combination of those elements.
Assumptions
Users need visual examples (video vs pics).
Videos are better than pics for conveying how to do an exercise.
Users don’t know what muscles every exercise should target.
Text description is needed for detail & to clarify visual examples.
Constraints/Edge Cases
Athos would need to create an exercise library on the backend.
Athos doesn't have videos or pics for every exercise.
Athos doesn’t have target muscles linked to every exercise.
Custom user exercises won’t have target muscles.
Network reception can adversely affect video loading time.
Athos doesn’t have a fancy gym set location, or actors, or a photocrew to shoot highend demo videos or create animated gifs.
The Solution
The major pain point of users not knowing how to perform an exercise was solved by the ‘Exercise Detail’ modal.
I broke down the core user needs for understanding how to perform an exercise properly resulting in the Exercise Detail modal.
User is provided videos demonstrating how to perform the movement from different angles.
User can also choose to view step by step pics instead of the videos should their network be to slow to load the video.
User is provided detailed text instructions for clarification reducing the chances for misinterpretation.
The user can conveniently start the set right from the Exercise Detail modal eliminating the need to back out & reducing unnecessary taps.
Target muscles & needed equipment for the exercise are made clear to the user, facilitating optimal set performance & relieving cognitive load.
PAIN POINT 3
In-app post training insights were unclear & hard to understand.
Low user comprehension of in-app training insights masked Athos’s value & reduced user retention.
Users had difficulty understanding the in-app post set & post session training insights which reduced Athos’s efficacy in preventing injury & optimizing physical performance. This was a complex multi-faceted problem & warranted its own case study.
Addressing the remaining user friction
Optimizing the onboarding process to educate & walk the user through the apps functionality and Athos training concepts would alleviate the majority of cognitive load. The remaining user friction came from ambiguous CTA’s & an unintuitive interface. These low hanging fruits could be solved while redesigning the outdated interface & by simplifying the app navigation.
Old App Flow
I mapped out the existing app flow to examine how it could be improved & where would be the best place to add needed features like an exercise description.
In doing so I was able to observe bottlenecks that resulted from things like suboptimal navigation, a confusing & inconsistent interface, unintuitive gestures & uninformative screens, lack of input feedback, missed error states, and inability for the reversal of actions.
Revised App Flow
ADDITIONAL IMPROVEMENTS
Further reducing user friction.
A more effective homepage that helps users find Athos offerings & their value faster.
The original landing page was suboptimal & led users to a home page with no content organization structure masking Athos’s offerings & causing users extra clicks & friction.
The suboptimal landing page was removed for a more useful & functional home page.
Content is now organized into categories which guides users to what they’re looking for more effectively & better highlights Athos offerings while allowing for future content expansion.
Users can see their current program, their average movement score for the program, and their current top problem.
The coming workouts for the week are shown first because they have highest priority in the users achieving their fitness goal & JTB.
Assigned supplemental plans are shown next because they are a secondary priority for JTB & the user achieving their fitness goal.
Users can view their assessment performance & progress.
The main features are given organizational structure, workouts have their own section, performance progress has its own section, and the hardware & app settings have their own sections.
New Homepage Content Categories
Your Programs: Assigned Athos coach programs, supplemental plans, and assessment workouts for the users fitness goal.
Browse: Users can browse training programs by muscle groups, workout focus, Athos coaches, supplements workouts, and equipment.
Athos 101: A section dedicated to educating users about Athos framework, metrics, and training concepts.
Athos Coaches: Bio’s & info on Athos coaches & the training programs they create.
The preset touchpoint was a missed opportunity to prime the user
Once a workout was started the old app abruptly threw the user into starting a set w/o giving the user a chance to mentally prepare for the new set or get into position for the movement; resulting in suboptimal set performance & non exercise related EMG data being captured reducing data accuracy.
The Countdown Screen gives the user a segway to mentally ease into their set & get in position ensuring that only movement related EMG data is captured increasing data accuracy.
This touchpoint was also leveraged as a teachable moment to prime the user reducing cognitive load & user friction by:
The interface allows the user to back out of or skip the countdown screen.
Informing the user what muscle to target to achieve optimal set performance.
Tapping the exercise cell allows the user to see how to perform the exercise & pauses the countdown.
Providing the user w/ a concise personalized mental cue helping to improve their movement pattern further ensuring optimal set performance.
The user can see their workout & program block completion.
In the moment facilitation was improved to encourage optimal set performance
The intended purpose of the ‘Live View’ screen was to show the user the EMG activity & the intensity level of the muscles being used during a set. The old Live View’s visual design was cluttered w/ no hierarchy & it did nothing to facilitate the user in achieving optimal set performance.
When the user is performing a set they’re already experiencing a physical load from performing the exercise which limits their cognitive ability in the moment. Therefore it’s important at this touchpoint to facilitate the user cognitively to achieve optimal set performance.
The user is informed what effect leaving Live View has on the set.
Highlights the movements primary target muscle, thereby carrying over & reinforcing the priming from the preceding Countdown screen.
The visual elements are less cluttered & have a hierarchy that draws attention to the side of the body with the target muscle & CTA’s are have been sized for tactility.
The user can see how to perform an exercise by tapping the exercise cell which brings up the Exercise Detail modal.
The user can see what the next set will be.
final design screens
how did we MEASURE success
Workout completion rate increased to 92%
The old app had so much user friction that it impeded users from being able to fully complete their workouts. This meant that users couldn’t get to the point where they could extract value from Athos’s training insights which also reduced user retention.
Improvements like the Exercise Detail modal, Countdown Screen, Live View, and new post training insights boosted workout completion rate to 92% in less than 6 months while also increasing user retention by 35%.
Users validated that the new design improvements were game changers in reducing cognitive load & were actually key in improving their performance.
~60% of users improved their avg set & session scores within the first month of release.
Injury rate declined by 37% within the 3 months of the new post training insight framework being implemented.
