Travel companion for
Delhi metro
/an introduction
How it
started
This redesign began as a task assignment during an interview with a leading company. I poured extensive research, creativity, and dedication into crafting an intuitive and accessible UI and UX for the Delhi Metro app. After the interview, I realized the value of this effort shouldn’t end there. What if the Delhi Metro or another organization could adapt some of these ideas to truly benefit the millions who rely on this service every day?
This case study captures that journey.
Every day, millions of commuters in Delhi rely on the metro for their daily travel. The current Delhi Metro app, while functional, falls short in addressing key user needs. Complex navigation, lack of ticket-sharing options, slow performance, and limited accessibility features have made the experience frustrating for many. Inspired by a desire to transform this essential tool into a seamless travel companion,
I embarked on a journey to redesign the Delhi Metro app.
This case study captures the process, challenges, and insights gathered during the redesign. It is a story of turning user frustrations into opportunities for innovation and empathy-driven design.
Design creates culture. Culture shapes values. Values determine the future.
- Robert L. Peters
/the problem
The metro
commuter’s maze
Delhi’s metro system is a lifeline for millions, but navigating its digital counterpart—the official app—often feels like a challenge in itself. Commuters report struggles with cumbersome navigation, limited ticketing options, and underwhelming accessibility features. The stakes are high: every delay or inconvenience affects not just one commuter but the interconnected flow of the entire metro network.
A study by LocalCircles found that 75% of Indian metro users face delays due to app or ticketing issues. In Delhi, 40% of commuters report challenges with digital tools, highlighting the disconnect between user needs and app design.
The existing app presents several challenges
Complex Interface Navigation
Users struggle to locate essential features quickly.
Inability to Share Tickets
Group travelers face coordination hassles due to lack of sharable ticketing options.
Performance Issues
Slow responsiveness during off-peak times frustrates users.
Limited Accessibility
The app fails to cater to users with disabilities or diverse linguistic needs.
Safety Concern
Emergency assistance features are underdeveloped, especially for vulnerable groups.
My research highlighted stark realities:
These insights set the stage for redesigning the Delhi Metro app, aiming to transform frustrations into solutions for a safer, smarter, and more inclusive commuting experience.
Read more here :)
/the Design
Designing for
a change
Empathy is the cornerstone of this redesign. The app should not only meet functional needs but also resonate emotionally with its users. By leveraging cognitive principles like the "Aesthetic-Usability Effect" and "Feedback Loop," the design aims to build trust, engagement, and inclusivity.
What I am aiming for
User-Centric Solutions
Prioritize user needs and gather feedback for continuous improvement.
Comprehensive Travel Information
Provide tools for trip planning, real-time information on crowding, alternate route suggestions, and easy access to metro stations.
Engagement and Information
Keep users informed with relevant news and notifications. Enable easy reporting of issues and provide quick responses in emergencies.
Accessibility and Convenience
Ensure accessibility for all users. Use clear navigation (e.g., color-coded lines), provide solutions for reaching the metro, and integrate with parking options.
Optimization for Diverse Demographics
Cater to different user needs. Offer gamified walking features, real-time metro arrival times for pedestrians, and bus schedules.
Efficient Utilization of Resources
Leverage the app's features to serve a large population effectively. Consider the metro's extensive coverage and diverse user needs.
Continuous Improvement and Adaptations
Gather user feedback, analyze usage patterns, and adapt the app to evolving user needs and preferences.
Homescreen
Through our research, we discovered that the majority of our users are daily commuters who are well-acquainted with the routes and fares. Their primary pain point lies in the ticket collection process. To address this issue, I have developed a QR code generator linked to a virtual smart card. Users can recharge this smart card when their balance is low. When a user scans the QR code at a gate, a minimum amount is reserved, and the fare is deducted upon reaching their destination
Incorporating a prominent balance screen ensures users experience a comfortable ride, reassuring them of having sufficient balance for their journey. Route planning and fare calculations have been strategically positioned just below the balance card, recognizing that the majority of users are already familiar with the routes, eliminating the need for daily planning.
Auto-detecting the user's location enables us to display nearby metro stations and available services, facilitating seamless planning. Additionally, showcasing nearby attractions, news, and articles enhances user engagement during their metro ride, enriching their experience.
After scanning the QR ticket, the home screen will feature a 'Get Help' option, providing immediate assistance in case of emergencies during the metro ride.
QR-Ticket
After pinpointing a common frustration where users encounter difficulty obtaining tickets solely from the counter, which remains the sole accessible option for non-smart card holders, I'm addressing this concern by integrating QR scanning capabilities directly at the gate
Users have the convenience to recharge their virtual smart card directly, eliminating the necessity of creating a virtual wallet and navigating through RBI guidelines.
Upon automatically detecting the user's station based on GPS, a new card interface will assist users in locating gates and accessing other services effortlessly. Additionally, it will aid in fare calculation and provide train timings for enhanced convenience.
Introducing a Sharable Ticket feature where users can generate temporary tickets to share with friends and family. This eliminates the need for them to download the app or obtain tickets from the counter. These one-time use tickets function similarly to QR tickets for seamless access.
QR ticket: Through the app's QR Code feature, users can generate a code for gate scanning, eliminating the need to obtain a ticket from the counter. Upon scanning, the app automatically reserves the required amount. Upon reaching the destination, another scan deducts the amount from the account seamlessly
Getting to Station
Based on our research findings, it's evident that a significant portion of users walk to the station daily(66%). To enhance this user journey, I'm introducing gamification elements aimed at making the walking experience more engaging and rewarding
Accessing route options becomes essential when navigating a new town or unfamiliar metro station. Users can conveniently input their destination and receive available transportation options for seamless travel planning
Providing optimal options here offers users an overview of various transportation modes, along with associated costs and timings for informed decision-making.
Enhancing user experience through gamification encourages maximum engagement when users choose to walk to stations
Journey and Destination
I designed a tone checker that will always check the tone of the text and gives a hint about how the other person feels about it. This will helps to make a smooth conversations and convey message clearly and apps to understand how each person react and texts.
Introducing an 'Always On Journey Snippet' for effortless access to users' ongoing journeys
In order to encourage users to choose the metro over their personal vehicles, I aimed to instill a sense of belonging by highlighting their contribution to carbon reduction. Additionally, users have the opportunity to provide feedback and file complaints for a more holistic experience.
My journey showcase provides users with real-time updates on their current location and the remaining distance to their destination. Additionally, it includes information on cost and various transportation options for a comprehensive travel experience.
Red diamonds from playing cards
A grid of small face down triangles imitating
cluster of grapes
Horizontal wavy lines, symbolizing water waves.
Line angled at 70
Dashed pattern with repeating rectangles, symbolizing concrete structures.
Vertical zig-zag lines, mimics sun ray.
Repeating circles, inspired by oranges.
Diagonal lines with leaf icons, representing greenery.
Star-like shapes, symbolizing star and flower, reflecting the vibrancy of nature
Wave ripples, representing aquatic life.
Red Line
Violet Line
Blue Line
Pink Line
Grey Line
Yellow Line
Orange Line
Green Line
Magenta Line
Aqua Line
Bringing colors for life
I designed patterns inspired by real-life objects that intuitively associate with the metro line colors. For instance, the Red Line features diamond patterns evoking playing cards, while the Blue Line mimics waves for water. These thoughtfully crafted patterns ensure that colorblind individuals can easily identify lines, blending color associations with universal symbols for seamless navigation.
Redesigning the Delhi Metro app was more than just a design exercise; it was an exploration of how empathy and psychology can transform a functional tool into a delightful companion. By addressing user pain points and prioritizing inclusivity, the case study now serves as an exploration of how to connect the people of Delhi to a safer, smarter, and more accessible metro experience.
Thank You!
Thats it on Quail.
Here is my next case study.
Designing an onboarding to reduce drop rate.
Read more
