Audio-enabled cardiac fitness training
Corrects exercise form in real time
A collaborative venture of UCLA Health and ACSM
End to End Application
Overview
Studies have indicated that users of wearable devices make positive health changes in the short term, but motivation can quickly wane. Yet technology used for personal health management in preventive care continues to be assessed in terms of its rate of adoption, and does not examine sustained use. UCLA Health believes sustained behavioral change is a major challenge and staying engaged with fitness goals and building lifelong habits requires exercise to be mindful and personally fulfilling. They have reached out to me for a digital solution that keeps users engaged with heart healthy exercise.
Why is this important for design?
Health wearables fuel a $40 Billion industry. People massively adopt and use wearables but abandon them soon.
Reminders and alerts or even the anticipation of them, forces the brain to send emergency signals to the body and with every notification, your body gets a rush, but not necessarily a good one. Yet designers continue to roll out more of the same ”new” features - a shift to technical abundance and gimmickry.
Design Challenge
The primary focus here is to study a user's journey with health wearables, identify functionality, or the lack of which results in disengagement, and reframe the design narrative with value features. Whether it’s altering workouts or just personalizing goals, the solution area is ripe for disruption.
Obi fit is designed for voice feedback informed by iPhone motion sensors. The voice and motion interaction is involved and complex, and beyond the scope of user interface design on the Sketch platform. Therefore the design presentation will be mainly conceptual. User testing will however include audios that are illustrative of the solution.
High level design goals
Personalized exercise goals relevant to fitness level
Easy to use features attributes identified in research
Monitor and report data on metrics that can be leveraged for cardio fitness
Provide actionable feedback
Says the right things, in the right times, in the right way
Design process
-
Online research
Competitive analysis
User interviews
SME interviews
Pen persona
Online research revealed a feature rich domain from which I collected and grouped product solutions by similarity. I followed this up with a detailed competitor analysis. User interviews identified attributes relevant towards closing the gap that countered intrinsic motivation to exercise. The learnings synthesized from this exercise generated a pen persona; a broad brush that painted my user demographics. SME interviews were helpful in isolating requirements and debunking research bias.
-
User stories
Solution & monetization
Feature roadmap
Sitemap
USER FLOW
Here I built problem centric user stories which illustrated my users pain points with the current workflow, their needs and the corresponding attributes of a meaningful solution. I next identified a viable integration of available technology which defined and monetized the solution. A feature roadmap prioritized the buildout, the sitemap gave it structure, and the user flow unfolded functionality into an ecosystem of interactive modules.
-
Branding
Solution visuals
Medium fidelity wireframes
High fidelity wireframes
The medium fidelity screens called attention to attributes that mapped pathways through design at a high level. The functionality was supported with images consistent with fitness, and the iterations of visual design triggered the branding. This was followed by high fidelity prototypes.
-
High fidelity prototypes
Audio
The prototypes were tested as modules; all of which were material to the solution process. Due to the limitation of the Sketch application the interactive elements were not built into design, and instead presented as audios illustrating a mock interaction with sensors.
-
Findings & recommendations
Priority updates
Circling back
Learnings
The findings informed priority revisions with recommendations on what worked and what did not. The project learnings identified blind spots in the design environment. My growth as a designer while engaging with this domain, the project’s journey and its future direction was captured in the learnings.
Timeline
June 2022
My Role
UX/UI Design
Team
Solo Project
Tools
Sketch, Google Suite, YouTube
Empathize
Competitive analysis
Here I evaluated the features, claims, and reviews of a cross-section of relevant health and sports technologies. This helped establish beyond any doubt the colors typical to fitness in the digital world; a range of blues. Feature attributes that emerged as most relevant were:
Recommendations relevant to fitness level
Form correction to prevent injuries
Health and exercise data with actionable insights
Auto switching of exercise recommendations to avoid plateaus
Pairing exercise with favorite music
Capturing behavioral disengagement promptly and accurately
Identifying reasons people resist change, designing to speak to their ambivalence
Reducing scheduling effort, increasing automation
Guidance and recommendations that emulate a personal trainer
Competitor research synthesis
Pen persona
“My work requires a lot of arm movement and the tracker picks it all up as steps.” (Diana)
My user turned 30 a few months ago and gifted herself a health wearable. However, she soon turned off reminders as no matter how hard she tried she could never close all rings.
She does not want to have to surf through hundreds of exercise videos to select one; her “favorites” stop being motivating and recommendations are not relevant. She feels her wearable is a lot of work, and also inaccurate.
She worries if her heart is getting the necessary workout with walking up a sweat. She wants a digital solution that is more intuitive and accurate, and is not tied to a paid subscription.
NAME
AGE
ARCHETYPE
RELATIONSHIP
OCCUPATION
LOCATION
WEARABLES
APPS USED
HEALTH GOAL
EXERCISE
Ayana
32
The Sprinter
Single mom to a toddler
Psychotherapist
New York
Fitbit, Whoop
Fitbit Premium, Whoop & training apps
Preventive & weight loss
Not consistent
NAME
AGE
ARCHETYPE
RELATIONSHIP
OCCUPATION
LOCATION
WEARABLES
APPS USED
HEALTH GOAL
EXERCISE
Karina
30
The Guide
Single mom
Data Scientist
New York
Fitbit, Apple Watch, Whoop
Fitbit Premium, Whoop, Apple Health
Staying fit & building muscle
Not consistent
User 1
User demographics
User 2
Here I evaluated the features, claims, and reviews of a cross-section of relevant health and sports technologies. This helped establish beyond any doubt the colors typical to fitness in the digital world; a range of blues. Feature attributes that emerged as most relevant were:
Recommendations relevant to fitness level
Form correction to prevent injuries
Health and exercise data with actionable insights
Auto switching of exercise recommendations to avoid plateaus
Pairing exercise with favorite music
Capturing behavioral disengagement promptly and accurately
Identifying reasons people resist change, designing to speak to their ambivalence
Reducing scheduling effort, increasing automation
Guidance and recommendations that emulate a personal trainer
User interview synthesis
SME research learnings
I next interviewed a cardiologist, a physical therapist and a psychotherapist. I briefly apprised them of my project goals and research learnings. The feedback confirmed that exercise can reduce cardiac events by 80%, however fitness solutions for preventive care are designed to keep users engaged with a digital “habit.”
Chronic stress has been associated with increased cardiovascular events, and exercise can be particularly helpful for people who deal with anxiety and panic attacks, as it programs the brain on how to manage stressful situations.
Though there is a continuous influx of data and wellness scores from wearables and apps the features have not identified the active ingredients which effectively change behavior. We also discussed the necessary skills, tools and techniques that enable the self-regulation of healthy exercise behavior.
-
The continuous influx of data from wearable electronics does not direct clear, actionable intelligence, and yet numbers become the metric for mental and physical well-being, often above bodily cues. When we take into account the potential inaccuracy of the data and the flexibility to interpret it, it is apparent that it fails to guide users in a targeted manner.
-
Economic inequality accounts in a large part for health disparities. In instances where disposable income is limited, wearables, gym memberships and subscriptions are less accessible. However, in consumer perspective these instruments are the only means to regulate health and activity.
-
Building better habits - 150-300 minutes of moderate intensity or 75-150 minutes of vigorous intensity physical activity per week reduces chances of cardiac events by 80%. Over time exercise the body and mind identify with exercise as “feel good” behavior.
Behavioral change is more successful and long-lasting when it focuses on the benefits of exercise rather than the risks associated with sedentary behavior. Progress is an incentive for sustained activity, and goals must be realistic and sustainable.
-
The maximum heart rate helps determine an exercise intensity relevant to maintaining cardiac health. It is calculated very easily. MHR = 211 - (0.64 x age)
Low intensity activities 0-60% of user MHR
Moderate intensity activities 60-80% of user MHR
High intensity activities 80-100% of user MHR
-
Here we discussed imposing digital technology:
NadiX yoga pants. Enable posture analysis through haptic feedback
Post-activity data. Its’ lack of potential to correlate with retrospective recall and mitigate the risk of sports injuries.
Lief emotion tracking. Places technology in a position of power in relation to the user. Though controlling stress and anger cannot be undermined for a heart healthy lifestyle; the gradual surrender of self-awareness to modulation by devices is addictive and damaging.
User Persona
Define
User stories
-
![]()
Disturbed sleep
As a busy health care worker restful sleep helps me meet the demands at work, and I need to implement changes to ensure regular undisturbed sleep
Solution
FORM CORRECTION - Data from iPhone motion sensors is visualized by applying the same body movement to virtual characters; the pose estimation and motion retargeting informs my fitness app on errors in form. The app works with accompanying cardiac earbuds, converts the digital output to sound and communicates corrections to users in real time. Cadence, steps per minute, foot strike, stride length, push ups, and lifts are studied in real time and corrected. Real time feedback reduces the risk of injury, and corrects form with greater success than retroactive recall studying post activity data
INCREASE ENGAGEMENT - To keep users motivated recommendations will start out with mini workouts relevant to fitness level stated in profile, and set goals that are specific, measurable, attainable, time bound and increase endurance incrementally. If needed exercise endurance will be reevaluated. Out of sight is out of mind; therefore we keep exercise in sight. We capture disengagement, request feedback to improve recommendations, and accompanying this short survey are personalized and motivating messages.
CARDIAC EARBUDS - MHR measurements taken from the ear have proved to be the most accurate. Cardiac enabled sports earbuds measure and monitor the MHR during training, and communicate this data to the app, which paces the intensity of interval training with relevant music beats, and also provides voice guidance in real time. We collect data on a single metric that has been called out as being an identifier of heart health, and leverage this data for making relevant recommendations. To reduce the disengagement associated with distraction the smart features of earbuds will be descoped to be relevant to fitness and exercise. Ambient sound technology will ensure the user stays aware of surroundings. Touch features to play, pause, stop and shuffle music will ensure users do not need to access their cellphones.
SLEEP STUDY - iPhone sensors are employed to study movement and sounds while sleeping, and relay this data to my app. Users are informed with a sleep study module which reports disturbances, time of occurrence, duration, and its influence on the sleep cycle.
The solution uses data from iPhone motion sensors to correct form and communicate the same in real time via cardiac sports earbuds, which also measure heart rate while exercising, and modify intensity and music BPM to enable personalized interval training.
Feature prioritization
Profile questionnaire gathers data to enable accurate recommendations & set goals which align with users' fitness level, personality type.
Music tempo synchronizes to routine intensity and fitness level, and changes in real tine to accommodate a varied exercise endurance. Beats work towards matching SPM with BPM and incrementally increase endurance. Uses playlists enhanced with rhythmic auditory stimulation.
Limits the breach of health data; collects data on one cardiac metric the MHR and uses this to inform interval training in real time.
Offers a choice of manual or automated routine selections. Reduces stress and disengagement, saves time, frees up screen time to workout time.
Form analysis with real time voice guidance promote better habits, enable self-growth, prevent injuries, train relevant muscle groups, and optimize workout.
Identify reasons for sleep disturbances, offer actionable feedback and analysis of sleep quality with guidelines for rested sleep.
Ease of scheduling workouts and editing schedule. Personalized and friendly reminders that speak to ambivalence.
Two in five executives surveyed, 40%, report that their customer personalization efforts have had a direct impact on maximizing sales.
Music intervention can increase the length of workouts by up to 70 per cent – especially when the tempo is synchronized to the pace of the stride. Music distracts people from pain and fatigue, increases endurance, beats the blues, and the increased energy lasts all day long.
An unsecured database containing over 61 million records related to fitness trackers and wearables exposed Apple and Fitbit users' data online.
Automation helps to vary routines and avoid plateaus in exercise, it works off predictable patterns analyzed in manual selections.
According to Fitness Expert and Professional Trainer Ambyr Chatzopoulos, correct form can make or break your training goals. Not practicing accurate postures increases your risk of injury.
57% of direct-care workers reported experiencing insomnia, difficulty falling asleep and frequent nighttime awakenings.
iPhone reminder apps are well rated, personalizing the feature design with UI relevant to exercise, helps motivate and keep long term goals in sight.
Feature Attributes
Success Factors
I am focusing on a specific market, a “different” market. For design to feature user value it has to cater to the needs of the one-third of users who abandon wearables. Though the consumer market disproportionately rewards companies that truly stand out from the crowd, “standing out from the crowd” is essential to adoption as the fitness market is saturated with products and services that are designed to acquire customers with a new UI of old features.
Sitemap
To explain the usability of the app I have designed an HTML sitemap. Features are filed under page labels, prioritized, and linked. Having laid out this bird’s eye view of the hierarchy it is easier to visualize the interconnections of different pages.
The user flow that emerged is a micro community of integrated mini flows. Building this helped defined the path users would take as they went the app from the start point to the final interaction , and the screens that would be built out for.
Obi fit website
Product and app detail
Shop
Create account and download app
Obi fit application
Pair earbuds with app
Complete profile
Select or schedule activities
Sleep study module
Activity statistics
Disengagement check
User flow
Ideate
Medium fidelity wireframes
The medium fidelity screens I have included call attention to features and attributes that map pathways through design at a high level. They are a fair representation of the different features.
Homepage describing the solution process and its value
Product module which includes the payment process
App download and profile personalization
Scheduling a running routine
Engaging in a running routine
Activity metrics
Actionable feedback
Branding
Visual design
Motion & progress
I created collages using form in motion. Facial expression took center stage. Be it a poker face or an exuberant smile, it was random in its presentation, and did not ensure any relevance in meeting the user where they are at in the emotional journey of their day. I painted emotions with colors that had worked for NIKE.
YELLOW - Optimism and positivity; a belief that failure doesn’t determine who you are.
GRAY - Calmness and neutrality, focus, and precision
PURPLE - Overcoming physical challenges and limitations and setting more difficult goals.
Experimenting with flat illustrations
I next experimented with the Alegria illustration system.
It conveyed inclusivity with relatable everyday stories. The flat illustrations were fun elements, but did not communicate a powerful dialogue that had the potential to engage users; they did not convey fitness or create a motivation for the same. It was also difficult to relate to expressionless faces with a mission of personalization.
UI kit
The dominant expression here is one of determination, form striving to stay fit in a fluid yet effortless and resilient journey. The relevant stance and muscle tone does not allow a distraction to allow relevance to facial expression.
As the photography has a high contrast I used a gradient to ensure readability of text.
Prototype
Test and validate
Usability Test
-
My target audience is in the 30-35 age range.
The solution is built for women and will be tested by the relevant gender.
Testers are familiar with fitness apps and have given up on 24/7 wearables within a few months of use, or retained them for their smartwatch functionality.
-
About twenty percent of the product will be covered in the usability interview.
As the voice functionality (the value feature) is not built out users will be employing sound visualization (UX theater) during testing.
-
Users will be recruited through my personal network, and interviewed either in person or remotely.
I will moderate testing, observe reactions and take notes.
-
We are testing the design for a fitness app that partners with cardiac enabled sports earbuds, and iPhone motion sensors to:
Read exercise form data from iPhone sensor, write form correction and communicate as audio in real time.
Earbuds monitor the MHR and communicate the data to the app which guides interval training in real time.
Music tempo is edited to help correct pace. You will be engaging in UX theater and imagine the voice features, as prototypes do not accommodate audio.
I will be asking you to click through select screens to proceed through the flow - please do not record this as an error in build-out as it is a limitation of prototyping.
-
Obtain feedback to improve navigation and features.
Analyze user reception of concept.
-
I expect a 75% completion rate as users are unfamiliar with product, features, and design patterns.
-
I expect an 60% error-free rate as participants are unfamiliar with the product experience.
-
Task completion rate and level of ease or difficulty
Does the personalization come through to users?
The touch points at which users experienced a limitation in choice
Does the app motivate the user to make exercise a part of their lives?
Is the hierarchy intuitive and learnable?
Identify areas of improvement
Did the layout make sense?
-
Explore the obi fit landing page, and learn about the product.
Purchase the obi fit earbuds, cell phone holder and journal.
-
We will employ some UX theater here and pretend we are hearing music and running to its beat.
Create account
Pair devices
Complete the profile as a 33 year old independent and goal oriented female who loves dance hits and hip-hop, does not exercise much and wants to maintain her cardiac health, get stronger and toned. She weighs 52.5 kg, is 168 cm. tall, is unsure of how often she can fit exercise into her schedule and has opted to skip the option of selecting a homepage.
I would like you to to pause your run and tell me what you see
What is the music genre that will play through the routine?
Check out your exercise statistics.
-
I will be asking you to click through screens, that won’t be case after build out.
Check out your exercise statistics.
Do you find the data on cadence and form correction helpful?
Can you pull up the map?
Why don’t I see the heart rate on this screen?
You see screen commands when you are paused - these will be accompanied with audio.
-
Was it easy to set up?
Describe the quality of your sleep on June 30th, 2022 - you will need to access “Activities”
Can you detail the quality of your sleep?
-
How many times did you set off on a run between June 11th and June 17th?
Give me a detained analysis on your running routine for June 30th.
Can you tell me more about your running form? Detail posture and arm position.
-
What is the first event you see on your screen for June 11th?
What time is it for?
-
Please choose Perfect Form and add it to you schedule for June 11th, at 7:30AM
Change the reminder to 5 minutes before the start time
You get a reminder
Snooze for now
Quit the event
Let them know you can’t make the time, but their reports are an easy read
Exit
What is the purpose of the last screen?
-
Let’s snooze for a bit before heading out
We have tested a run before, how is this different?
What are your thoughts on the safety net provided?
Test plan
Learnings and Next Steps
Motion guided audio feedback was not fully validated as the Sketch platform does not facilitate audio integration. Though test participants did not find the experience consistent and continuous; the standalone audio was not too far removed from the user’s mental model of a solution, and generated interest.
For the next round of testing the prototype will be designed with Adobe XD; which enables integration of audio files as an MP3 or a WAV file.
User feedback
Recommendation
The profile questionnaire was lengthy. One of the participants commented that this was possibly a perception created by the additional clicks required to move to the next screen; and the transitioning of screens in the buildout would address this concern.
Metrics displayed on screen during workouts are not expressed in relation to where users should be. This was a behavioral requirement triggered by solutions that had already failed users.
As per research, response burden is frequently mentioned as a reason for abridging questionnaires; however the evidence to support the notion that shorter instruments are preferable in limited. I did however believe that gathering input for age, height and weight should be abridged to a single page.
Requires further testing and validation. I will retest feature after a full build out of the audio feature; as this guidance and assurance would over ride the addiction of visuals of “hitting numbers”;a learnt behavior.
Users suggested an in-app wake up alarm
A potential features add on to investigate in the future as it does not contribute to the core build out
60% of the participants were able to complete the tasks unassisted; the core functionality was conceptual, and users were unfamiliar with flows. Participants were intrigued by the concept of a personal trainer feature guiding workouts, but would like to experience the audio build out to fully evaluate the experience. Notifications helped guide users and information in input controls was simple and to the point and layout of pages made sense. The priority corrections called out require audio integration and ard cannot be executed on the Sketch platform.
What worked
Honoring Michelle Go, Dorothy Clarke-Rozier, and Christina Yuna Lee - precious lives lost to street violence.
Though the iPhone has an SOS feature, I built additional layers of protection by engaging the cameras and microphone to record the immediate environment, and the flash to attract attention in the event of a sudden fall.
I believe this feature presented itself as a disturbing reality for users. Their lowered voice, sudden change in position, and reaching out for cell phones did not support the bravado of words; “Right, right, I get this - I would not be needing this, I am healthy and able to protect myself.”
Activity dashboard
LOOK Information was an easy scan, not cluttered with rings and graphs
DESIGN GRAPHIC The legend was easy to understand and the dashboard clear in detailing goals vs. performance.
ANALYSIS The recommendations were actionable above “performance scores” employed by current apps.
Hero image and content
LOOK Inspiring and relevant - interpreted it as “oh be fit.”
TEXTUAL CONTENT Succinct and created interest
Form correction
Visuals and analysis were easy to understand; the use of silhouettes increased learnability. One participant asked if screen feedback would be be an option when the audio functionality was built out. Participant commented on the inconvenience of workout videos where they had to “get it right” without ever knowing if they really were.
Sleep analysis
All users found the dashboard helpful; it indicated the time and severity of disturbance, additionally it was a single, detailed, informative and compelling visual - “even though it was a RING” (P1)
My growth as a UX/UI designer
The very same exercise routine has different results for men and women as their bodies respond differently to building muscle mass, and to set realistic expectations images must be relevant to the users gender association. As the public domain has few, if any, uncluttered images of men and women working out together, I incorporated this limitation as a personalization and the UI for the image gender forked at the gender declaration.
As for the inspired use of pink - progressive gender declares themselves as fluid with their color choices, and feminism has reclaimed pink from its sexist connotations. But I remained unsure if this freedom from prejudices was only in answer to the demands of the changing landscape of inclusion, or if it ran deeper?
I drew up some screens with the blue CTA’s, and tested with a group of 6 participants; 3 men and 3 women. One comment proved logically instrumental in guiding the color palette going forward:
As I see it you are not only re-lending pink its’ sexist connotation by partnering it with a mirror image in blue, you are also increasing the gender divide. I tend to cater to products and services that are marketed as gender inclusive.
Technology development for the “real world” has typically been driven by bioengineers and deployed in collaboration with mathematicians and physiologists. Wearing multiple hats that I did not qualify for did not allow me access to the relevant domain knowledge. Needless to say I embraced the complexity of identifying feature attributes that connect to define the solution. Sketch does not accommodate voice integration, and my core feature could not be designed or tested. As UX/UI designers we build concepts, and I believe I have been successful with bringing the closest wizard of oz experience I could manifest.
Researching fitness apps and isolating features for relevance gave me a roadmap of nearly identical features. We assume that if all websites start looking the same, the vibrancy of the internet would decline. In reality we are increasingly using the same libraries for design and even features, the repetition is buried under a varying palette of color, and pixel shifts. Once I was able to spot the likeness between current solutions, the user needs that remained unaddressed converged towards a solution.