Overview

Problem

In 2014, Peloton, revolutionized the world of fitness. Their disruptive stationary bike and streaming service caught equipment manufacturers off guard and won the hearts of US consumers.

Since then, club operators have been longing for a Peloton-esque platform to deploy in their facilities. Currently, equipment manufacturers are in an all-out sprint to satisfy the commercial market's 2.1 billion dollar demand for an engaging content platform. However, nothing game-changing has shipped to-date.

AthliOS, a fitness software manufacturer, saw this as an opportunity. On the coattails of the Burn 60 Plus project, AthliOS and Burn 60 joined forces once again to enter the “Peloton-Killer” race. Our goal was to develop a data-driven, content platform for AthliOS's manufacturing partners.

Challenge

Design a personalized, content-driven treadmill workout experience.

Success
  • Showcased Burn 60 LIVE UI at IHRSA 2018
  • Completed MVP in March 2019
  • Currently in final development stage with manufacturing partner

RESEARCH

Closing the Gap Between the Content + UI

To kick-off our research, the team reviewed the Peloton platform to explore potential areas for improvement and differentiation. We discovered that the content and in-workout UI operated in silos—they did not communicate with another. In our treadmill product, we wanted the UI and content to have a symbiotic relationship. By using hotkeys and user profile data, we believed we could create a motivational and seamless running experience.

Design Goals
Habit Forming

How can we use product features to build a sense of community & enforce a habit?

Personalized

How can we use treadmill profile data to motivate the user?

Seamless

How do you design a UI that helps the user follow along with the filmed workout?

Wireframe

Using our research from the Burn 60 plus project, we quickly established the product’s requirements and user flow. During the ideation stage, I discussed the concept of supportive vs. competitive motivation with AthliOS’ lead engineer. Most fitness platforms utilize leaderboards as their core motivational tool. But, this tactic alienates the majority of your user base—no one feels good about being ranked 10,572nd in the world. For Burn 60 Live, we wanted to develop a community-driven system built on the principles of encouragement. A few feature ideas I created to satisfy this goal included a collaborative training program mode, weekly team goals, and in-run challenges.

ITERATION #1

Missing The Mark

My first visual mockup was a certified piece-o-junk. The team thought that the design was intimidating and that unnecessary information was abundant. For the average club user, the very idea of a high-intensity interval training workout is terrifying. We needed to present them with a fun and straightforward interface that soothed their anxiety. At this point, I realized I was designing for myself and not the average user. In future iterations, I kept this failure at the forefront of my mind--I didn’t want to make the same mistake twice.

ITERATION #2

2 Weeks. No Problem.

In the second iteration, I focused on expanding the dashboard concept, using data as a motivational tool and simplifying the interface. Two weeks into the design sprint, we learned that Woodway wanted to showcase our UI at the International Health, Racquet and Sportsclub Association (IHRSA) convention. This news pushed us to build out this iteration and pivot to developing content.

IHRSA 2018

To bring the interface to life, Jordan and I worked day and night developing animations for production. We only finished the last interaction minutes before the shoot began. To understand more about the Burn 60 live teaser and UI, check out this portfolio entry.

ITERATION #3

Back To The Drawing Board

With the success of IHRSA behind us, the team now possessed the time and resources needed to solve the issues we discovered during user testing. To make things even more interesting, a new constraint was added to the mix.

At IHRSA, we learned that using personal profile data to power the experience wouldn’t be possible in the club space—operators and manufacturers haven’t figured out a way to support multiple profiles on a single device. To deliver a “personalized” in-run experience, we had to get creative and redesign our platform to support a single-use scenario.

Design Focus
Design For the Content

Pre IHRSA, we designed the UI first and filmed the content second. This sequence caused A LOT of compatibility issues. For this stage of the project, I decided to run the design and filming sprint concurrent path. By doing so, we tailored our design decisions to support the content.

Make it "Personalized"

How do we create a “personalized” experience without user profile data?

Design for the Average Fitness User

The first and second iteration of the Burn 60 live UI was designed for the Burn 60 client—this was a mistake. The club client just wants to workout; they’re not as concerned with improving their athletic performance as Burn 60 clients are.

"People Take Days Off"

At IHRSA, we learned that pushing the user to improve every workout created a bad experience. We needed to revamp our system to make the user feel accomplished during their best workouts, and their worst.

Speed Selection + Hotkeys

In interval training workouts, users are frantically increasing/decreasing the treadmills speed and incline every two to three minutes. Because of this, HIIT studios use treadmills specifically designed to support constant interactions—the average commercial treadmill does not. To solve this issue and create a seamless running experience, hotkeys are vital. In previous iterations of the design, I only presented one hotkey. This attributed to the “poor experience” I described in the paragraph above. To resolve this, I created a new system.

  • Starting Speed Hotkey: At the beginning of any jog, run or sprint state, the user is presented with four hotkeys. The speed called out by the trainer is highlighted, but the user can select a slower or faster hotkey. I did this to avoid punishing the user for giving their best. As fatigue sets in, the user now has a clear escape route to continue the run at their own pace.
  • Increase Speed Hotkey: The increase speed functionality aligns with the philosophy described above. By offering an increase of 0.2, 0.5, and 1.0, a user can still obtain a rush of dopamine by tailoring the run to their ability level.

Now onto the bigger issue: How to do we customize the hotkeys to the user’s level of fitness without profile data? To do so, I designed a two-step, pre-workout speed selection process. I first ask the user to describe their running ability, and then auto-populate the speeds. Before starting the workout, the user can adjust the speeds with sliders or reset the recommended speeds.

State Timeline

At IHRSA, users complained about not having a “sense of place” during the workout. They didn’t know what to expect or how close they were to finishing! I designed a slider with color-coded speed values to solve this usability issue.

Final Artwork

In early 2019, the dashboard and in-run UI were finalized. AthliOS quickly spun up a working MVP so that we could shop our concept with potential treadmill partners.

ANIMATIONS

Makin' It Fun!

Jordan and I spent a lot of time brainstorming ways to use motion and color to increase engagement. To efficiently communicate our ideas to the engineering team, we made a walk-through video, starring yours truly 😉.

MVP Locked and loaded

Burn 60 Live is currently being ported to run on a major treadmill manufacturer's platform. We are hoping for an early 2020 launch! Not included in the case study are the countless hours we’ve spent developing an automated content production system. This has been a great personal learning experience for me, and I hope to use my new production skills in future projects.