UX Researcher & Designer
Background
Tough Mudder has helped thousands tackle their fears and muddy obstacle courses for years. However, competition has grown and we see that Tough Mudder needs to improve runner experience and loyalty to remain successful. My team created a mid-fideltiy iOS app prototype to address these issues.
Challenge: Create and integrate features for iOS app to increase Tough Mudder repeat participation.
Extra Challenge: Tough Mudder withdrew the app assigned to our team, so we did not have an existing framework and design system to reference. Therefore, we started from scratch.
My Roles
-
Project Manager
-
Wireframes Lead
-
Testing Protocol
-
Presentation
Methods and Tools
-
Surveys
-
Interviews
-
Affinity Mapping
-
Participatory Content Mapping
-
Sketch Wireframing
Tough Mudder Conceptual iOS App
Planning and Research
User Interviews
We created and circulated a screener to recruit people who:
-
had participated in Tough Mudder or a similar muddy obstacle course race
-
had run at least once
-
were willing to discuss their experiences with us.
Our seven screened runners shared their race likes, dislikes, and experiences, which affinity mapped in Miro.
We identified four overarching themes:
-
Finding or joining a team is difficult on the Tough Mudder site and only happens through the forum
-
Teamwork and fun are more important than competition
-
Most would run again with right support and motivation;
-
Communication on teams and with organizers is hard.
Business and Mudder Overlap: Team Matchmaker
Nearly all of our users spoke to the importance of their teams. Also, they talked about how it's nearly impossible to join teams or invite new runners to your own on the current Tough Mudder website.
Improving team experiences will also benefit Tough Mudder as a whole since runners will encourage each other to return each year and become loyal to the brand. We developed our problem statement and hypothesis to meet both business and user needs:
Problem Statement
Tough Mudders need an easier way to join teams to increase excitement and preparedness, which will improve their overall experience.
Hypothesis
We believe that by creating a Tough Mudder iOS app for runners with a team matchmaker, we will increase repeat registration by creating a more useful user experience. We will measure success by how many people use the app to join and expand teams and the increase in repeat runners.
Comparative Research Obstacles
Once we settled on a team matchmaker feature, we looked for references. Since our client application was unavailable, we hoped to learn from competitor apps like Spartan Race and Warrior Dash.
Unfortunately, those were either unavailable or not focused on team-building and runner loyalty.
I suggested that we look outside our peer companies for inspiration, especially for apps that facilitate teams and communication. We consulted Meetup and Heja.
Ideation and Testing
Prototype Version 1
User Journey
Ideation Process
Since the app we were supposed to improve had been deleted, my team created a rough framework to augment. We referenced the current Tough Mudder website for color, design, and imagery inspiration, but collaborated on the screens for our team matchmaker feature.
An early design studio exercise helped us explore team homepage ideas and align our goals. The page helped us prioritize features such as images, names, location, skills, and processes.
.jpg)
.jpg)
Collaborative Design Progression Examples
Participatory Design
We also incorporated participatory design in a content mapping exercise with two repeat obstacle course runners to learn more about what they valued about the experience: teamwork, fun, and achievement.
The users expressed frustration about registration processes, communication with organizers, and difficulty finding or building teams. We also discussed what the users valued in teammates, which helped us determine ways to filter and select teams. These attributes shaped both the personal and team profiles.
User Journey
We developed a user journey to clarify our findings and guide our navigation design process.
Wireframes
I created wireframes in Sketch informed by our research and used Meetup for layout inspiration.
Testing with Users
We asked three users to test our initial design for our tasks:
-
Find a team
-
Request to join
-
Accept an alternative team invitation
While users had some questions about how they could learn more about potential teams, they all completed the tasks without much frustration. They reported an average ease of use score of four out of five.
We did want to improve the team page layout and address questions about runners' profiles, which we addressed in our final iteration. We also wanted to integrate existing training materials from the Tough Mudder website to have more content for users to explore.
On Course
-
All users who explored the team matchmaker feature said they could see using it for future races
-
Our information architecture and menus remained confusing, which I believe we could fix with more time to complete a full app design process rather than creating a feature for a non-existent product.
Design
Final Feature Screens
Runners can search and filter teams based on location, strengths, and needs. Users can also preview team information before requesting to join or accepting an invitation.
A messaging feature allows users to communicate and plan team events, such as a group training session using the integrated Tough Mudder exercise materials.
Since many teams are not geographically close to each other, the ability to do the same exercises despite distance would increase team cohesion and event loyalty.
We created runner profiles with user-reported strengths and weaknesses as well as a quote and bio. This allows users to learn about each other before teaming up. Team captains could also search for recruits based on this information.