Acodyna_Purple_Icon

Athemisa

User-Centric Hotel Booking: A UX Design Concept

Maximizing User Satisfaction Through User-First Design

The Problem:

A small luxury hotel chain needs a new desktop booking experience on its website to increase conversion rates. This new interface must be simple, straightforward, and tailored to their target clients: wealthy adult travellers staying for leisure, whether for city breaks or seaside holidays, depending on the location.

The Solution:

Through market and user research, including competitive benchmarking, user interviews, and usability testing, we’ll ensure the platform effectively caters to the specific needs of wealthy travellers. By focusing on user-cantered design and streamlining the booking process, we aim to enhance and simplify their booking experience.

My Role:

As a UX designer with experience in the online tourism industry, I have led competitive benchmarking and user research efforts. By analyzing data and leveraging my industry knowledge to inform design decisions, I ensured that the platform met the needs of the target audience.

The Process

My approach followed five stages: empathize, define, ideate, prototype, and test. However, as is often the case with digital design projects, the process didn’t not involve was not linear, and iterations would be necessary to reach a final product.

Competitive Benchmarking:

I analyzed the websites of three hotels and one travel aggregator, focusing on the booking process’s ease, accessibility from the home page, date and price search, and presentation of room and booking details. I discovered difficulties in finding booking sections, pricing transparency issues (e.g., VAT inclusion), and unclear results pages (e.g., meal types and stay inclusions).

This analysis provided valuable insights into industry standards and user limitations. While I identified effective patterns and confusing elements, these findings are influenced by my personal preferences.

To gain a deeper understanding of user needs, my next step is to conduct an online survey.

Snippet of Competitive Benchmarking Document
Visualization of one of the answers using a pie chart

Online Survey:

Building on my firsthand experience with accommodation booking, I aimed to understand customer goals and potential obstacles. I created a Google Forms survey and distributed it via social media, using both structured and unstructured questions to gather quantitative and qualitative data.

The results were positive: most respondents achieved their goals on the website and rated their experience as satisfactory. Some indicated no changes were needed, and a few couldn’t pinpoint specific dislikes.

Unfortunately, the number of participants was low. To have a more impactful outcome from this task, we would have required a larger number of participants.

Usability Testing Sessions and Depth Interviews:

I sought to understand how people use hotel websites and their booking behaviours.

Through depth interviews and usability testing with five individuals, I gathered insights on goals, behaviours, and context.

Each participant completed the same tasks, generating data on positive interactions and pain points.

Next, I’ll organize my notes into an affinity diagram for analysis.

In-person usability testing session

Affinity Diagram:

This project enabled me to analyze vast amounts of data and pinpoint key findings.

In a review session with my assistant, we identified key areas for redesigning the hotel website:

  • Improving the home page layout, enhancing site navigation, addressing search difficulties, integrating maps and calendar displays, and providing comprehensive information on amenities and facilities.
  • Users also expressed confusion over rate and meal type selection.
  • Other notable observations included slow site speed and challenges in finding hotel contact details and seasonal opening times.

Customer Journey Map:

I outlined high-level steps in the customer journey and evaluated each step’s experience as positive, negative, or neutral based on the findings from the affinity diagram. I discovered several pain points during the process:

  • Accommodation search: confusion in destination selection, absence of a map, lack of dates on the calendar, and unclear search steps.
  • Transitioning from the search to hotel locations also posed challenges, as there were no filters for specific criteria like beach hotels and the absence of a noticeable map.
  • On the room results page, users preferred a table layout to minimize scrolling and desired ample room images and a clear list of amenities.
  • During usability testing, users expressed frustrations such as “I hate scrolling,” “Insufficient images make me suspicious,” and “List amenities when selecting a room for easier comparison.”
  • Selecting meal options proved difficult due to unclear inclusions and difficulty finding the intended meal type.
Customer journey map

Flow Diagram:

Using the flow diagram, I intended to address the concerns identified in both the affinity diagram and the customer journey map. I mapped out the user journey from the homepage to the payment screen, addressing common issues along the way.

  • Home Page:

Users can search by destination name, location, and hotel theme. An autofill suggestion feature would make this process quicker. Additionally, users can filter search results by location and theme.

  • Search Results Page:

Available properties are listed with key details such as the main image, map, location info, and facilities.

  • Property Page:

This page includes essential information users often overlook, like images, descriptions, map, location, facilities, live weather report, rooms with prices, etc.

  • Room Page:

Displays the main image, room facilities, inclusions, available meal types, etc.

  • Extras/Add-ons Page:

This step is skippable, as user feedback indicates that many users prefer to reserve a room before selecting any extras.

  • Payment Page:

This page ensures clarity with a constantly visible price breakdown and a straightforward form for entering payment and passenger details.

Snippet of flow diagram

Prototyping:

I developed a prototype in Figma, with sufficient detail and interactivity to test the high-level flow, screen layouts, text, and basic interactions.

Prototype created in Figma

Annotation for desktop:

I aimed to create a set of annotations for my desktop app that contain all the necessary detail a developer would need to build it.

Snippet from the handover file with annotations

Conclusion

Although this project remained a concept and did not materialize into an actual product, the insights gleaned from the research remain valuable. The online survey would have required more participants for conclusive results. Ideally, another round of usability testing would have been conducted before the annotations phase, but time constraints made this impractical.