Case Study: Citymapper
Integrating a payment feature into Citymapper
The app
Citymapper is a London based app that works as an alternative to other more famous options such as Google Maps or Apple Maps. The main features are a very clear UI and the ability to choose more options such as Scooters, Bikes, and others. Also, very useful utilities like subway maps or timetables are easier to find and navigate.
Interviews
I’ve interviewed 5 people to determine the main pain points they’re experiencing when using public transportation in their cities of residence and also abroad.
The most common ways of buying tickets are:
- Card Pass
- Ticket Machine
- Online
- Daily Tickets
Out of these interviews, I concluded that the main pain points are:
- Ticket machines are hard to understand.
- The transportation system can be confusing.
- Sometimes there is no information on where to buy tickets.
People manage to understand the system using:
- Apps
- Google Maps
- Subway Map
- Internet Search
- Signaling
Problem to Solve
The main problem is how to effectively integrate a payment method inside the app that will work in different cities, where the payment methods and technologies can drastically vary from one to another.
After this premise, I started searching for the most common methods and technologies that cities implement which are:
- Magnetic Card Validation on Turnstile (ex: London)
- Paper or QR Ticket Validation on Personnel Inspection (ex: Berlin)
Solution
After my research on the payment methods and technologies, I concluded that there are 2 main methods to validate a ticket which can be solved also in 2 different ways:
Citymapper Magnetic Card to Use on the Turnstile Readers:
To be ordered on the application and sent to the user’s address. The card would be paid on a monthly basis. The card will not only work with Subway, Buses, and Trams but also with E-Scooters, Rental Bikes, and others depending on the city.
Citymapper Card on Phone
The new technologies available on smartphones will allow people to instantly purchase a virtual Citymapper card that can be used directly on the phone and be read by the turnstile reader.
QR Generated Code to Validate with Personnel:
The application will generate a QR code based on the actual location of the user to determine the starting point.
Prototype
After iterating different ideas I came up with this solution which includes an additional button in the “Timetables Page” that leads directly into the “Tickets Page”. In the “Tickets Page,” the user can easily buy the correct ticket needed for the current trip or review more options.
What I’ve learned
The main things I can take from this project are:
- Understanding more in-depth the process of coming up with a solution based on research and data gathering.
- The importance of interviews and the problems that you may have (Some interviewed don’t give enough information while others will answer all your questions on the first one)
- How sketching and prototyping can help you visualize your design and it’s usability.
- A lot about public transportation in different cities.
