“Arriving on Time: Enhancing the IRCTC App with an Alarm Feature”

Getting Started:

As an architecture student in my 4th year, I became interested in UI/UX design due to its dynamic and user-centered approach in the design field. While scrolling through Instagram, I came across an ad for Growth School’s UI/UX course, which stood out to me for its non-traditional approach. I applied for the course and also signed up for the 14-day UX Kickstarter Design Program.

Through the workshop, I gained a deeper understanding of UI/UX design principles such as design thinking, heuristic evaluation, user-centric design, and Fitt’s Law. The workshop transformed my thinking process, and I am grateful for the opportunity to have attended.

Now, as I embark on my first case study, I’m excited to apply my newfound knowledge of UI/UX design.

Final Redesigned Screen:

Here is a comparison of the original screen and the redesign. I will be talking about how I got to the solution in the later part of the article.

Fig 1.1 original screen

Fig 1.2 redesigned screen

Fig 1.3 other screens

Issues users were facing:

Some problems users face due to the absence of an alarm feature in the IRCTC app are:

1. Missing their intended destination due to oversleeping or not being aware of their stop.
2. Relying on third-party apps for setting alarms, which may be unreliable or require additional effort to use.
3. Inconvenience caused by constantly checking the train’s progress and calculating the estimated arrival time manually.
4. Increased stress and anxiety due to the uncertainty of whether they will arrive at their destination on time.
5. Limited ability to multitask or rest during the journey, as they need to remain alert to avoid missing their stop.

Changes Made:

The changes made in the new redesigned feature include adding a new “Alarm” button on the main screen, allowing users to set alarms for their destinations. The app also shows the user’s current location and upcoming stops, along with the estimated arrival time at each stop. Users can set an alarm for any stop on their journey, and the app will notify them when they are approaching their destination. Additionally, the app provides a snooze option to allow users to delay the alarm if necessary.

How it helps the user:

The new alarm feature added to the IRCTC app helps the user in several ways. First, it ensures that users do not miss their intended station or stop, as they will be reminded by the app with an alarm 10 minutes before reaching their destination. This increases the overall user experience, reduces stress and anxiety, and provides a sense of security to the user. The feature also saves the user’s time and effort, as they no longer need to rely on third-party apps for setting alarms or constantly checking the train’s progress. The user can focus on other tasks during their journey and rest assured that they will be notified before reaching their destination. Overall, this feature enhances the usability and convenience of the IRCTC app for the user.

How it benefits the business:

The addition of an alarm feature in the IRCTC app benefits the business by improving customer satisfaction and loyalty, leading to increased conversions and revenue.

Why IRCTC ?

As an architecture student who frequently travels by train, I missed my station despite setting an alarm on a third-party app. This led me to advocate for an in-app alarm feature on the IRCTC app, which would enhance the user experience and ensure on-time arrivals. During a workshop, I used the “Learning from Existing Design” workbook to observe existing designs and find a familiar usability solution. Through user interviews, I discovered that UI issues cause users to switch to other booking apps, negatively impacting conversion metrics and ultimately the business. This underscores the importance of design in maintaining conversion rates and business success.

Evaluation of the app screens and problems identified

During the workshop, I worked on the “User Centric Design” workbook, where I learned various concepts of user-centered design. I identified that the issue was “flexibility and efficiency” with the help of the “User Centric Design” workbook. There are various concepts of user-centered design, and one of them is “flexibility and efficiency." Users always want flexibility and efficiency while using any product or app. I found out that the app lacks efficiency because of the way it is built.

Identifying areas of improvement in existing design

I started to list down common sense questions and common sense answers on the alarm feature of the IRCTC app and tried connecting it with the heuristic.

Fig 2: Problems identified

Heuristic principles are a set of rules of thumb that are based on common user behavior. They help to measure the usability of user interfaces.

Here are some of the questions and the answers I came up with:

Heuristic Principle : User Control and Freedom Visibility of System Status Flexibility and Efficiency of Use

Heuristic Problems Found:

• No choice for commuters to wake up just before the train arrives at their stop.
• Users cannot directly monitor the position of their trains using IRCTC app. There are no push alerts to notify consumers when they arrive at their destination.
• Absence of options for users to set a recurring alarm for the same station every day at the same time.

Possible Questions and Answers for the Alarm Feature:

