Ironhack Challenge 1 • Design Thinking • Citymapper

Citymapper is a well-known free travel app that provides users with route options when they move in a specific city. It was founded in 2011 by a former-Google employee Azmat Yusuf for Londoners at first, with the idea of making their travels easier in the city. From point A to B, the app provides several choices of real time itineraries according to the available channels: by bus, underground, bikes, kick scooters… and even by foot.

In 10 years, the app has developed a network of more than 80 cities across the world. Many features have also been added to smooth and optimise the user’s journey such as detailing where to get on the train in order to be at the right exit when getting off the train or choosing a specific time of travel so that the app calculates routes with the right train schedule. During the pandemic, Citymapper has even added on its main page the option of finding the closest laboratories where to do Covid-19 test.

Main issues that flow from interviews

Even though Citymapper continuously improves with the goal of making users’ journey easier, we still can point out some problems that users encountered and more especially when travelling abroad. This is the first challenge that I had to overcome as a new UX/UI student at Ironhack Paris. After having interviewed 5 users, here are the main problems that were highlighted:

• Cost information is not straight and clear

“When we travel abroad it is complicated to understand how it works straight away. It’s complicated to be like a local person, it is actually impossible. Once, I didn’t buy a ticket in Berlin because I just didn’t know where to stamp it.” Jihane A.

“In Tokyo, it took me a bit of time to understand how and how much I had to pay for my bus ticket. There is a price below each station and it increases along the way. I get in at stop A and get off at stop E. When I reach stop E, I pay the cost displayed below stop A. Can you still follow me? I never saw that before, the system is just completely different!” Alexandre V.

• Cost of the tickets is not optimised

“In Berlin, the map is divided into strict zones. I get frustrated when I need to pay more just because my stop is right after the previous zone”. Valentin B.

“Last time I visited New York City for 3 days, I didn’t want to be bothered with paying tickets everytime I took public transport. So I charged a pass of $50. In the end I paid too much because I didn’t use it that much.” Jihane A.

“In London, you pay the ticket according to the distance, I always feel that it is not optimised when I take several channels and that I can be misled by the counterpeson. The less contact I have abroad the better it is.” Adèle S.

• Paying by cash is an issue

“It is quite annoying when you take the bus and the driver has no change. You need to meet an understanding driver.” Valentin B.

“In London, I remember that a tourist had not enough change to pay his bus ticket, he only missed 20 pences and the driver kicked him off. I didn’t have change and no one helped him either.” Jihane A.

• Information is not centralised in one app

“When I travel abroad I always download the local app. In Berlin, I downloaded a local app but I found out that it only took one channel into account. I had to download another one for another channel. That was not practical at all.” Alexandre S.

“I like to use Citymapper when I’m abroad because I’m used to it, I feel more secure but it is not available everywhere.” Jihane A.

What is the main problem?

One main problem remains when it comes to purchase the tickets. When you’re abroad, it is definitely not easy to quickly understand how and how much you need to pay for a trip according to the different types of transportation.

The goal in this case is to create a new feature in Citymapper in order to solve this issue and make users’ travel life easier. With the hypothesis that users already have all their data and payment details in the app. Also, potential issues and limitations are not taken into account.

How to solve the problem

In order to solve this issue, I analysed how the app Citymapper worked step by step as a user. Would a user use the app just to buy a ticket? It occurred to me that a purchasing feature would need to be integrated in the middle of the user’s process since buying tickets is not the core functionality of the app. Buying a ticket in the app would be an additional feature that would ease users’ journey.

Therefore, I identified a precise moment when the user would need to buy tickets: the stage when the user chooses its route according to the suggested ones. At that moment, the user needs to confirm that he wants to “GO” for this route. It is right before this step that the new feature would be inserted. A new button would be integrated below the displayed price of the itinerary: “BUY E-TICKET NOW”. When clicking on this new button, the user will see a new page with the summary of the route with the detailed price per ticket by channel, and the total price to pay. He will just have to click on “CONFIRM THE PAYMENT” and the tickets will be purchased. A QR code will be generated for this specific route. Taking into account the fact that there is the possibility to scan the QR code at each stage of the route.

In this solution, the user won’t need to queue at the vending machine, to check the prices on his own or to ask for information at any counter desk. All these annoying steps disappear.

Only one QR code will be needed during the whole itinerary. Below are the detailed steps on paper prototypes. All the buttons where the user clicks have been highlighted in yellow to follow the process.

A process helps to structure your thoughts

Following a strict process did help a lot to structure my thoughts and build the solution of this challenge. At first, when I discovered the case, I directly started to think about potential solutions in my mind without any previous insights. That was obviously not the right way to pursue and I followed the design thinking process step by step.

The first part of empathizing opened doors to understand the user’s thoughts. It made me realize how hearing about very concrete and various experiences was gold. It is the raw material that lets you move forward and build the solution.

Blank paper leaves room for creativity

The ideation process was not that smooth. I tried hard to find as many ideas as possible. It is actually not that simple to let go of all our boundaries. Sketching and writing down my ideas on a paper sheet helped to remove the structure that brings a Word document. On a blank paper, you are limitless and it leaves room for more creativity. Even though I found that many of my ideas were sometimes quite similar to each other, I finally found out a solution that appeared to be the most obvious and easiest to integrate in the user’s journey.

Thank you for reading :) !