Project Type: Academic
Timeline: 10 Weeks
My Role: UX Researcher, Design Strategy, UX/UI Designer
Tools: Figma, InVision, Canva, Milanote
THE DESIGN PROCESS
I followed the double diamond design framework during my project.
RESEARCH & DISCOVERY
Seeing the problem in my day to day-
While attending BrainStation I was employed at a local outdoor shop, Mt. Waddingtons Outdoors, in my hometown, Chilliwack B.C. where we have a large climbing culture. But during my time there working I was always inundated with questions about the local climbing; Where is the best spot for a new outdoor climber? How do you get to this climbing spot? What are the routes like? Are there any climbing groups that get together and climb weekly or monthly? Seeing this almost daily in the summertime prompted me to explore this problem space and to see if I could create a platform to help build a tighter, safer community of climbers.
What are the challenges facing climbers?
Internationally there are 46,711 established and recorded outdoor climbing routes. To put the Canadian market in perspective, 16,723 of those are in Canada and of those 7,309 are in British Columbia alone.
As the number of climbing routes grow and develop, the amount of climbers also grows.
The age demographic is quite broad as well, "with proper supervision, kids as young as 5 years old can enjoy the activity, as children are natural climbers" but the largest portion or rock climbers are ages 18-44.
The climbing industry continues to mature. This maturing has tended to be along the lines of making the sport more accessible to the general population. For example, equipment has improved over the decades to allow a much greater degree of climbing safety. The appeal of climbing is that it is considered an ‘extreme sport;’ however, most people want to limit the extreme part as much as possible. Sport climbing became popular in the 1990s because its pre placed bolts afforded the climber more protection.
Another reason climbing has become so popular is that it can be a great social activity. Roped climbing, both indoors and out, requires at least two people, but can also be enjoyed in small groups. It’s the perfect activity to do with a close friend or significant other, as it allows time to hang out while still getting a good workout in.
So we have looked at the fact there is a ton of routes and an ever growing population of climbers. So where is the problem? Well the problem lays in the way the climbing communities are able to communicate. Communication before the internet was mostly if you met them in the climbing space or through other people, something that still takes place today. Then the internet came and forums were a great place to communicate but it was withdrawn and could take days to get a response or none at all.
Then the birth of Facebook. Doing a deep dive netted thousands upon thousands of climbing Facebook groups. Name a location, there was a Facebook group for those climbers. As we all have been part of groups they can play a good role in making friends and organizing events or meet ups but a lot can be missed.
As the amount of climbers grows the need for an organized, up-to-date, standardized data base of climbing routes grows.
When climbing grows in a community, more and more routes are developed. As routes are developed and cleaned they usually are kept secret until a first ascent has been done. Most developers tend not to share said routes until their friends have ascended it as well.
This practice is quite commonplace. Unfortunately for the rest of the climbers this tends to lead routes to be kept among friends and never updated in data bases. Leading the way for a loss of information or miss information on route grades
CURRENT MARKET STATE
After spending some time on the app, it becomes a little easier to use but still is not user friendly. The user has to navigation a lot in order to get to or even find routes, Using the map helps a lot nut can be cumbersome to navigate at times.The social aspect is much like that on the website, a forum. You can get lost in it and you can miss messages as notification are not a thing on the app. The text is very small across the app.
I also don’t get a sense of community within the app, something I seek to fix in mine..What they do very well is the information architecture on the climbing areas. They have numerous filters for narrowing down exactly what type of routes and grades you are seeking.They also have a great number of photos, all of which have been uploaded by the user base, their descriptions and directions are also very good and easy to navigate to the locations. This can also be a little over populated as it is text heavy but is separated by clear borders. The users submits almost of the information which can be unsubstantiated.
There is no denying the fact that the rise of climbing within social media and advertisements has contributed to the growing popularity of the sport. Both indoor and outdoor climbing have appealing aesthetics that lend themselves well to the creation of engaging content.
Outdoor climbing provides content creators with gorgeous backdrops, dramatic natural features, and ample opportunities for an epic pose, and giant advertisers have taken note. From Toyota to American Express, international brands have utilized images of outdoor climbing to sell their products.
THE DESIGN CHALLENGE
How Might We...
With my secondary research I was able to create my first challenge statement:
CONVERSATIONS WITH CLIMBERS
I undertook a big task, a task that was a little out of my realm. I am very much an outdoor enthusiast but rock climbing was more of a one off for me, something I did when I was younger and only dabbled with in my latter years. So for me it was very important to interview only climbers, and as I learned, climbers can be hard to nail down. They're typically in the gym or out climbing, so I really had to be flexible with my time and interview them on their schedule.
In this process I gathered qualitative data. It included the participants attitudes and behaviours regarding their climbing practices, as well as their methods behind finding spots to climb at, how long they have been climbing for, . I analyzed the interview notes for each participant, extracted quotes, and classified them under three categories:
1. Behaviours 2. Motivations 3. Pain points
Four themes emerged from those interviews, those provided me with insights into the problem space. After reviewing each theme, I chose one core insight to move forward within my solution. Here are my insights from my conversations with them.
REFINING THE DESIGN CHALLENGE
After my conversation with climbers and getting insights I refined my "How might we..." to reflect them.
In my new version, I reframed the problem space. Firstly, by honing the who my target users are. Secondly, by stating what my target user wants, in this case to exchanging information on locations and why; "for their safety." Since a lot of the problems were out of my scope, eg fixing the diversity and distribution of information, we wanted to address the issue of connecting climbers.
Keeping the user and their experience at the centre of my design moving forward.
From my interview insights, I was able to extrapolate and get a better sense of a climbers experience. With this research, I created my persona and experience map. This will direct my designs for my target users and identify the opportunities in where to focus my digital solution.
In creating my user’s experience map, I explored what my persona's personal experience would be if she was searching for a route she heard about in the local climbing gym. In the process, I placed myself in Lins climbing shoes, breaking down her search habits, and balanced the values for intervention in different places.
Authoring User Stories
To guide myself in the ideation process, I authored multiple different user stories from the perspective of my persona, Lin Hsu and I used this structure:
- As a [user type] I want to [desired action] so that [I benefit] -
I expanded Lin's experience map with 34 user stories that identified my persona's desired behaviors and outcomes. I then grouped my 34 user stories under 5 distinct epics to find similarities and sort their relevance. Grouping them I was able to chose my epic to create my user task flow.
Chosen Epic: Community
Chosen Task: As a climber I want to make new friends so that I can build a bigger community to climb with, safetly.
Task: Add a new friend so I can plan a climbing trip with them.
USER TASK FLOW
After identifying my main tasks, I developed a task flow thinking about how my user persona, Lin, would interact with the my app, to complete her task. The task flow below shows Lin adding a new friend from the climbing gym to plan a trip to outdoor climb with.
INSPIRATION & SKETCHES
Using Invision and Milanote I drew inspiration from Dribbble, UX Archive, Collect UI, Mountain Project, ClimbAway, and 27 Craigs. I also sought inspiration from alternative methods like watching climbers in their space and watching climbing movies. For my QR feature I drew inspiration from Linkedin and Pokemon Go. Once I was in the climbers mentality I sketched out some rough drafts, landing on my 3rd version which you can see below. Looking back at the process I would have like to done more annotations, something I will be implementing in my process going forward.
From my sketches I created components in Figma using material design principles from an IOS device and used those in my digital prototype. Using appropriate interactions and animations, I prepared my prototype for formal user testing.
Before moving on to testing I added an additional section on my screen after realizing I needed to add more route information to complete my task flow. Seeing these issues early on was important as it would had been confusing in my testing phase. Jumping back to sketching on paper I used quick sketching and developed these two extra screens.
After sketching additional screens for completing my task flow, I created those additional screen is low fidelity. During my low fidelity phase, you can see another screen has been added to correct for the specific climbing spots.
How we are testing:
As a part of the design process, I conducted 2 rounds of usability tests with 10 users, 5 users per round, using 1 persona in order to obtain practical, real-time feedback that can be incorporated and to improve the design, that will provide a more optimal user experience specifically for climbers.
3 out of 5 users were wondering how and where their QR code would be, so I added a QR CTA.
4 out of 5 users wanted more information on the profile. I added more spacing and gave this section better hierarchy to the profile description.
Another suggestion was adding a common term from the climber community, “Ticks” instead of climbs. Which is a throwback to when a climber would check a box in climbing book, adding the my-to-do helps climbers also to keep track of climbs they are either working on or the are planning on doing.
3 out of 5 users liked the photo of the month but thought it was to small. Moving the photo of the month to the header image creates a better full page community vibe. This also allows for more room for the upcoming events which was far too hard to read for 5 out of 5 testers.
Simplifying the UI will help the overall usability of the app, as 4 out of 5 users found it easy to use but had a lot of questions regarding the design. So I minimized the information and removed the profile photo on the friend card, to match the IOS principle design.
Adding climbing types on the profiles assures other friends are able to know their friends climbing abilities so they know if they can climb with them, as each climbing type requires different skills.
I removed the chat from the profile as we have it on the nav bar. Adding climbers ticks was to our friends screen was requested by 4 out of 5 testers, so they can view what their friends have climbed.
During the user testing we saw a lot of confusion and hesitancy toward the camera icon, 4 out of 5 users didn’t know it was a button until they tried clicking it. Changing the icon from a camera icon to more of familiar IOS Material design, serving to fix the confusion of where to tap. Adding a QR code served to this purpose as well.
Changing the menu icon to a back button allowed for freedom of movement, preventing the user to have to go back and start the flow all over again. Adding the search function to aid in finding friends quicker and more conveniently, as 3 testers said they might have a lot of friends when using the app.
From the testers feedback I received in testing Round 1, design changes were made to the prototype. I took the next iteration of wireframes to Round 2 of usability testing and continued to iterate.
As you can see I have implemented a lot more changes from round 2.
Here is my final wireflow after two rounds of usability testing which was used to design my high-fidelity. Now that we have our final flow, I can start building my brand identity through my UI and high fidelity prototype.
4 out of 5 testers wanted to see what is called “ticks,” which is a reference to the physical aspect of marking a route or climb with a check mark, something they do in a guide book. These “Ticks” are essentially a badge in the community,
When finding a friend or someone they want to climb with, these ticks serve as a gauge in how that person climbs and a true sale of their climbing level.
Filters will play a large role in how a person finds routes to climb, these will narrow down massive amounts of information to more digestible and attainable spectrum based on the climbers skill level.
BUILDING A BRAND
With my final flow I can now start building out my brand identity, starting with my list of adjectives that the brand embodies.
Epic, Breathtaking, Relentless, Hard Work, Awe, Exhilarating, Strength, Extreme, Beautiful, Shocking, Wild, Committed, Community, Perseverance. Narrowing down my adjectives to embody my full emotion of the app.
Using my adjectives and themes, I searched for images to create my mood board which I then refined using InVision. This became a source of inspiration and guidance for my design process. I used the mood board to extract colors and create a color palette, as well as establish my typography system.
Drawing inspiration from my mood board, from multimedia sources like climbing movies and from clothes climbers typically wear, I was able to curate and refine my colour pallette.
Vitala was designed to be a useful workhorse typeface for all text long, short, tall, and small. Subtle stylistic choices like asymmetrical shapes and tapering give Vitala a more handwritten personality without sacrificing a clean-cut appearance typically found in a geometric sans-serif.
Vitala is an incredibly versatile typeface. In making my chose for a typeface I required it to be just like the climbers using the app, hard working and versatile. Also this typeface will look as good on multiple platforms like print, web, and mobile. All of those would be required in marketing of the app.
APP NAME AND WORDMARK
Through rough explorations with pen on paper I was able to finalize my logo, iterating mountains with routes and ropes landing on one that had a group of routes leading down. To emphasize the connection with the community I grouped those routes with a mountain. I used a Blanca font because it was reminiscent of climbing gear used in the sport.
HIGH FIDELITY PROTOTYPE
Building a better community:
Scend aims to help bring the community of climbers to become closer and to help each of them to level up their climbing game by letting them mentor or be mentored.
Scend will will provide all the information a climber will need for their local areas, Starting with route information going all the way to letting the community post events, closures, and new, missing and developing routes.
Connecting Climbing Partners:
Scend will help climbers connect to other climbers to better their overall experience in the sport. Getting notifications when your friends going climbing or have sent you a climbing trip plan.
EXPANDING THE BRAND
For the purpose of my go-to-market strategy, I designed a responsive website to market the Scend app, this should serve in helping communicate the value proposition to potential users.
The design process included consolidating UI inspiration, paper sketches, multiple iterations in grayscale wireframes. Though no user testing was done in this phase, I would like to in the future to find any issues and really bring the design home.
Three key purposes for this site:
1. To educate potential users and what sets it apart from other apps currently on the market.
2. To build trust and communicate the apps value to our target users.
3. To help acquire users via alternate sources than just on an app store.
PROMOTING & MONETIZATION
In the early stages of the launch the app would be free to use but would be in Alpha and then Beta as we would do real world testing and build on the usability of the app through the actual use of the app. Upon the actual launch of Scend, through the app store, we would focus heavily on promotion through the climbing communities. Introducing the app to users in a natural setting rather than a more forced approach like ads on climbing sites. We want to build a community that would want to put hype on the application and actually use it. So in that fashion we would hope to use climbing society to help leverage the validity of the app.
For Monetizing the application I would need to explore more of what is in the current market and consider the development costs that would also be required. After the free to use alpha and Beta, I would consider starting with a one time payment or possibly a subscription, depending on how well the live tests go.
Looking into the Future State of IOS devices really excites me, as the rumour mill swells in anticipation of Apple Glass. That got me thinking about how my app would work in that space as well. I could have directions displayed as you navigate to your climbing location, a turn by turn feature and on approach of the mountain or rock face you would be able to see routes numbers for the user to correlate and interact with them and the information displayed on your phone within the Scend app.
1. Explore more features and build out the chat screens, authoring more user stories for those and a new task flow for a user to message a friend and send a couple routes. I would like to answer key questions like "What can I all send in the chat?", "How do I add a new community?", "How do I manage my downloads in the app?" and "How does the app change when I have no service?"
2. Consult with a developer and set realistic goals in order to develop such an app.
3. Seek a business partner and connect with a climbing society to see about financially backing the application.
Take a step back
Going through my first project, it definitely felt like a lot, and sometimes felt overwhelming at times. I learned though you need to take a break and step away from the project to get a better sense of it. Which was hard to do as the time constraints and the deliverables were almost every week but looking back I think a lot of my issues and iterations could have been solved just by taking that break and getting some much need rest.
Don't be afraid to redo work
I learned pretty quickly that iteration was a key aspect of UX Design. Reiterating your work work might seem like it's taking a step back but in fact it is the total opposite. Iteration is the job, if something doesn't work then it's your duty to go back and fix it. It is this process to prevent a domino effect. Like how I changed a button thinking it would only be a cosmetic change and it turned out that the testers could no longer understand where to click in order to complete a task.
Trust you colleagues
Getting feedback on my project was always a double edged sword for me, on one side I appreciated the criticism but also felt a sting when I worked so hard on something only for it to be a flop. In hindsight those criticisms made me a better designer and in turn made my design better. Honestly, trusting your colleagues is probably my biggest takeaway. Having those fresh eyes on my project helped me solve lots of little problems that could have been much worse later on there by saving me time and if it was for a real company could have saved them money.