Part 2 of the design process

Research possible solutions

Learning more about the context, competitors in the space, users and possible solutions from outside the industry

Learn more

Research avenues

The context

Fully understanding the environment and usage case for the UI is critical before embarking on UI design

Learn more

Competitors

Researching rivals and competitors approach to the problem can often be insightful, if only for what not to do

Learn more

Userbase

Designing a solution for the potential users would be impossible before learning more about them and their motivations

Learn more

Possible solutions outside industry

Before sketching anything, it is worth seeing what similar solutions are already used, not being limited to competitors

Learn more

The context

Getting to know it better

As a frequent gym class user myself I am familiar with the spatial and environmental concerns needed.

Typical gym class environment

Findings

Clarity is Key

Gyms are frantic, loud, constantly changing environments, especially during a class. The solution must be obvious and easy to read with a 2 second glance. On the phone and on the wall.

Size and orientation matters

The solution should be scalable to the gym requirements, but as a base point I would recommend using the solution on portrait orientated monitors as better suited for lists and parity with phone.

Must be stimulating

It needs to encourage and be prioritized over the other sensory inputs in the gym. The music, the grunting, the shouting PT... Whether through sound, colour, animation or all of the above the UI should POP. Check out this study on Gamification in fitness apps for more info.

Competitors

Know the industry norms

Spending a bit of time analyzing competitors apps and their solutions to the problem is always useful to see if their product fit is any better than ours. Focus here is on mobile devices as examples of wall mounted UI was tricky to find.

Findings

Strava

Probably the leader in fitness leaderboards, benchmark challenges are created by Strava and their users. Creates a community but allows for accurate and detailed personal tracking.

Zenplannner

Gives option to split by sex, but does it allow for gender neutral users? Interestingly allows conversations linked to specific datum. Icons mark PBs and records.

Jawbone

Explicitly marks numbered ranking. Also attempts boosts reuse by tracking last activity and number of activities.

Userbase

Learning more about potential users

The most important element of research was understanding potential users and how they currently use leaderboards. I did this through chatting to several friends of mine involved in fitness classess

Findings

Selected quotes from prospective users

"Benchmark challenges helps take an individual activity/sport and create a team community vibe and competition probably helps with retention for the businesses using it too which will be of interest to them"

Drew Jackson, former PT

"We usually use a white-board and pen anyone can come up and add too, I feel most are too scared or shy to be involved though"

Kaspar Iskjær, PT in training

"It would be great if you could track your stats from each class and compare, I dabble in a few different styles and disciplines"

Nikki Anderton, regular class user

Other possible solutions

Are there any UI patterns I can take from elsewhere?

Not limiting myself to just direct competitors the UI also takes patterns and ideas from areas outside the fitness industry.

Findings

Gyroscope and Instagram

Gyroscope is a fantastic app for beautiful information and live tracking data. It's easily Instagrammable outputs could easily work in other fitness areas.

Snapchat

When looking for inspiration for the simple app that captures a personal profile, Snapchat was an obvious choice. Odd but somehow useable UI that keeos it fun.

Mario Kart

As shown in my user research, creating a fun leaderboard is paramount of paramount importance if to be engaging. When looking for joyful examples of leaderboard UI where better to look than the arcade world of Nintendo.

Up next

Part 3 of the design process: Design

With a better knowledge of the context and potential users its time to start designing solutions.

Next step