Framework

A structured approach for the integration of flights into the existing hotel booking flow.

In this page

Seamless Integration

Dec 30th, 2024

Progressive Disclosure

Ensuring a seamless integration of the flight booking process into the existing hotel booking flow will necessitate the use of the progressive disclosure UI pattern.

  • What: Presents only the most necessary or frequently accessed information upfront while minimizing less critical details or advanced features.
  • Why: Allows users to focus on selecting their room(s) first, with the departing flight becoming visible only when relevant.
  • How: Once a user confirms their stay (hotel) selection, they will be able to choose a departing flight and subsequently a returning flight.

Simplified Selection

Dec 30th, 2024

Room Card

The buttons on the Room cards need to reflect the integrated nature of the flow. By replacing "Book Now" and "Save to Quote" with a single "Select" button, the user is provided with a clear and unified action that simplifies the process.

Select Button

The single "Select" button eliminates ambiguity by providing one clear action for the user to take when choosing a room. This sets the expectation that additional steps, such as adding a flight, will follow.


Price Transparency

Dec 30th, 2024

Package Rate Display

Convey the importance of showing the package rate throughout the booking process by implementing a persistent "package summary" and "differential pricing" that remains visible throughout the booking process.

Differential Pricing

Show the cost difference between options relative to a base price or the lowest available price.

  • The $0 option represents the base price or the lowest‐priced option available.
  • The "+$28" and "+$133" indicate the additional cost above the base price for other room or flight options.

Clarity of Information

Jan 6th, 2025

Flight Details

Clear and concise presentation of key information will allow the travel advisor to find the best flight based on their needs; all while ensuring the information is readily accessible and easy to understand at a glance. The most important aspects are:

Relevant Information

Display all necessary details like flight timing, departure and arrival airport codes, duration, and airlines. The price should be the most visible element on a flight listing to allow users to quickly compare options.

Comprehensive Details

Display the departure and arrival times for each leg of the journey, including intermediate stops, with corresponding airport codes. For multi-stop flights, include the layover duration clearly beneath the relevant segment. Additionally, show the flight number and aircraft type for each segment.


Support Flexibility

Jan 10th, 2025

Review your Package

By providing users a clear and comprehensive view of their selections will ensure they understand what they have chosen before proceeding. This builds trust and minimizes the risk of errors by allowing users to confirm the accuracy of:

  • The room they selected
  • The departing flight
  • The returning flight

The "Review your Package" page will support flexibility by ensuring users feel in control of their booking and can make changes conveniently if their preferences evolve during the process.