Q: What options will the alarm feature offer to users?

A: The alarm feature will allow users to customize their alarm settings according to their preferred time before the train arrives at their station. They will also receive an in-app notification and real-time tracking information to ensure that they do not miss their stop.

Q: How will the feature improve flexibility and efficiency of use?

A: The feature will automatically activate itself once the alarm is set, eliminating the need for users to constantly check the app or their device. Additionally, the simple and intuitive UI will make it easy for all users to set the alarm and customize their settings.

Q: Will users have the freedom to set a recurring alarm for the same station every day at the same time?

A: Yes, the feature will offer users the option to set a recurring alarm for the same station every day at the same time, providing greater control and convenience to the users.

Brainstorming for Ideas to Solve the Problems I Identified

From the problems defined in the evaluation stage, I came up with a few ideas, which are listed in the image (Fig. 3: Ideas).

Idea 1: Allowing users to set as many alarms as they want can be helpful for those who have multiple stops or transfer trains. Users can easily manage and keep track of their journey with this feature. It is important to design a clean and user-friendly interface to avoid clutter and confusion.

Idea 2: Allowing users to set recurring alarms for multiple trains or the same train on a daily or monthly basis is very useful for frequent commuters. This feature saves time and effort as users don’t have to set alarms for each journey separately. It is important to give users the option to easily edit or delete recurring alarms.

Idea 3: Adding a time bar under the alarm button card to show how much time is remaining until the destination is reached is a helpful visual aid. This feature can help users stay aware of how much time they have left before reaching their destination. It is important to design the time bar in a way that is easily readable and understandable.

Idea 4: A circular bar with the time remaining until the destination arrives is another useful visual aid that can be used to give users a better idea of how much time they have left before reaching their destination. The circular design can also add an aesthetic touch to the app. It is important to ensure that the design is not distracting or difficult to read.

Idea 5: A calendar icon to set an alarm for a specific date can be helpful for users who have a planned journey ahead of time. Users can easily select the date and set an alarm for their journey in advance. It is important to design the calendar icon in a way that is easy to access and intuitive.

Idea 6: Normal 3-dot setting icons can be used to manage settings for users. This feature can give users more control and allow them to customize the app according to their preferences. It is important to design the settings in a way that is easy to navigate and understand.

Idea 7: Adding a label option to put details about the train or alarm name can be helpful for users who have multiple alarms set or who want to keep track of their journeys more efficiently. This feature can help users easily distinguish between different alarms and keep track of their journeys. It is important to ensure that the label option is easy to access and understand.

Idea 8: Adding a snooze button and stop button for every 5, 10, and 15 minutes, with phone vibration and an alarm ringtone, can be helpful for users who may need a little extra time to wake up or may want to stop the alarm altogether. It is important to ensure that the snooze and stop buttons are easily accessible and not confusing.

Idea 9: Push notifications on the phone screen to notify users about their arrival can be very useful, especially for those who may have turned off the app or are not actively using it. This feature can help ensure that users don’t miss their stops and can help them plan their journey more efficiently. It is important to ensure that users can easily opt-in or opt-out of push notifications.

Idea 10: A new page that covers the entire mobile screen with snooze and stop buttons that won’t close until the user turns off the alarm can be helpful for users who may have trouble waking up in the morning or who may be easily distracted. This feature can help ensure that users are awake and alert before reaching their destination. It is important to design the page in a way that is not overwhelming or confusing for users.

I decided to move forward with idea 1, 4, 5, 7, 9 and 10 for the later stage of designing.

Turning my Idea Into a Prototype (Low-Fidelity)

Fig 4 Low fidelity wireframes

I was filled with excitement as I sketched out my idea on paper and began to transform it into a feature. I created multiple screens that corresponded to my idea and outlined the functions of the various features on each screen.

Fig 5: Low-Fidelity Prototype

t was even more exhilarating to create a prototype using the Marvel app. I applied my knowledge from the “Low-Fidelity Prototype” Workbook to generate a link and interconnect the screens.

It was surreal to witness my app come to life and seamlessly navigate between the screens. The prototype allowed me to easily switch and return to the previous screens.

Making High-Fidelity wireframes and prototype

I used my learning from Anudeep about UI elements, how to replicate screens, and the “High-fidelity prototyping” workbook to create navigation from one screen to another and to use smart animation to make animation in an easy manner.

