Flights Booking Engine Case Study

UX / UI Design ~ Desktop Multisite App

Tools & Skills Used

  • User Experience Design
  • User Interface Design
  • User Personas
  • CSS / SCSS
  • Bootstrap
  • Angular
  • Introduction

    The primary objective of creating this application was to add a new product offering to the company’s existing products and services for the airline industry. The main selling proposition to the existing client base was the ability to use their points to purchase airline tickets and benefit from a reduced price.

    My approach in achieving this goal was to leverage mental models which users are accustomed to when purchasing airline tickets. I went with a clean modern look that focused on highlighting elements which are important in the decision-making process while screening back the elements which are less important but still useful in adding value and credibility to the design.

  • Search Experience

    There were some limitations when it came to the data that was provided by the API which the team and I had to solve for in the user experience. One of these limitations lead to the grouping of flight classes by airline.  To minimize obstacles in the user experience, I minimized the amount of information presented to the user, but allow the additional information upon request on each flight listing. Additionally, I’ve used distinctive and clear call to action on each point in the user journey.

  • Review Experience

    On the review page, we present an overview of the selected departure and return flights, with the flexibility to upgrade or downgrade the selections. To encourage users to upgrade their class, we display the price difference and additional benefits.

    On the review page, we presented the user with both departure and return flights they’ve selected on the previous search page, with the flexibility to change their class. We wanted to encourage the user to upgrade their class, so we displayed the price difference to upgrade and some of the benefits in doing so.

  • Checkout Experience

    In removing as much burden off the user, we worked towards minimizing the amount of information that was required to complete the booking process. In doing so, one of the features was to allow the user to pay with an existing card on file and also select from an existing billing address on file.

    As far as the points the user could apply to their flight purchase, I’ve decided to integrate the design of it with the total booking price. A checkbox allows the user to enable or disable the points option. Upon enabling, the minimum amount of points will be applied to the total balance.

  • User Personas

    For projects that are heavy on features, I like to create user personas to identify the different user types that are going to be using the application. Along with the user personas, I like to create user stories to go along with the personas, describing what type of features they expect to access within the application.