The challenge was to create a fitness app to get people who don’t normally exercise moving.
Contributor / role
Graham Connell / User Research, UI Design
School Project (Interaction Design Foundation)
Empathize: Interviews, Survey
Define: POV, Affinity Mapping, Empathy Mapping
Ideate: Brainstorming, Low fidelity prototypes, User Feedback
Prototype: User Flow, Sketches, High Fidelity Prototype
Test: Usability Testing
I ran a survey and conducted 5 interviews to understand people’s habits around exercise. I was focused on 2 things:
1. Why do they skip or miss exercises?
2. What motivates them to exercise?
The survey helped narrow down my scope and informed the kinds of questions I asked in my interviews. During the interviews, I got the most valuable insights that answered my 2 questions. There were two groups of people; those who are self-motivated and those who are externally motivated (usually by other people). These people had sports backgrounds.
I called these groups ‘Individuals’ and ‘Team Players’.
Next, I used a couple of methods such as affinity mapping and POV exercises to synthesize my results into app ideas. The results were two apps, the first focused on building habits with the concept of building momentum, the other one was for people to work out with each other and feel like a part of a team.
Leagues Low Fidelity Mockup
Prototyping and Testing
I mapped out user journeys through both concepts and did some sketching. With this, I had some informal chats with some of my interviewees from before. I determined that the team-oriented idea was more interesting, so I decided to fully develop that idea for this project.
The idea was called Leagues Fitness. Friends would form teams and when they exercised they’d earn points. Their points would add up and place their team in a league to compete with for the week.
Medium fidelity sketch of Leagues
For the design, I wanted something that felt exciting, bold, and could get groups fired up about exercising. I also made sure to keep accessibility in mind and aimed for a minimum of a AA contrast ratio throughout the app, AAA in most parts.
For testing, I had people click through some prototypes and some more casual chats while looking at my Figma file. I’ve found the latter quite useful as people don’t feel like the design is done and are quite open to feedback, even when the design is high fidelity.
People liked the layout and idea of having leagues to compete in. They were interested in how the points system would work, but that was out of scope for this project.
High Fidelity Prototype
What I Learned
Prototypes should be small in scope. I had some issues with people getting confused about where and what they could click. It’d be much better to just do a few smaller prototypes, testing out a few screens or features on each test instead of trying to do an entire app in one go.
I was early to high fidelity prototyping. It would have been better to flesh out the different screens in a mid-level prototype and use that feedback to get closer to a final design. The reason this was a problem is users were focused on exactly the data that was showing and less on the interface and layout. It made it harder to get the feedback I needed on the overall design and layout of the app. The screens that need additional work are managing workouts, and going through data from past workouts.
Teamwork (must) make the dreamwork! I was on my own, so there was nobody to bounce ideas off from a design perspective. This made me rely more on getting feedback from users and got me comfortable showing work-in-progress designs.
The design turned out pretty well and satisfied the core needs of the target group. Since it is only a design exercise it’s hard to measure the impact of the app, but based on the feedback I got, people like the feel and would be very excited to use an app like this.