Product Designer
1-hero-dashboard.png

CrossFit Games

Compete, connect, compare with the CrossFit Games App

 

MVP Release | Interaction Design

CrossFit came to us to help them build a premier all-access pass to the CrossFit Games, the largest international fitness competition in the world. Over the course of four months, our challenge was to create an authentic experience for measuring fitness that evolves as the CrossFitter transforms from a competitor to a fan. 

Our team created an app that allowed CrossFitters to see where they stack up locally and worldwide on their personalized leaderboards. When it comes time to compete, they can view the workout, submit their score, and see their results on the leaderboard and dashboard in real time. 

I led UX for both iOS and Android platforms as well as owned the App/Play Store Optimization and copywriting. The team was comprised of another designer, a product manager and four developers. 

We're live in the App Store and Play Store 💪

Be sure to check out this app hype video created by Prolific to get pumped up!

 

 
CrossFit-Games-Overview-Heather-Prime
 

Building an app for CrossFit athletes and fans

 

We started our process wide. We conducted stakeholder interviews and stakeholder design workshops to establish business goals. Generative user research, user interviews and surveys, helped us to develop our user goals. Personas and a journey map helped us summarize findings and align on an app purpose. 

 
 
User journey map created after a week of stakeholder and user interviews. This was used to help our team and CrossFit align on specific priorities for the MVP.

User journey map created after a week of stakeholder and user interviews. This was used to help our team and CrossFit align on specific priorities for the MVP.

 

Personalizing my Results

 

CrossFit wanted to captivate and engage their athletes before, during, and after the Games. After speaking with athletes we found they wanted a clearer, more accessible view of how they personally were doing in the Games. CrossFitters use the Games to track their fitness level compared to themselves year over year, and to other athletes similar to them. In previous years, athletes scroll through hundreds of pages of rankings and make calculations by hand to determine how they're performing. We designed a personalized dashboard where users could immediately see their ranking locally and worldwide. 

 
caro-push.gif

Swipe through the dashboard cards to narrow down by worldwide, region and affiliate (gym). 

push-pers-card-final2.gif

Tap into each card to view details. See your percentile overall and a breakdown by workout.


Follow the Competition

 

Over 500,000 athletes participate in the CrossFit Games. All of these scores and participants from across the globe live in the leaderboard. We translated and optimized the current leaderboard spreadsheet and filters to allow athletes to quickly access meaningful data. Search or filter to compare your performance to your friends, family members, your occupation, region, fitness nemesis or favorite elite athletes.

 
Through surveys and interviews we determined which information was most useful to surface to athletes. Tap on an athlete to see how they've performed in recent workouts and see more bio data. 

Through surveys and interviews we determined which information was most useful to surface to athletes. Tap on an athlete to see how they've performed in recent workouts and see more bio data. 

Athletes wanted a way to quickly see how their friends, frenemies or favorite athletes were doing without having to go sort through the leaderboard. We created a "follow" feature that allows athletes to add other athletes to their dashboard. 

Athletes wanted a way to quickly see how their friends, frenemies or favorite athletes were doing without having to go sort through the leaderboard. We created a "follow" feature that allows athletes to add other athletes to their dashboard. 

Filter the leaderboard down to view top athletes in other regions, gyms and see how you compare!

Filter the leaderboard down to view top athletes in other regions, gyms and see how you compare!


View the Latest Event

3-events-heather-prime-hero.png
 

Events, also known as 'workouts' are highly anticipated. For months beforehand up to the minute, CrossFit athletes are training for, dreaming about, dreading, and making friendly wagers on what the Events in the Games will involve. Athletes need to be able to quickly view the workout and understand what's involved. They also need to be able to know exactly when their scores for that Event need to be submitted by, and access that entry point easily.

 
Athletes can view which workouts are "live" or in progress, and know exactly when they have to submit their scores. They can view the event details and movement standards in the detail view.

Athletes can view which workouts are "live" or in progress, and know exactly when they have to submit their scores. They can view the event details and movement standards in the detail view.


Track Your Fitness

profile-hero-video-final.gif
 

Athletes obsessively keep records of their performance. They track their scores and results year over year, as well as their benchmarks weight achievements. Additionally athletes love viewing other athletes profiles to compare themselves and learn more about other competitors. We built an athlete profile that stored all their information so they could easily access personal records as well as those of others. 

 

4-android-hero.png

Cross-platform

Let's not forget about Android! We worked closely with all iOs and Android developers to design effectively and efficiently for both platforms. 

 

prolific-crossfit-2532.jpg

Process

We aligned on app strategy early on in the process, allowing us to dive head on into short design sprints. Each week we synced with developers on what we're cooking up, interviewed users on our latest concept, and presented to stakeholders. I created weekly UX Design digests, to keep our stakeholders up to date on research findings and invested in learning along with us. I also initiated a new type of user research using a private Facebook group. I wrote about it for UX Pin here.

 

 

 

 



 

 

 

An example of a weekly UX Digest I created for CrossFit. It summarized our user testing findings with relevant screenshots, quotes and next steps. CrossFit found these extremely valuable to their internal team's knowledge of their user.

An example of a weekly UX Digest I created for CrossFit. It summarized our user testing findings with relevant screenshots, quotes and next steps. CrossFit found these extremely valuable to their internal team's knowledge of their user.

This is a screenshot of a poll I created on the private Facebook group filled with CrossFit athletes. This was a quick way to gather data to quickly test our assumptions. 

This is a screenshot of a poll I created on the private Facebook group filled with CrossFit athletes. This was a quick way to gather data to quickly test our assumptions. 

 
To build for CrossFit we truly needed to be immersed in the culture and to speak the same languages. Every week we worked out with our CrossFit partners at HQ.I have never been so sore in my life.

To build for CrossFit we truly needed to be immersed in the culture and to speak the same languages. Every week we worked out with our CrossFit partners at HQ.

I have never been so sore in my life.

 

Next Steps

 

To help CrossFit determine what to build post-MVP release we conducted user interviews, surveys and an analysis of feature requests. Our goal moving forward was to validate opportunities to increase engagement after the first 5 weeks of the competition were over. To do that we needed to gain a deeper understanding of athletes current behavior after the first leg of the competition, where they turn from competitor to fan. We also wanted to understand athletes interest in fitness challenges, CrossFit media and charity workouts.

We're continuing conversation with CrossFit on their mobile strategy moving forward. In the meantime check us in the App Store and Play Store 💪.

 
Snippet of a presentation I made for CrossFit on post MVP strategy. 

Snippet of a presentation I made for CrossFit on post MVP strategy. 

Stakeholder app strategy workshop at HQ.

Stakeholder app strategy workshop at HQ.