Ascent

Ascent is a climbing app for women and gender non-conforming individuals with the focus on providing a solution to a safer and more supported climbing experience in and outside of the climbing gym.

UX Design | Case Study

WELCOME TO ASCENT

The Case Study

Ascent is a climbing app for women and gender non-conforming individuals with the focus on providing a solution to a safer and more supported climbing experience in and outside of the climbing gym.

Ascent is a case study that I completed during my time in the UX Design Bootcamp at BrainStation. This case study is a culmination of the entire user experience design process; from the research components to the high fidelity prototype.

Project Details

UX Researcher, UX Designer, UI Designer

Role

Tools Used

Figma, FigJam, InVision, Adobe Illustrator

Project Length

10 Weeks

Platforms

iOS, Responsive Design for Mobile/Web

THE WHAT, WHY AND HOW

Problem & Context

The world of indoor rock climbing has notably evolved since the 90s. Women now make up almost 50% of competitive sport climbers. However, rock climbing as a sport has historically been male dominated with a “boys club” mentality.

The world of indoor rock climbing has notably evolved since the 90s. Women now make up almost 50% of competitive sport climbers. However, rock climbing as a sport has historically been male dominated with a “boys club” mentality.

According to one study, 65 percent of women said they had experienced micro aggressions, while only 25 percent of men responded the same way.

The Approach

The Double Diamond design model was used throughout.

Discover

Discover

Discover

Discover

Secondary Research
User Interviews
Affinity Mapping
Persona Creation
Experience Mapping

User Stories
Task Flows

UI Inspo
Sketching
Wire Framing
User Testing
Brand Development
Hi-fi Prototyping

Next Steps

LET'S ESTABLISH SOME FACTS

Secondary Research

An astounding account of articles detail the increasing involvement of non-male presence in the sport of climbing but also the increase of gender disparity and micro aggressions.

Gendered minorities were reported to be affected 1.5x more regarding access to training and skill development compared to women and men.

Women-identifying climbers perceive social influence as a much higher motivator than men.

Making the climbing community more diverse and inclusive not only benefits the longevity of the sport but makes women feel more empowered.

User Interviews

User interviews were conducted with five climbers who do not identify as cis-male via in-person and virtual interviews for 30 minutes to 1 hour and asked a series of questions around their experience of in climbing.Through these interviews, I was able to synthesize the data in an affinity map, gather key insights, and focus on a singular thematic problem: Gender Influence

Key Insights

Coming Soon.

How Might We...

How Might We support climbers who do not identify as cis-male feel more supported and safe in the male-dominated sport of climbing?

The Persona

STEPPING INTO THEIR SHOES

Through interviews and data synthesis, the persona, Chelsea McAdam was created. Chelsea represents the target user of the app, Ascent.

THE EMOTIONAL JOURNEY

Mapping the Experience

Developing a realistic persona allowed me to accurately and effectively empathise with the needs of the target demographic and branch off from this point to start building a solution.

PICKING A SOLUTION
The Task Flow
In order to develop a single task-flow to focus on, I started by developing user stories for Chelsea. As a beginner non-male climber, they have wants (based on the pain points above) that are to be fulfilled by the features on the app. Thinking with the solution in mind, the goal is to ideate potential viable features to solve the pain points.
Find a safe climbing community to belong to in order to make their climbing experience more supported and safe as a non-male climber.
Find a safe climbing community
Task Flow
Core Epic
IDEATION AND DEVELOPMENT
Sketching
The sketching process began with pulling UI inspo and exploring potential concepts and ideas for each state in the task. Since our persona, Chelsea, is an avid social media user who is fairly acquainted with technology, elements and features from existing social media apps were used as inspiration that would make it easier for the user to navigate. Overall, the app needed to reflect the goal; to be community oriented, and a place that is safe and supportive.It was important to include aspects of community, safety and support through the app communicated through not only the features, but the overall user interface.
Solution Sketches
Solution sketches were developed by pulling key components, inputs and controls from my exploratory sketches. The solutions sketches below were developed for each location in the task flow and helped develop the initial prototype.
MID-FIDELITY
Wireframing
To help visualise the work and test the initial concept, the solution sketches were developed into lo-fi wireframes in Figma.

The goal of the mid-fi wireframes are to test the functionality of the specific solutioned task flow before any visual aesthetics are added.

