IRCTC Re-Design
Streamlining the IRCTC Experience: Navigation & Visual Redesign
Role: UX/UI Designer
Year: 2024
Tools Used: Figma, Miro
Responsibility: User research, Persona Development, Information Architecture, Wireframing, Prototyping(low-fidelity and high-fidelity), Visual Design, Usability Testing.
Quick Links
Background
Why I Choose this as my case Study?
The IRCTC website is a vital tool for train travel in India, handling a massive volume of bookings daily. But the thing is, the website can be a real head-scratcher, especially for first-timers. There's just so much information cluttered on the screen, and it's hard to find what you need. Plus, the design feels a little stuck in the past. That's why I decided to take on a redesign project.
This is how the current IRCTC website is looking and these are the shortcomings.
Problem
The IRCTC website is virtually indispensable for train travel in India, making it a high-traffic platform but the website suffers from a range of UX/UI issues that hinder the user experience. The interface is cluttered and overwhelming, with excessive information and unclear visual hierarchy. Navigation is complex and inconsistent, making it difficult to find essential features and complete booking tasks. The website also feels visually outdated, with inconsistent design and a lack of emphasis on crucial elements. These problems contribute to user frustration, potential revenue loss, and a negative brand image for IRCTC, along with limited accessibility for some users.
Goals
The goal of this redesign is to transform the IRCTC website into a user-centered platform. It aims to simplify the interface, eliminating clutter and establishing a clear visual hierarchy for ease of navigation and a website that provides a smooth and enjoyable booking experience for all users, driving increased satisfaction
The Design Process that I followed here
Research
Empathetic Design Approach
“When you start with empathy, you move from designing for users to designing with users.”
User-centered design starts with understanding users' feelings deeply and compassionately. By empathizing with their experiences and needs, we uncover valuable insights that inform our design decisions. Asking thoughtful questions not only helps us discover new user problems but also paves the way for innovative solutions to enhance the overall user experience.
I started to ask questions:
who are the users I am targeting,
which features will be useful for them,
what are their goals and
what are the users needs, pain points and desires
Methodology
I conducted non-direct user interview and survey with the target customers to understand their pain points and desires . Through this I gained valuable insights that served as the foundation for my design decisions.
Who Are The Users I Am Targeting?
First-Time & Infrequent Users
People who don't travel by train often are the potential growth segment. A welcoming and intuitive website can lower the barrier for them, encouraging them to choose IRCTC for their occasional travel needs.
Senior Citizens
Designing for senior citizens demonstrates social responsibility and commitment to reaching a wider audience and as the design often involves larger fonts and simplified navigation it will benefit users of all ages.
Frequent Travelers
Frequent travelers are likely the most active customer segment. Improving their experience has a direct impact on customer satisfaction.
User Survey
I conducted a survey that included a diverse range of participants from frequent travelers, who travel monthly and who rarely travel in train and book through IRCTC website. There was a diverse age group as well including senior citizens. Below are the response tracked through the Survey.
Pain Points And Challenges
Define
“To design meaningful solutions, we must first define what matters most.”
User Persona
Based on user research, I've developed a user persona named Shravan. Shravan embodies the characteristics and goals of a typical user group I identified. Personas like Shravan helped me understand the needs and challenges of the target audience, allowing me to design a website that truly meets their expectations.
User Story
User stories keep the emphasis on who you're designing for and the problem you're solving, not just on technical details. User stories can also serve as a “checklist” to make sure we’re addressing and solving the key problems the users might face when engaging with the product.
User Journey Map
The primary goal is to identify the pain points, challenges, and opportunities throughout his train ticket booking experience. The ultimate aim is to guide the design of a seamless and convenient online platform, ensuring that Shravan’s journey is streamlined, efficient, and aligned with his preferences and values.
Problem Statement
Site Map
I designed a sitemap to create a clear blueprint of the IRCTC website's structure and content hierarchy. This serves as a navigational roadmap, ensuring that users can easily find the information they need. A well-organized sitemap promotes a seamless user experience by making it easy to access information.
User Flow
I designed a user flow to visualize the step-by-step journey a user takes to book the train ticket through IRCTC website. This helped me identify potential roadblocks in the experience before the website was built. By mapping the flow, I was able to streamline processes, ensure important information was easy to find, and create an easy path for users to successfully accomplish their goals.
Low-Fidelity Wireframes
Digital Wireframes
Paper Wireframes are an essential part of the early stage of designing, it allowed me to sketch some layout structures. It helped me to focus on the structure and its content. Also designing paper wireframes ensures that the layouts and navigations are well planned before deciding about the visual aspects.
Mobile Version
Testing And Improvements
After the wireframes were created, I decided to do some first round of testing through indirect interviews through FaceTime (screen sharing) in which users were asked to perform a some tasks like booking a train ticket, create account, save passenger details to an account, checking train schedules and track the train on the day of travel. By watching users use the product I found that there is still a lot of improvements needed where the users can benefit from. There were also some suggestions from the users about some functionality they would like to see that might improve the quality of the website.
Feedback:
Since users may not be familiar with station names, especially if there are multiple stops in a region, a dropdown menu suggesting stations would streamline the booking process.
Improvement:
Offer a dropdown menu with nearby station suggestions. This helps even if the users are unfamiliar or new to the departure or arrival .
Feedback:
There is no provision to trigger notification to the email or phone number for a waiting list ticket. Also add alerts for pricing for the desired routes.
Improvement:
Added a toggle button to enable email/phone number notification.
Feedback:
Display the saved preference (routes, passenger details) as suggestion.
Improvement:
Saved Preference are displayed as suggestion at the time of route search and filling passenger details.
Taking all into account, I made some changes to the wireframes and I wanted to do a second round of testing.
When doing the first iterative testing, almost 65% of the users were able to complete the desired task without confusion. After making some changes, about 90% of the users were able to complete the tasks. Also got a feedback that the website was very appealing, in terms of the looks, readability, simple structure and navigation.
UI Kit
Prototype
“A prototype is a conversation starter. It's a way to get your ideas out of your head and into the hands of users.”
