Indian Railways 🚊
The Indian Railways (IRCTC) website, with 130 million users, is the go-to website for booking train tickets in India.
Focused on enhancing accessibility and efficiency, my redesign aimed to streamline the login and ticket-booking journey by making it simpler and intuitive.
🗓️ Timeline
Aug 15 - Dec 1, 2023
✒️ Tools
Figma, Balsamiq, Maze
👩🏻💻 Role
UX Research, UX Design, Prototyping
DEFINING PROBLEM STATEMENT
While the Indian Railways website stands as the top choice for Indian citizens, it needs significant improvements due to its convoluted and confusing process of booking train tickets, as expressed by many customers.
The platform's outdated and cluttered interface poses challenges in numerous aspects, including poor navigation, an overwhelming amount of information overload, and an unorganized layout. These issues result in a subpar experience for the customers.
WHAT DID I DO? 🙇🏻♀️
Identified the existing issues with the platform by delving into heuristic markup and competitive analysis followed by a thorough exploration of user needs through surveys and interviews, providing valuable insights. Through empathy mapping, I proceeded to the ideation phase which resulted in a brainstorming session, generating solutions that addressed the issues identified previously.
I translated these ideas into sketches and wireframes. The usability tests were then conducted to refine these designs and I measured the success of the redesigned product through key performance indicators.
IDENTIFYING THE ISSUES
I conducted a quick heuristic markup to identify potential challenges users might encounter.
This process revealed a lack of visual hierarchy, a disregard for the law of proximity, and other design guidelines that weren’t followed. Important travel-related information was also missing on various screens, for example - the name of the arrival and departure city wasn’t mentioned, the duration of the journey was unclear, etc.
Additionally, an excessive amount of information is presented simultaneously, creating difficulty for users to comprehend and navigate.
UNDERSTANDING THE MARKET
To gain insights into industry trends, best practices, and prevalent user expectations, I proceeded to analyze criteria such as the clarity of information, intuitiveness of the navigation, searching and filtering options available, visual design, etc., of the top alternative websites preferred by customers for booking train tickets through competitive analysis.
Try logging in and booking train tickets using these websites to understand what improvements are needed to outperform the competition and achieve customer satisfaction.
Goal 🎯
The visual design of the IRCTC website requires improvement to simplify the procedure for booking tickets and eliminate unnecessary steps, as the current website seems intricate.
The competitors provide a simpler and more intuitive process with a cleaner layout, addressing user needs through clear CTAs, legends to explain uncommon terms, FAQs, etc.
View detailed Competitive Analysis 🔗
DISCOVERING USER NEEDS
Participants for the user research were drawn from a diverse pool, representing varying levels of experience with the IRCTC website - from first-time users to frequent users, contributing valuable insights.
User Survey 📊
The user survey, which received 25 responses, focused on understanding customers' first impressions, their previous interactions with IRCTC, satisfaction levels with the website, likelihood to recommend it, and their likes and dislikes.
User Interview 🗣️
The interviews were conducted with 3 participants, and concentrated on customers' goals on the website.
Two tasks were assigned: Log in through the homepage and Book a ticket from station A to B for a specified date. Follow-up questions were posed to understand the challenges faced and gather suggestions for improvements.
View detailed User Research🔗
“How satisfied were you with the ticket booking process on the IRCTC website?”
Concerns Raised 🔎
👉🏻 Too many unnecessary alerts
👉🏻 Numerous unexplained terms
👉🏻 Booking page has too many filters
👉🏻 Redundant information
👉🏻 Outdated design with excessive advertisements
👉🏻 Hidden captchas
👉🏻 Unspecified errors with no cues on what to do next
Interesting Finding 🧐 💭
Despite the numerous concerns raised by the customers, they still preferred IRCTC over other platforms due to its government ownership and familiarity with its functionalities.
To help me distill and organize my research findings, I created an empathy map 👇🏻. Here I categorized the data into what the users hear, say & do, see and think & feel while completing the two tasks given to them.
I also classified their pains and gains (recommendations) below.
IDEATING
Frequent users of the website, especially those who are elderly, are accustomed to the challenging methods of completing tasks.
How to make improvements while also ensuring minimal interference for old users?
The aim was to devise solutions that did not create hurdles for old users while also making the ticket booking process seamless for new users. I tried to make it accessible for all users, whether new or old. I created preliminary user flow sketches and wireframes (on balsamiq), avoiding drastic changes, and simplifying the ticket booking process by first focusing on removing redundant information and unnecessary steps.
INCORPORATING IMPROVEMENTS
Ultimately I worked on two user flows -
👤 Logging In
On the Homepage, I enhanced the website's visual appeal while adhering to the official IRCTC color palette.
Homepage
I placed key functionalities like - Booking Tickets, Checking PNR Status, and Checking Chart/Vacancies as clickable radio buttons at the top for convenience.
The chatbot is now clearly visible without any background disturbance, and alerts are spotlighted below the ticket booking feature.
To build trust among customers, I added testimonials and highlighted the hassle-free experience IRCTC provides.
FAQ section is introduced for quick access to information on topics like - ticket cancellation and refund policies, as per customer demand.
I relocated the navigation bar to the top of the page, categorizing similar sub-menu items for a more intuitive structure. This not only cleared up space but also improved navigation. The login button is added to the top navigation bar for easier access.
The footer was reorganized for better categorization, simplifying information availability.
The overall layout has been improved for enhanced clarity and no clutter.
Holiday Packages are showcased for customer’s easy exploration.
As the user clicks on the login button on the homepage, a pop-up box opens with input fields asking for the username, password, and captcha - clearly displayed, ensuring it is easily noticeable and doesn't get lost.
On the previous website, it was challenging for the user to determine if they had completed certain tasks as there were no feedback messages. Hence,for the redesign, a green confirmation message appears stating successful login.
💺 Booking Tickets
For booking tickets, the user inputs the travel details on the homepage. This redirects them to the booking page, where all available trains are listed as per the user’s search criteria.
Here the user can select the tier they want to opt for and continue to book.
The filter feature underwent restructuring, with all the filtering options at the left, and the sort feature was added at the top right to view trains as per shortest travel time, low price, etc.
The legend was also added in case users are unaware of terms like - 2A, 3A, etc.
The date carousel is now positioned at the top, eliminating the unnecessary repetition present when it was under each listed train on the original website.
As the user selects a train, they will be taken to the Passenger Details page, where they can provide information such as passenger name, age, meal preference, etc. by clicking the ‘Add Passenger’ button that triggers a pop-up box for entering details.
Under contact details, an option was added to input additional email and contact numbers if the user wishes to receive tickets on contacts other than the registered one.
Subsequently, the user will move to the Review Journey Page, where they can review their details, check the train information, view the total fare amount, and proceed to checkout on the final page.
After payment, the ticket will be booked, and a confirmation page will display all the travel details such as passenger information, train details, and fare summary etc.
The important information is also highlighted in red.
The chatbot is now a floating element that is available at all times to assist customers.
CREATING AN IMPACT
Usability tests employed one-on-one sessions including remote testing with 5 participants of diverse age ranges consisting of 4 tasks - Logging in to the website (with given credentials), Selecting a train journey (for a specified date and to & fro stations), Adding passenger details, Booking the tickets through checkout and payment with follow-up questions about filtering and sorting, reviewing journey details, and ticket confirmation, etc.
“ It’s just so much easier to take in all the information and find the train I’m looking for.”
Participant completing one of the tasks
To evaluate the success of the redesign, I used 2 KPIs -
➡️ Time on task
The time taken for the task of booking a ticket on average decreased from 5 mins to 3 mins, approximately a 40% decrease 🙌🏻
➡️ Customer Satisfaction Score
Most users said they were extremely satisfied with the process, and rated 4 or above on a scale of 1 to 5, resulting in a CSAT score of 80% 💪🏻
LEARNINGS AND TAKEAWAYS
Working on this project,
I acquired the skills to develop designs that seamlessly integrate improvements while prioritizing a smooth transition for long-time users who are accustomed to more traditional approaches.
This experience underscored the crucial role of empathy in design. Understanding the customer's perspective became a focal point, as it not only guided the decision-making process but also played a role in designing crucial features. Recognizing and addressing the needs, preferences, and challenges of users, especially those accustomed to older workflows, became a cornerstone.
Not to mention, despite initial apprehension, using Balsamiq and Maze acquainted me with simpler methods for designing wireframes and carrying out usability tests.