Crux

Rock climbing app

What is the problem?

How can we make the rock-climbing experience in the gym easier and more exciting?

What is the solution?

Create an app that will help users to navigate the gym, track their climbing process, and create a community of like-minded people.

Tools

Figma
Illustrator
Photoshop

Skills

UX Research
UX/UI Design
Information design
Branding

Team

Solo

Timeline

09.2021 - 04.2022
or 28 weeks

Users and audience

Overall audience: rock climbing gym users, from 16 to 45. The App should serve the needs of a specific gym, namely Stone Gardens at Bellevue. People who are climbing here are of different ages and genders.

There are 3 main categories of users:

  1. Teen teams with kids who are learning how to climb and preparing for competitions
  2. Climbers, who climb regularly. They have a membership and go to the gym 1-3 times a week
  3. New climbers/day visitors. People, who just want to try new activities or athletes who usually climb in other gyms

Why I decided to concentrate on the second group of users:

  • They bring maximum profit to the gym revenue
  • As a regular gym users, they would probably use the App most frequently
  • These users create an inclusive atmosphere in the whole gym and make it more attractive for potential new users

Primary audience

Members of the gym

Secondary audience

New climbers and day visitors

Design thinking process

Emphasize, Define

Interview. Understanding current users

Firstly, I needed to understand the general pain points of climbers and their basic behavior model during climbing. I observed climbers in a gym and also interviewed multiple Stone Gardens users with the following question:

What kind of problems do you have during climbing?

Summary

Firstly, climbers can struggle with boring monotonous training sessions. They need inspiration and structure to train regularly.

User persona

Based on the gathered information, I made user personas.

Marketing analysis

I’ve checked the most popular rock-climbing apps on the market and found, that there are 3 main categories: navigation, training and community. Usually, apps of different types have the main specialization but also have overlapping functions.

Summary

There are three features that all Apps have in common: sharing results, checking progress, and adding routes to a log. These functions definitely should be considered important for a climbing App. Also, most of the negative comments for these Apps were about information overloading. Keeping the product simple should be one of the top priorities.

Competitor analysis

Currently, Stone Garden uses the Kaya App to provide users with actual information about gym news, route settings, and community events. To understand the pros and cons of this App, I conducted a usability testing with 5 users:

Primary audience

  • Stone Gardens members and regular users - 3 people

Secondary audience

  • New climber, first time user - 1 person
  • Experienced climber from another gym - 1 person

Since one of the main functions of an App is navigation, it was really important to have a testing session in a field.

It took so much time and so many clicks that I prefer to ask somebody what the grade is.
Mike
I’m going to give up and close this App.
Kate

The most common problems

Home page

  • "Why do I see all these random videos?"
  • A lot of extra information users don’t need

Map

  • The gym map is hard to read. Can’t find where are you now and where each route is.
  • Navigation between bouldering and rope areas takes too many clicks and is inconsistent

Routes

  • Routes dots are located too close to each other and are hard to distinguish and interact with.Sectors are in a top view. Can’t understand which wall it is at.
  • No names, no grades for walls. How to find a route?

Summary

The biggest problem for all types of users were the navigation system and overloading of extra information.

After finishing the initial research, I aggregated the problems my future App needs to solve:

Welcome Crux - rock climbing App that will lead your training to the next level!

Ideate

Engage

People are social beings and deeply enjoy communicating with like-minded people. Also, everyone loves to play regardless of age.

To make sport training fun, I can:

Make it social

  • Find people and follow them
  • Comment and share posts, activities
  • Clubs

Turn it into a game

  • Challenges
  • Achevements
  • Leveling system

Challenges

Rock climbing challenges are connected with how many routes and therefore scores a climber makes during a specific period of time limited by this challenge. To understand, how much score gets a participant, I needed to create a formula of how to math it.

Score formula

There are 12 main grades for the bouldering rock climbing, from V0 to V12, and their difficulty isn’t linear. It's hard to measure the difficulty between the different categories the complexity and therefore the points shouldn't be growing exponentially because climbing V12 is not comparable to climbing V1. It's virtually like different types of sportsmen who climbed those two different categories. That's why the suggested formula would work as follows: each next category will be twice as hard and therefore twice as expensive as the previous one. Plus, in addition to that, there are bonus points for getting the first ascent, meaning the flash/onsite, and for the red point you have 25% bonus points and if you scored the route from the first attempt you would get another 25% and total plus 50% bonus points. This is similar to what is typically measured in professional climbing competitions and should be the good one for motivating people to climb and compare athletes against each other.

