UX Design
A booking website for accommodations close to the Norwegian nature.
Nina Vabog
Overview
For this project, I was asked to design a booking website for a new company offering booking of accommodations.
The booking website Stauga was created to let users easily book accomondations close to Norwegian nature, either being hotels or cabins.
The concept was initiated based on the growing interest for traveling in our own country, letting users get a smooth and unproblematic start on their journey.
Role
UX designer
Timeline
6 months
Insights
Industry research and user interviews
Several booking companies say they have a great amount of visitors on their website, but the number of bookings does not match the activity.
A common problem for companies like this is that users stop their booking process before completing it, and losing their potential customers to their competitors.
Why is that, and what makes users complete the booking in one booking website instead of the other?
As a part of the user research, I asked fifteen participants to complete an online survey, an easy method to gather both qualitative and quantitive data.
Asking the participants questions about their earlier experiences when booking hotels on already existing websites, this method was used to give an understanding of what works well, as well as uncovering the pain points.
Define
Common pain points with hotel booking companies today
Lack of information
Due to the lack of information or the difficulty of finding it, users look for other options where they can easily find the information they are looking for. This happens when the website does not fit their mental models
Comparison
Users do research about several options to compare prices, locations and facilities before booking the oneaccomondation that fits their needs.
Some users say they use several days to do research before completing the booking.
Design & layout
Most users say they prefer a clean homepage, reducing information and ads.
Each page should guide the user on where to interact, and not be overwhelming with too many attention seeking elements at once
Solution
The goal for Stauga is to get most users to complete their bookings once started by making the booking process easy to go through, with all information easily accessible.
To solve the issues users experience when booking accommodations for this new website, I focused on the following main design goals:
Providing clear information and feedback
Giving users the feeling of safety
Minimizing the number of needed interactions
Making it clear how and where to interact
Usability testing
After getting an insight in the participants earlier experiences, I asked three of them to complete a usability test for three different booking websites to see how they would complete a booking for a weekend away.
Observing the participants go through the booking process, I had the opportunity to get an insight on their pain points, mental models, behaviors, positive interactions, goals and suggestions for the different stages.
These insights were written down and put together in an affinity map.
Customer Journey Map
As I organized the notes from the usability tests, I noticed that there was several experiences the users had in common when going through the booking process.
The findings from the online surveys and usability tests were then put together in a customer journey map, describing the overall experience and flow a user has on the these websites.
Ideate
Ideating solutions to solve pain points and generating process flow
Interaction Design
After creating a user flow, I sketched out each screen and interaction to experiment with the layout and elements before making the wireframes in Figma.
As the search bar is one of the first interactions for the user, I wanted to create a solution where interactions were kept to the minimum.
A combination of CTA´s and dropdowns makes it easy to choose their wanted option without unnecessary interactions.
Prototype
Wireframes
Based on the findings gathered using different research methods, Stauga is created to be a booking website that is easy to navigate, clear on it's feedback, and give a feeling of security.
As a common issue with booking websites is the finding all the needed information for the user feel secure and prepared for their accommodation, I decided to use a combination of a primary and secondary navigation bar.
This combination is used to let the user have access to all information at all times, no matter which step of the booking process they are on.
Filters and dropdowns are also included to let users easily find accommodations based on their wishes, giving them information about which options that fulfills their needs.
The feeling of security is created by giving the user important information early on, such as payment and cancellation policy, reviews, location, and included facilities..
The issue of unnecessary interactions and time spending during the booking process was a common problem that I did not want to pass on to this new company.
The user can therefore do necessary changes in their booking information easily throughout the process in the horizontal navigation bar.
A long process with too many steps can make the user choose to end it, even when they are close to the final step.
Including a progress bar will give information to the user about where they are in the process, and how many steps they have left.
In addition to the progress bar, I have included some small encouragement messages to let the user know how they are doing.
Reflect & grow