Redesigning IRCTC Ticket Booking Flow

Manvi Bhadauria
6 min readNov 29, 2022

--

Time taken : 2 weeks

The whole process was carried out by me from the scratch.

A few days back when I decided to book tickets for my trip back home, my father suggested to go through irctc’s app since it’s authorized and hence more trustworthy.

So, I downloaded the app. Honestly, the first impression of it made me recheck whether it actually is the Indian government’s authorized app. Turns out, it is genuine and has already received quite a lot of criticism.

Some were quite harsh. Some were actual constructive feedback.

At this point, I decided to talk to people who have already used the app a couple times including family, friends, colleagues and a few people I know on social media.

My Research

Began my research on Google and on Quora which gave me a fair idea on how to take the research forward. I asked a few question (Have you used the app before ? What were the challenges you faced ? Were you finally able to book a ticket ? If not, how did you do it then ?) to which I did not really get specific answers, followed by a change of strategy.

I wanted to get specific parts of the booking flow addressed. So I sat with 3 users and took them through the whole process of booking a train ticket via IRCTC app, they were then able to pin point what issues they face and would like to be addressed.

User research -

I could categorize my users into groups -

  • Students/ Working professionals, age 18–35 usually tech-savvy and quite comfortable with technology
  • Retired/ Mid age professionals, age 35–60+, not super comfortable with tech and takes a little longer time to complete a task.

The user base for IRCTC’s website is huge, as per data available on wikipedia there are 30 million user accounts on IRCTC. And that is after they disable a big chunk regularly.

Started by asking a few questions to 5 people, I tried to base my questions on the points discussed above to see if other users face similar issues -

  1. How do you book your tickets ?
  • Mostly, IRCTC’s app or website.
  • I use other apps to book tickets, find that much better
  • IRCTC, I believe it’s authorized so I go through the same only.
  • I go to the station usually
  1. Do you have trouble logging in ?
  • Yes, the login page is confusing.
  • A little, but I could manage.
  • Always, I get so confused what username is it asking and which password.
  • Keeps logging me out and it’s so frustrating.
  • I can, the pin is a good feature makes it easier.
  • The captcha is so irritating and it’s everywhere.

2) Do you understand what abbreviations like WL/AVL/CC/2A/SL mean ?

  • Yes : 40%
  • No : 60%

3) Do you know which station (in the destination city) exactly you need to go to ?

  • Yes : 60%
  • No : 40%

Pain Points -

  • Difficult login procedure.
  • Too much time to book a ticket.
  • Difficult to understand abbreviations.
  • Switching between screens frequently to google things.

Insights & Observation -

  1. The login procedure is difficult, need to make it easier.
  2. UI looks old school and not clean.
  3. Has to be a little friendly for the younger users, abbreviations are difficult to understand.
  4. The hierarchy of information placed throughout the process needs to be streamlined.
  5. Need to make it easier for the users to make informed and quick decisions, hence decreasing the time required to book a ticket.

User Journey Map

To be able to understand how the entire journey of the flow would look like for the user.

How It Started..

This is when I began sketching, made a few rough sketches. Thought about it. Didn’t like it and made more iterations on the same, looked for inspiration from competitors as well.

Wireframes

Wireframes, to draw an idea of how the screen would look like. A lot of changes were made at this point but came up with a few final screens, which again went into a lot of alterations while being turned to frames.

Wireframes

Style Sheet

When I started making frames, I started using different elements and every time I would make another frame I would go and check the last one I made which is when I realized what exactly a style sheet is and why it is important.

My learning was, it is great to maintain a style sheet from the very beginning and it would be easier to scale.

Comparing Frames

On observing the current screens of the app and the insights from my research side by side, I had an image in my mind of what I wanted the app to look like, which got clearer after the frames started coming to life.

It is so much easier and convenient to use a contact number and password for email than to remember a unique username and password for a particular app. I added social media accounts as well, initially. But then I realized that security is a factor here and the traffic handled by the site is huge, there is a requirement to keep bots and fake accounts away. Google and apple accounts are in most cases attached to a phone number in user’s phones.

The user should be able to skip the login part for now, in case they just want to browse at this point. The original app has an option called “back” which also does not specify it’s function. Changed it to skip and changed the position as well, so it’s clear and visible.

As it has been discussed earlier, the motive was to make it user friendly across ages and so if the user is not sure about abbreviations and quotas and classes in general, there is an option to check the same right there. This would help the user save a lot of time and would make the app much more user friendly.

A few initial iterations to reach the final screen

To find the nearest stations it can be linked to google maps and for the other options, an info box would open on the same screen.

Tried to make sure that the information is easily accessible at every screen, maintaining a clean look throughout.

This was an attempt to make the process simple, easily understood, accessible to most people and freindly.

Thank you so much for your time. Any feedback is always welcome :)

--

--