PRODUCT DESIGN

Redesigning the IRCTC app:

Improving usability, utility and profits

Redesigning the IRCTC app: Improving usability, utility and profits

My Role

Scoping + Conceptualising

UX/UI Design

Information Architecture

Prototyping

Timeline

August 2023

People

Context

Context

The IRCTC app was launched in 2014 to promote digital ticketing. Ever since the launch, Indian Railways has grown in its functions and scale. Around 63% of all online tickets are booked through the app at the moment. That amounts to roughly 800k tickets daily! Unfortunately the app has struggled to grow alongside.

The IRCTC app was launched in 2014 to promote digital ticketing. Ever since the launch, Indian Railways has grown in its functions and scale. Around 63% of all online tickets are booked through the app at the moment. That amounts to roughly 800k tickets daily! Unfortunately the app has struggled to grow alongside.

The Challenge

The Challenge

The current app is unreliable and comes crumbling down under traffic. Newer services offered by IRCTC have failed to generate substantial business. The interface has also become noisier with disparate features competing for user attention.

Basic usability is a bother.

The current app is unreliable and comes crumbling down under traffic. Newer services offered by IRCTC have failed to generate substantial business. The interface has also become noisier with disparate features competing for user attention.

Basic usability is a bother.

Objective

The initial premise was simple—to make the app usable, useful and delightful. Since it is a personal project, I worked on it alone—from researching to designing the final screens.

The initial premise was simple—to make the app usable, useful and delightful. Since it is a personal project, I worked on it alone—from researching to designing the final screens.

Usability Testing

Usability Testing

I ran a quick usability test with 6 participants to test the app’s core functionality — booking and managing a train ticket.

The test plan was simple, based on three questions.

  • Can users figure out what is intended on the screen?

  • Are they interacting with the interface the way it is intended?

  • Do they understand what is happening?

I ran a quick usability test with 6 participants to test the app’s core functionality — booking and managing a train ticket.

The test plan was simple, based on three questions.

  • Can users figure out what is intended on the screen?

  • Are they interacting with the interface the way it is intended?

  • Do they understand what is happening?

Usability Problems

Usability Problems

Usability issues were pretty evident. Most participants struggled with all three parameters.

Usability issues were pretty evident. Most participants struggled with all three parameters.

One. It was difficult to find what is intended on the screen since the information was too dense to consume at a glance.

Two. It was inconvenient to interact with the interface in the intended way. Users often bypassed steps by clicking the red CTA at the bottom, before being reminded to complete a ton of actions first.

Three. It was puzzling for most users to figure out what was happening. Most interactions felt unexpected and unreliable.

Peripheral Insights

Peripheral Insights

Little asking around also revealed some peripheral insights:

  • Younger users prefer using third-party apps for booking tickets, citing frequent crashing and poor usability as the main reasons.

  • Only a few people are aware that IRCTC offers other services in addition to ticketing and food-ordering.

  • Older participants who use the IRCTC app, have memorised the ticket booking flow. Some can’t even cancel those tickets!

Design Opportunities

Design Opportunities

I could see three major design opportunities at this point.

I could see three major design opportunities at this point.

Fix usability issues

Make the app easy and intuitive to use

Make the app easy and intuitive to use

Integrated design

Design for the complete journey instead of ticketing alone

Design for the complete journey instead of ticketing alone

Inclusivity

Design for everyone, especially the users new to technology and the ways of Indian Railways

Design for everyone, especially the users new to technology and the ways of Indian Railways

Secondary Research

Secondary Research

I skimmed through (a lot of) opinion posts, app store and play store reviews and benchmarked the current app against third-party apps.

I skimmed through (a lot of) opinion posts, app store and play store reviews and benchmarked the current app against third-party apps.

Problems

Problems

The most evident problem in the current experience is the sheer lack of coherence, which shows up in multiple places.

The most evident problem in the current experience is the sheer lack of coherence, which shows up in multiple places.

Disconnected experience

Services offered by IRCTC operate independently. For example, ordering food onboard is separate from managing a booking and requires navigating to different screens and filling your details again.

It impacts the discoverability and utilisation rate of these services and any cross-selling opportunities are missed.

Services offered by IRCTC operate independently. For example, ordering food onboard is separate from managing a booking and requires navigating to different screens and filling your details again.

It impacts the discoverability and utilisation rate of these services and any cross-selling opportunities are missed.

Scattered functionality

Scattered functionality

Features like ‘counter ticket cancellation’ and ‘ filing ticket deposit receipt’ which fulfil a rare use case occupy screen real estate all the time. It is crucial to centralise these features to reduce visual noise and enable users to focus on things that matter to them and the business.

Features like ‘counter ticket cancellation’ and ‘ filing ticket deposit receipt’ which fulfil a rare use case occupy screen real estate all the time. It is crucial to centralise these features to reduce visual noise and enable users to focus on things that matter to them and the business.

Poor post–booking experience

Poor post–booking experience

The current experience mimics a digital railway counter. Post-booking experience on the app is non-existent. No updates are communicated to the user about their bookings. Only extreme cases, like cancellations, trigger SMS notifications.

This information void increases uncertainty, pushing users toward unreliable information sources and unnecessarily burdening customer support and inquiry centres.

The current experience mimics a digital railway counter. Post-booking experience on the app is non-existent. No updates are communicated to the user about their bookings. Only extreme cases, like cancellations, trigger SMS notifications.

This information void increases uncertainty, pushing users toward unreliable information sources and unnecessarily burdening customer support and inquiry centres.

How Might We?