I focused on developing the functions and features of the landing page, search process and climber profiles.
MID-FIDELITY
Putting the mid-fi up to the test, user testing was conducted in two rounds, with 5 different non-male climbers in each round. Through a series of tasks and natural use of the app, the feedback gathered was used to create a final version of the mid-fi prototype.
User Testing
Landing Page
The landing page covers two of the main pain points covered above and acts as the starting point for the primary task flow. On the landing page, the user is able to see the demographics of their home gym, enable the primary task flow to search for other climbers, view climbers on the app, see recent posts, and book sessions with other climbers.
Search Process
The search process is a heavy component of the primary task flow. This is where the user answers a page by page questionnaire that acts as a filtering system for the app to curate the most suitable climbers for them and their needs. This section needed to be accessible and inclusive for those using the app with carefully constructed questions and answers.
Climber Profiles
The climber profiles double up as the user profile and profiles of other climbers. Designing the functional aspect of these pages really had a focus on how to communicate that this person is open to receiving friend invitations, a little bit about who they are as a person, ensuring they are verified and safe to engage with and convey they are a real person. Safety and support being a main concern, it was vital to the functionality of the app that we take care of that for the user.
BUILDING THE VISUAL IDENTITY
Putting the mid-fi up to the test, user testing was conducted in two rounds, with 5 different non-male climbers in each round. Through a series of tasks and natural use of the app, the feedback gathered was used to create a final version of the mid-fi prototype.
Brand Development
Mood Board
Taking into account the needs of Chelsea, the persona, I developed a mood board to encompass the experience of Ascent in visual elements.
Word Mark
In order to find a name for the app, I explored climbing jargon and words that encapsulated the keywords I had selected and the vision I had for the app. At the end of the day, I chose Ascent.
App Icon
I had an affinity towards the “A” in the word mark and decided to use that as the main focus for the app icon exploration. The “A” in the word mark stood out naturally. I decided to use it for the brand app icon for its memorability and structure. The colours were based on the primary and accent colours and picked based on accessibility and visual appeal. The gradient on the icon adds depth and professionalism to the final product.
Colour Exploration
Colour brings life into the app and often evokes emotion. I extracted colours from the mood board, selected a primary and tested it against the rest to build out a colour palette.
The UI brand colours for Ascent are rich, bold and deep navy and gold that also come off fairly gender neutral. I chose to use the primary deep blue for the background interface due to a survey claiming that 91.8% of users use dark mode on their phones. The accent gold created a bold contrast to the blue and passed the AAA (WebAIM) accessibility standards to encompass Ascent’s responsibility to be equitable.
Typography
Seeing as Ascent is a bold and sport-related app, it felt fitting to find a typeface in the neo-grotesque or geometric san-serif type families to support the brand. I chose to use Porter for the word mark and as a heading style in the UI - a geometric, bold and impactful typeface. For the rest of the UI, I went with Creato Display, a neo-grotesque typeface most comparable to Helvetica or Univers - used for the headers, body and caption copy.
PUTTING IT ALL TOGETHER
High Fidelity Prototype
Having built a UI library, I combined that with the developed branding and created the Hi-fi prototype.

While developing the hi-fi prototype, it was important to consider accessibility of the animations and colours; keep them simple, easy to use, and AAA compliant.
Individual Frames
WHAT’S NEXT?
Further testing would need to be conducted on the high fidelity prototype. With the numerous tasks and capabilities of the app, safety and testing would be priority before launch.
Future Thinking
LEARNINGS
Key Project Learnings
Throughout the process, I learned a lot, but can be summed up in the following:
If the design isn’t accessible, it’s not good UX design.
Anyone can become a good UI designer with time but what makes a great UX designer is someone who can include accessibility into their design thinking throughout all stages of the process; beyond colour integration.
It’s hard to be unbiased.
One of the most challenging parts about researching and doing the design thinking of my capstone project was having to remove all my biases and previous notions of the sport and focusing on how the problem space was experienced and lived through the shoes of the user. Being a climbing myself and very passionate about the topic, it was incredibly hard not to inject my own thinking in the research phase. I overcame this by focusing on the users and their way of thinking while also delving into the problem space and getting answers through their experience.
Done is better than perfect.
Something an instructor at BrainStation really drilled into us. I took this lesson and applied it to my work ethic throughout the bootcamp but also in my own design thinking process as the following: design and the way you design will be ever changing and evolving - if I take a look at something and think it is absolutely perfect, I’ve failed because I’m no longer designing for the user but for my own virtue.