Fig 6: High-Fidelity Screens

Then to make my designs look like real app designs i designed following screens

1. Home Screen: This is the main screen of the IRCTC app, where the user can select their train journey and enter destination station and train details.
2. Alarm Feature Setting Screen: This screen allows the user to turn on/off the alarm feature and customize the alarm sound and vibration option.
3. Alarm Notification Screen: This screen displays the notification when the ETA is within a certain time frame of reaching the destination station. It includes the customizable alarm sound and vibration option and snooze/dismiss buttons.
4. Reminder Notification Screen: This screen displays the reminder notification when the user snoozes the alarm or dismisses the first notification. It includes the snooze/dismiss buttons.
5. Turn Off Alarm Feature Screen: This screen allows the user to turn off the alarm feature entirely.

Fig 5: Hi-Fi Prototype

Validating Solutions through Usability Testing

Now that I have completed my designs as per the problem identified during the heuristic evaluation. I will be testing the design with the users to make sure it works and improving what does not.

I was traveling by local train in Mumbai. A person was sitting beside me, and I asked him if he uses IRCTC, to which he said yes. I asked him to do me a favor by giving feedback on my case study that I have worked on.

Tasks for the user:

1. Set up an alarm for a specific time and station.
2. Verify that the alarm goes off at the scheduled time and station with the desired sound and vibration.
3. Test the snooze and stop button functionality.
4. Set up a recurring alarm for a specific station and time.
5. Verify that the recurring alarm goes off at the scheduled time and station on the specified days.
6. Test the push notification feature by turning off the app and ensuring that the notification is still received when the train is approaching the destination station.
7. Use the time bar under the alarm button to monitor the time remaining until arrival at the destination station.
8. Test the circular bar with time remaining mentioned until destination arrives.
9. Use the calendar icon to set an alarm for a specific date.
10. Create labels for different alarms and verify that the labels are displayed correctly.

Observations while the user is performing tasks

1. The snooze and stop button functionality is clearly labeled.
2. The circular bar with time remaining may be a helpful visual aid for users, but it may be difficult to interpret if the design is not clear or the information is not displayed prominently.
3. The calendar icon may be a helpful feature for users to set alarms for specific dates, but it may be confusing if the options are not clearly labeled or if the process is not intuitive.
4. Labels for different alarms may be useful for users to keep track of their alarms, but it may be difficult to manage if the design is not clear or if the options are not easily accessible.

Feedback from user

1. User really appreciated the ability to set multiple alarms for different stations and times, as well as the option to set recurring alarms. The calendar icon was also helpful for setting alarms for specific dates.
2. User found the circular bar with the time remaining until arrival to be confusing, as it was not clear how to read it or what the different colors meant.
3. User encountered problems with the snooze and stop button functionality. Sometimes users accidentally hit the wrong button, and it was not clear which button to press to stop or snooze the alarm.

Improving Screens After Usability Testing

During the usability testing, I observed that users had difficulty understanding the purpose of the circular bar. Therefore, I added a clear indication that explains the usage of the bar. Additionally, I included an extra screen for the alarm snooze feature to prevent accidental hits on the wrong button.

Fig 7: Changes After Usability Testing

Key Learnings

Throughout the 2-week Kickstarter workshop, I gained a lot of valuable insights that helped me complete this challenge within a short timeframe.

Learning from Existing Design

Anudeep encouraged us to appreciate and understand how existing designs have been created from the user’s perspective. Through various activities, we learned about heuristics and fundamental UX principles and applied these principles in a practical way for this challenge.

Learning about UI elements:

During the workshop, Anudeep taught us about screen sizes, common elements in app screens, and principles of spacing. This knowledge helped me create screens for this challenge.

Learning in Usability testing

To ensure my designs worked as intended, I conducted usability testing with real users. I learned that tasks should not bias users and that they should be able to understand them on their own. Anudeep demonstrated how to conduct testing and observe user behavior.

How the workshop changed me:

The workshop had a significant impact on me. I realized that following a process should make sense, not the other way around. Whenever I was stuck, the workshop community and Anudeep were there to help me unblock my thoughts and clarify concepts. I gained confidence in UX concepts and learned about collaboration, time management, prioritization, and decision-making based on UX considerations.