Track progress

For the tracking progress, users can:

  • Search and add routes to the log
  • Check statistics and progress (calculated using score formula)

Navigate

The Crux has a map of a gym and, to make the navigation system cohesive, I needed to work with both physical and digital spaces.

Considering previous users’ feedback, I concluded the next important aspects Crux must have:

  • Simple navigation and clear floor plan
  • 3D images of walls instead of top view
  • Lines instead of dots
  • Route grades on walls

Information architecture

After I had a clear vision of what Crux will be, I built an application map and created user flows:

  • As a user, find a challenge and accept it
  • As a user, find another user and message him
  • As a user, find a route and add it into your training

Wireframes

Then I built a system of lo-fi wireframes for each flow

Prototype, Test

Mobile App

For the next stage, I did a hi-fidelity prototype and then tested it with the target audience user.
After collecting and analyzing all feedback, the prototype was refined.

I wish I’ll be able to add my own photo to the common challenges gallery.
Stanislav
Oh, I didn’t get that there is more than one challenge!
Alex

Personal page

With help of personal screen, user can track sport progress and stay in touch with community.

Challenge

After accepting the challenges, the user can track the progress on the personal screen. He can check how many points he has left to finish, see the participants, invite friends to join and also can add his own photos to this challenge.

Connect

Crux is a great tool for community. On the initial search screen the user can see suggested list of friends and clubs, and can follow one of these recommendations or use a search bar.

Start training

The user can start training by pressing a plus button from any App screen. Then he’ll get to the map screen and from there he can choose the room (South, North or Rope) or tab directly to the wall he is interested in.

Search a route

After choosing the wall, user get to the list of routes. He can choose the line he is interested in by tapping one from the list or by tapping one on the image. After choosing, he’ll see the route closer, check beta, ratings and reviews. Then the user can add line to his log.

Add a route to a log

User can add his own photo and choose the attempt style. If he isn't sure, what was his style, he can tap unsure and use prompt.

Finish training

When user is done with logging a route, he’ll see a notification. If he goes there, he’ll see a statistic. When the user is ready, he can finish the training and check the results.

Design system

To make a clear and cohesive visual system, I established fundamental visual principles as colors, typography, and spaces to create reusable components.

Navigation

To keep the visual design for the navigation system cohesive, I made a style board and followed it while creating graphics for walls, signs in a gyms, and the map in the App.

During interviews with Stone Gardens users, I found that some people with colorblindness have problems with understanding the route line. Sometimes adjacent routes or walls have low color contrast and it makes them hard to recognize. To solve this problem, I decided:

  • Create an accessible color schema for environmental elements, as walls and signs
  • Create simple rules for route setters on how to create routes

Color schema

Rules for route setters

Bad color combinations:

  • Pink, Red, Green

Bad color combinations:

  • Black, Blue, Red, Yellow, White

If it’s impossible to avoid bad color combinations, put a tape beyond each hold on a route.

Walls

I suggested a new painting for walls according to the accessible color schema and in cohesiveness with the style and also added a walls names.

Branding

When creating the corporate identity, I was inspired by bright vibrant colors and simple lines that can work as building figures for icons, navigation and other graphic elements.

Reflections

I’m really passionate about rock climbing and love UX design.  Working in these two overlapping fields was extremely interesting for me.

Takeaways

Feel your audience

I was not only a designer for this project but also a user. The project gave me a lot of useful information and a deep understanding of the problems. I didn’t need to ask other users tons of extra questions because I immediately understood their concerns. After this project I’m sure that deeper I understand potential users, the better I can solve the problems and problems of the product.

Limitations are everywhere. And usually, they are easy to solve

It was a huge surprise for me when I found that color blind people have problems with finding a route. Surprisingly, a few of them were my friends. They had never told me that they have any problems and have never complained. It was easy to adjust and create a color system to make a basic rule that solves this issue.

Future exploration

  • Develop App, add more flows
  • Add animation
  • Make usability testing in the gym
  • Create a kit for adopting the App to the other gyms (franchise)