Problem Identified

Problem 1

• Visual Clatter - leads to cognitive overload, increasing the likelihood of abandoning the booking process

Problem 2

• High information density on the page - users can feel overwhelmed making it harder to quickly extract the most relevant details. This could lead to user frustration, and an increased drop-off rate

  
  

Final Design

Listing Screen

The goal of the new design was to address the visual clutter present in the current version, which can hamper users' ability to focus on key information at first glance.

In the old design, excessive use of colours across the screen can be overwhelming to the users, causing them to miss important details that are essential for a smooth booking process.

The revised design prioritises a cleaner information architecture and hierarchy, enabling users to quickly capture the necessary details to proceed through the booking steps. The approach here was to reduces cognitive load and enhance clarity, allowing users to make informed decisions with ease.

Card Anatomy

Level 1 prioritises the most fundamental information, such as the train name, number, and route. This ensures users immediately recognise the train they are booking, and it helps them make quick decisions based on familiarity

Level 2 is divided into two sections and designed in a table format allowing users to get a quick glance at all the information.
The first section displays key travel details, including the departure and arrival timings, station names, and the total travel duration.
The second section focuses on ticket-related information, showcasing the availability of different classes, ticket prices, and any waiting list status with corresponding chances.

Level 3 offers additional information, special services provided (e.g., travel guarantees, food), and the train's user ratings.
This level also includes a prominent call-to-action (CTA) button for booking the ticket, making the experience complete and actionable

Booking Interaction

In the current design, the information card expands when a user selects a specific travel class option, revealing additional details for that class. While informative, this expanded view lacks prioritisation, forcing users to sift through all the data.

This can slow down the decision-making process and increase cognitive load, making the booking experience more cumbersome

New Interaction

Level 1 offers users the ability to view the 4-month calendar, providing a broader perspective on train availability and waiting list trends over an extended period.

This feature helps users with flexible travel plans to identify better booking opportunities or higher chances of ticket confirmation across different dates

Level 2 retains the key informations and allows users to toggle between travel class options.

This design helps users compare availability, pricing, and waiting list status across various classes, enabling them to make informed decisions without overwhelming them with excessive details upfront.

Level 3 provides users with more detailed options by displaying different quotas such as General, Senior Citizen, and Ladies. It presents the waiting list (WL) status alongside the likelihood of confirmation, allowing users to make more informed choices for each travel date.

This additional layer of detail gives users a clear understanding of their chances for booking success and helps them to decide which category is best for them, improving the decision-making process