How Might We?

With the help of these insights, I came up with the following HMWs:

With the help of these insights, I came up with the following HMWs:

How might we simplify the core user flows in the app?

How might we simplify the core user flows in the app?

How might we centralise the user experience and design it to be more coherent with business goals?

How might we centralise the user experience and design it to be more coherent with business goals?

How might we design for a better first-time user experience?

How might we design for a better first-time user experience?

How might we improve the post-booking experience?

How might we improve the post-booking experience?

Solutions

Solutions

Centralising the whole experience

Centralising the whole experience

I decided to centre the whole experience around user bookings, which would serve as a warehouse for all tickets and transactions, and a discovery centre for other features.

I decided to centre the whole experience around user bookings, which would serve as a warehouse for all tickets and transactions, and a discovery centre for other features.

Segmented control to switch between different views

It is crucial to inform the user about all upcoming bookings and any immediate journeys they have to undertake, succinctly. Another objective was to get rid of all irrelevant data points to show plenty of entries on the viewport at a time. Auxiliary information should be presented on subsequent interactions.

Card information architecture iterations

Since it’s a lot of data points in a cramped space, many trade-offs regarding what information to display and prioritise were made.

Searching and adding bookings

Searching and adding bookings

The existing app was designed to only handle tickets booked on the device. My objective was to have a single source of truth for all bookings.

The existing app was designed to only handle tickets booked on the device. My objective was to have a single source of truth for all bookings.

User flow for adding external bookings

Users can verify a booking through an OTP

When user adds a new booking, their control is restricted — passenger information and destructive actions are hidden. They can track the live status of the train and receive all journey updates though.

Adding a booking experience

Leveraging the digital interface

Leveraging the digital interface

IRCTC data reveals that about 80% of all reserved tickets are booked online. It only makes sense to send real-time updates through the interface.

IRCTC data reveals that about 80% of all reserved tickets are booked online. It only makes sense to send real-time updates through the interface.

Journey details screen

Instead of just showing static booking data, the screen should focus on the whole journey — with real-time information alongside.

Updates centre and live running status

The updates centre at the top doubles down as a button to view the live running status of the train in detail.

Journey details screen

Since the interface is information-heavy and would serve as a starting point for multiple flows, it demands logical hierarchy and clear interaction gateways.

Journey details screen

The philosophy of designing for the whole journey also offers ancillary benefits like supporting inexperienced passengers and showcasing situational offers.

Interface at various stages of the journey

The interface also needs to convey a sense of urgency at critical junctures. This can be paired with notification alerts to help the user transition smoothly between various phases of their journey.

Cancellation module at different times after booking

The cancellation module is another component that changes form with time, ensuring that the user is fully aware of cancellation charges at all times after booking.

Close-up of the cancellation module

Contextual adverts on the journey details screen

Based on where the user is travelling, contextual promotional content can be shown to intrigue the user to increase inbound leads.

Searching for trains

Searching for trains

I started out with a quick and dirty heuristic evaluation of the existing flow, mostly based on the NN/G usability heuristics.

I started out with a quick and dirty heuristic evaluation of the existing flow, mostly based on the NN/G usability heuristics.

Booking screen — before and after

In order to find the right trains, only a handful of inputs are needed from the user. I designed the flow around these inputs, optimising for speed and efficiency.

Searching for trains — user flow

I designed slight conveniences to accelerate searching for trains and make the flow more efficient by alerting the user beforehand. I think that such a flow would be technically challenging to implement, but for the sake of this case study I have assumed its technical feasibility.

Searching for trains experience

Booking a train ticket

Booking a train ticket

I started out with a quick and dirty heuristic evaluation of the existing flow, mostly based on the NN/G usability heuristics.

I started out with a quick and dirty heuristic evaluation of the existing flow, mostly based on the NN/G usability heuristics.

Viewing trains

Once the users land on the search results, the information hierarchy has to make sense for them to make an informed decision. It took a lot of iterations to land on this design.

Coach class and date selection

The focus shifted from finding the right train to finding the right date.

Reviewing journey and paying

I designed a little delightful animation at the end to congratulate the user on booking the ticket. The completion screen would take the user to My Journeys where they can manage their booking.

Booking experience

In Retrospection

In Retrospection

This project expanded far beyond my initial high-level goal, evolving into a comprehensive app redesign, which is a huge effort. While it's a step towards a more user-friendly and useful design, there's room for improvement.

The flows can be further refined, functionality expanded, and interactions polished. Small nuances can easily be overlooked when undertaking such a lofty project and I am sure I have had cut some corners there. Often, I had to rely on intuition where data would have been invaluable.

I also haven’t designed specifically for a first-time user experience even though that is very essential. Assuming technical feasibility throughout the project helped — but working with technical constraints is something I look forward to.

This project expanded far beyond my initial high-level goal, evolving into a comprehensive app redesign, which is a huge effort. While it's a step towards a more user-friendly and useful design, there's room for improvement.

The flows can be further refined, functionality expanded, and interactions polished. Small nuances can easily be overlooked when undertaking such a lofty project and I am sure I have had cut some corners there. Often, I had to rely on intuition where data would have been invaluable.

I also haven’t designed specifically for a first-time user experience even though that is very essential. Assuming technical feasibility throughout the project helped — but working with technical constraints is something I look forward to.

Say hello!

Got an idea? Want to collaborate? Or just chat? Hit me up!

Say hello!

Got an idea? Want to collaborate? Or just chat? Hit me up!

Say hello!

Got an idea? Want to collaborate? Or just chat? Hit me up!