Alpine Club of Canada HutLine Booking App Concept
This project was developed as a requirement for a continuing education class from the University of Calgary. We were introduced to the foundations of User Experience design and required to take an existing UX problem from a website of our choosing and create a product solution. As a student project, real-world data about the Alpine Club of Canada wasn’t available. That said, the class did have an actual member of the Alpine Club who was a frequent user of the booking system who was VERY interested in seeing how the project came together.
The Problem
The Alpine Club of Canada has an antiquated booking system that relies heavily on human resources to receive, process and confirm hut reservations with no user transparency for hut availability. Additionally, hut information is presented haphazardly with redundant information frequently in the descriptions. I wanted to create an experience that would present important information clearly while streamlining the booking process and freeing up critical human resources for other tasks.
The Solution
Over five weeks I participated in a design sprint based on design thinking methodology through five stages: empathize, define, ideate, prototype, and test. At the end of the project, I had a functioning high-fidelity prototype that demonstrated how a user could find an available hut, book it and receive a confirmation very quickly.
My Role
Due to the nature of the class, I was responsible for executing the research, design and testing under the guidance of the class instructor. To that end, I conducted initial user research and defined a key persona, defined a possible solution, sketched an initial wireframe, developed an initial design prototype and then evaluated and iterated on the proposed solution through usability testing.
About the Alpine Club of Canada
Founded in 1908, the Alpine Club of Canada (ACC) has 25 local sections across Canada, operating 37 huts, hostels and section huts. The organization is passionate about climbing, hiking and skiing in alpine environments. Everyone is welcome.
Vision, Mission & Values
The ACC is an organization that brings together Canada’s mountaineering community while being a hub of information and experience. They value not only the mountain environment itself, but respect that environment and the people that recreate in it, recognizing that personal fulfillment has a foundation in responsibility and mindfulness.
The Hut Booking User Scenario
The User wants to book a hut for a multi-night stay with three friends in the backcountry through the ACC. They’re not sure what huts are available or where they are, but they’re ready to take their backcountry experience to the next level and safely explore more of the backcountry from a “home base.”
Due to the nature of the class, additional scenarios weren't included for development. While not expressly stated in this scenario, a user scenario that was kept in mind was the returning/frequent user and their experience of the app. Future scenarios for consideration might include using the app as a knowledge hub for the hut system, allowing a new user to sign up as a full member, and potentially as a communication network for reporting issues at huts, facilities and the local areas.
Understanding the User's Journey and Emotional Pain Points
Initial user testing of the scenario was conducted with three users. Users were asked to track their actions and the emotional reactions they had at each point to reach the goal. Happiness was measured on a scale from -4 to 4 (-4 indicating extreme frustration, 4 meaning very happy). These results were collected and the results were averaged to present a Journey Map that provided enlightening feedback.
Defining a User Persona
Recent User Experience trends have sought to reduce the importance of the demographic information in creating User Persona’s. The focus is more on the user problem, the user goal and what the user needs from the experience and the brand.
Keeping to the ACC’s ethos that Everyone is Welcome, and with the knowledge that people of colour are generally underrepresented in outdoor communications, the persona that was developed seeks to represent a broader view of the outdoor user.
The User Flow, Current vs. Proposed
Recent User Experience trends have sought to reduce the importance of the demographic information in creating User Persona’s. The focus is more on the user problem, the user goal and what the user needs from the experience and the brand.
Keeping to the ACC’s ethos that Everyone is Welcome, and with the knowledge that people of colour are generally underrepresented in outdoor communications, the persona that was developed seeks to represent a broader view of the outdoor user.
Knowing and Using What'sAlready There
While it was outside the scope of the project to create an artefact that captured existing ACC content, I did regularly refer to the content from the existing website. The existing content is high quality and does a good job of presenting the user with good information, the problem was in how it was presented and some of the redundancy in the existing system.
As can be seen in the Proposed User Flow above, I also referenced existing design patterns from other travel sites and companies that users would be familiar with.
Design Sketches
With a good user flow in mind, I set to sketching out an initial set of wireframes. Keeping in mind my persona’s desire for an intuitive experience and the business need to reduce the person hours needed to check, confirm and communicate reservations, I sought to simplify a lot of the screens a user would see to reach their goal. These are a few of those sketches.
High Fidelity Design, V1
Working from these initial sketches, I worked up initial screen designs. As a class requirement, I needed to have a top menu and Search Bar. The high fidelity design was built in Adobe XD, a program I was happy to use given my familiarity with the Adobe ecosystem.
Usability Testing for Version 1, Macro Changes from Testing
Several users were invited to test the version 1 design through Adobe XD’s built-in testing system. Users left comments on specific issues they encountered and commented on what they felt was working well. Below are some of the main issues that were found and the changes that resulted.
Final Prototype
With the user feedback digested and iterated on, I completed the final prototype. Though the functionality is very rigidly dictated by the constraints of the course, I built in as much interactive functionality as time allowed. Below are samples of my design. Please feel free to explore the prototype at your leisure (the prototype is best accessed on a desktop).
Takeaways
Success Metrics
While not possible to learn any real world data from this design, I would have sought to measure the amount of time it took to confirm and finalize a reservation on the back end and compare it against the existing system. I would also want to conduct user surveys on the updated system, as well as measuring click through rates into the booking system from the hut information pages to start getting an idea as to how successful the design was at meeting the organization’s business goals.
Room for Growth
While the scope of the project was deliberately limited to a single scenario and goal, it’s clear that there is a much greater range of scenarios and users that could be served by this product. More time and a broader scope would create a more complete product.
Data > Assumptions
Working solely off of assumptions for this project is a real-world demonstration of the need for accurate and reliable data and user information. Having gone through the process, I appreciate the collaborative work that is critical in launching successful products.
Appendix: The Design System and Components
Having created style cards using Photoshop for websites in the past, it was a small step to create a broader library for this project. The ability to do this in XD, Figma, etc. is an incredible time saver.
