IRCTC App Redesign: a UI/UX Case Study
This was a hackathon project where we had to identify the UX flaws in the app and redesign user experience for the app.
My Journey
Recently, I was planning a trip to Jaipur and wanted to go by train for a different travel experience. So I went through different apps like ixigo, make my trip etc., in search of a good deal but couldn’t find any. That’s when my father told me to use IRCTC’s mobile application to book the tickets as it was an authorized app for reserving tickets and they have reasonable prices as well.
I downloaded the app from the play store and after opening it, I was surprised to see the login screen which had left me clueless as to how I should log in or even book tickets.
Some of the things that I felt were out of place:
- It took me around 5 mins to get into the home screen.
- The amount of information on the page was overwhelming at an initial glance.
- The captcha was big trouble.
- The login button was in a very odd place, and as a result, I was not able to locate it for a short while.
After a long 10 minute struggle, I was finally in the app’s main dashboard. Now looking at the dashboard I was feeling really disappointed, as I had high expectations from the app.
Few things, that I felt, that didn’t add up on this page were:
- There were no clear indications as to where should I click to reserve my ticket.
- I was confused about the role Disha played(was it a chatbot/customer service or something else entirely?
- The layout was very much out of place and distorted.
Even though there was no clear indication as to where to start from, “Plan my Journey” did its best to tell me that I needed to initiate from there. As I clicked, I was bombarded with tons of information I did not know about and it left me befuddled.
In the end, I had to consult my dad for help.
Some other screens I had a problem with, whether it was navigating through them or them having a disoriented layout, were:
Realization
Now after going through the app, I thought to myself that even though the design team that developed the app did not do their part well, me being a design student could help people- by solving the problems that they faced while using the app and also simultaneously make the app’s design soft on the eyes of its users.
Before I went ahead with deciding to make subtle changes to the layout and designs of the application, it struck my mind to check some reviews and gather what other problems were faced by the users. I did so by skimming through review boxes and conducting small scale surveys. Here’s what I found:
So the initial step was to look at the user reviews from the app store
Also, I floated a google form with some open-ended questions to know what views people might have about the app and also to know if people do actually use the application?
In the end, I decided to interview my family members and relatives to give me feedback.
So I analysed the information that I had gathered and noticed that I had gotten a wide variety of opinions from people of all age groups. Which helped me decide that my survey was a successful one.
Conclusion
After doing this thorough research, I realised that my experience was no different from what the other people went through, as they faced similar issues and inconveniences.
So to list some of the weak points of the application, that I got from the surveys, were:
- Login page
- After reading the reviews from the users, I realized that the login screen was a bit difficult to navigate through and was time-consuming.
2. Seat availability — not shown (requires multiple clicks)
- People were not able to see the seat availability due to poor indications and visual hierarchy.
3. Payment issues
- People did not feel safe while making the payment.
4. A lot of advertisements made the users frustrated.
🟢Solution
Now coming up with a solution was a big task as it required multiple iterations and I didn’t want to change the current design system of the application.
So to start off I made wireframes to have a better picture as to how I could improve the user experience.
To begin with, I decided to redesign the login page, the homepage, the train schedule page and the payment page.
And after making the wireframes, there were few changes that I made to the main designs.
📱Login Page
To make the user log in without hassle and any difficulty, I had introduced one-tap login that happens through your phone number from OTP.
🏠The Homepage
Now to make the navigation easier for the user I have made the ‘book tickets’ section on the top. I also realized that almost 83% of people use the app to just book train tickets, so it was necessary to keep it on the homepage.
- I have the promotions sections as I don’t want them to miss out on the revenue generation as it is necessary to provide us with better services.
- I have also introduced Travel points to encourage people to travel more in trains. These points can be used to get discounts on the train ticket.
🚊Train Schedule Page
Now the user knows how many seats are left on the train so they can book accordingly.
- There were some issues with the visual hierarchy, which have been solved.
- Also, the smart filter has been introduced, which can easily be toggled by the user.
- Since travel has been trouble due to different norms in different states, now there’s an option to have a look at them beforehand.
💸Payment Page
The payment page feels more secure and has much more options to pay from. Now, you can also view the ticket summary.
- I have introduced a QR code here, for verification on the train, which helps to make the process contact-less.
Reflections
I feel so glad to be able to help people through difficulties that they face in day to day activities. Where once booking train tickets was an hour-long chore with a lot of anxieties involved, I have now made an appealing app that takes less than 10 minutes to book a ticket and confirm payments. This has been an enlightening and eye-opening experience, I look forward to being able to help out more with other applications as well. 😇
