top of page

Simplify your travel plans with our user-friendly hotel booking app – a hassle-free solution to quickly find, compare, and book your perfect stay without the complexities of traditional booking websites

GreyBird Hotel Booking

Why settle for ordinary when you can book smarter?

During the tough times of the pandemic, the rental industry took a hit, and travel felt like a distant memory.
😷✈️.

But, with the world reopening and people eager to get away, the question is:
"why should booking a hotel still be so complicated?" 🤔🏨

After years of frustration with clunky, confusing booking sites, I couldn’t help but wonder—why does finding a perfect place to stay have to feel like a maze? 🤯

So, I decided to take matters into my own hands and create something different. A simpler, smoother, and more intuitive way to book your next getaway! 🌍✨

hotelbooking-list
hotelbooking-list

What did I plan to achieve?

What was my role?

What tools I used?

The hotel booking application provides a smooth booking user experience. A full process of understanding what the user's pain points are and steps taken to address them through intentional design is shown via this case study.

As a UX designer, my responsibility is to create an efficient and smooth user experience by conducting research methods to define, analyze, and address the pain points in my design.

Figma, Miro, Proto.io, Zoom.

Affinity Diagram

Actions

After conducting an online survey and reviewing multiple user interviews, the next step is to analyze this collected data.I grouped and organized the information in an affinity diagram. I categorized the data in the following categories: goals, behaviors, emotions, pain points, mental models and context during testing.


I arranged the data in categories that reflect each step a user would usually take during a booking process. Within the categories I incorporated user goals, behaviors, pain points, expectations and errors made during testing.

Findings

There was a handful of trends: imagery, navigation, UI/styling, search, user habits, promos, price, accessibility, map view, conveniency, information, and transparency. The most prominent trend was how information was displayed, while brand integrity/transparency and conveniency came second.


The primary aspect of testing would be focus on displaying critical information about listings, without overwhelming the user.

Customer Journey Map

Customer Joourney Flow

Intentions

The organized data from the affinity diagram is useful to build out a customer journey map. From mapping out all the users' high-level steps when booking a hotel, I withdrew many conclusions, later addressed in my design concepts.

Actions

At each stage of the booking process, I divided the general user experience into different categories: behaviors, context, goals, mental model, pain points, positive reactions, and emotions.

  • I used emojis to indicate which parts of the user journey were mostly positive, neutral, and mostly negative experiences.

  • The final part of this task was drawing the curve, and weighing up the most common type of user experience (positive, neutral, negative).

 

A few opportunities arise from this process to improve experience were:

  • Screens should only offer options that are relevant to the users.

  • Filters should be precise and clear and in order that user mental model follows, else user might get frustrated looking for the field and end up walking away from the site.

  • Prices should be listed as final and avoid any calculations on users' part.

  • Add-ons/Experiences to checkout- gives more control to user to speed up and end the booking process efficiently.

User Flows

After defining the goals and deciding on the features to include, I went on to establish the information architecture of the app by using a User Flow. It helped me visualize the relationship between the content and examine the hierarchy.It is important to note that this user flow shows the ideal path; the number of different actions a user can take is endless. However, for this case study, we decided to focus on the more common flows.

User flow

Wireframes

With the key features and user flow defined , I started to capture my ideas by sketching low-fidelity screens using pen and paper. It enabled me to examine my ideas before moving onto digital wireframes.

Wireframe 1
Wireframe 4
Wireframe 2
Wireframe 3
Wireframe 5

I carried out a Usability Testing Research method for better insights...

I decided to kick off the research phase by looking into existing studies and gather data which would confirm or refute my assumptions. I managed to uncover some interesting findings around user's goals and pain points.

Goals

  • To check prices of hotels and compar ethem with other aggregators for better deals.

  • User needs to see photos of the hotel and room before booking.

  • Has a keen eye our for add-ons/ pleasant experiences.

  • Users aim to look for flexible booking rates with discounts and must-have room amenities.

goals

Pain points

  • Struggled to locate some basic information about the room and hotel.

  • Room prices are confusing and users are required to do some calculations before getting the total figure.

  • The abundance of details required when filling forms is frustrating.

  • Users wants minimal scrolling experience.

frustration

Competitive Benchmarking

CB

Actions

  • Having established some context from the research, I went on to carry out a competitor analysis with 4 different apps: Booking.com, Barcelo.com, The Doyle Collections, and Hotels.com.

  • Further I dicovered patterns and areas for improvement– or to be avoided altogether.

  • I picked hotels.com as they are amongst the most popular hotel booking website in the US.

Findings

Barcelo.com

  • The website offers a good balance between intuitive design and usability. It is visually pleasing and menus are well designed.

  • However, once a hotel is selected and user is on a room listings page, the focus on upselling extras with the abundance of overwhelmings information can be seen.

  • A lot of steps were also required to register the passenger details.It makes the process feels lengthy.

Usability testing

usability

Actions

  • The next step was to carry out user interviews to gain insights on how the participants would interact with the product. Following the interviews, the participants were also asked to participate in usability testing using existing apps.

  • Recruited two volunteers and conducted two usability tests on two different sites with each volunteer, resulting in a total of 4 tests.

  • Throughout the process, I learnt what the user goals and behaviors are while working on these tests.

  • Recorded the sessions and took diligent notes.

Findings

  • Too much information or options on the Home screen would overwhelm the users and distract them from their main goal.

  • Users were confused with the general flow of screens.

  • Users aim to fill as little forms as possible and expect forms to have clear legends in the fields.

  • Users were not able to easily verify desired amenities or filter results.

  • Confirming add-on’s and room details was not intuitive.

Who were my users?

Persona

Outcome

OR

              View Slideshow

Takeaways

Through this case study, I've solved the problem I’ve experienced personally and through user research and testing, i.e simplicity.

With this app, you don't need to spend hours searching for hotels online or calling different places to check availability. You can quickly browse through a wide range of hotels, view photos of rooms and facilities, read reviews from other travelers, and see real-time prices and availability.

Once you've found the ideal hotel, booking is just a few taps away! No more frustrations around multiple navigations, clicks to achieve the final goal.

bottom of page