CITTYMAPPER CASE STUDY: A DESIGN THINKING CHALLENGE

EMPATHIZE · DEFINE · IDEATE · PROTOTYPE

During my Ironhack’s UX/UI design boot camp my first challenge was to answer this problem:

“Although the current product of Citymapper already solves some of the main problems of the urban mobility, there is one pain point for many users: the different amount of public transport tickets the users have to purchase.

Public transport tickets come in paper or plastic cards. Very often buying different public transport tickets is necessary to go from point A to B. And the process of buying these tickets can be very annoying (queues, vending machines that don’t work, etc.).

Finally, things like pricing or purchasing the correct ticket can become a real pain when you are abroad.”

Easy, isn’t it?

As you may already know, Citymapper allows you to calculate routes and estimate the costs of trips using the different modes of transport in a city.

My task here was to create a feature for this app that solves the pain of having to purchase different public transport tickets by different channels.

In order to answer this challenge I had a user-centered approach also known as “Design Thinking methodology” requiring five steps:

1. Empathize: understand who you’re designing for.
2. Define: synthesize these findings and define a problem statement.
3. Ideate: generate a lot of ideas to solve the problem.
4. Prototype: build a prototype that people can interact with and critique.
5. Test: put the concept solution(s) in front of people to see what works and what doesn’t to use feedbacks and refine it.

Note that this last step (test) won’t be answered in this challenge.

EMPATHIZE

To learn about the audience for whom I was designing - who is my user? what matters to this person? - I used observation and interviews.

As the app is available in 41 cities worldwide, I tried to find people from different cities and/or that traveled abroad, who use or have used public transportation to move around a city.

Questions such as “How is your experience - abroad or in your hometown -concerning public transportation ?”, “Do you feel confident in the purchase process ? Why ? How do you proceed exactly?” or “What was your best / worst experience abroad concerning buying tickets ? Why ?” allowed me to understand better my users’ pain points and what they seak for as improvements in the buying process.

During my interviews, the main findings were:

• People use different apps (Citymapper, GoogleMaps, local public transportation app such as RATP in Paris…) to search itineraries and/or to buy their ticket,
• In their hometown, people often have a monthly or annual subscription (often paid by their hiring company) to use public transports,
• Abroad, the ones that had used public transportation often experienced a long and complex process to understand how or where to buy the tickets,
• It’s common for people traveling to a new city to buy the wrong ticket or to pay too much for the trip.

DEFINE

Following the interviews, I had a much clearer picture of the issues I needed to answer, which are :

• the buying process complexity abroad (different rules, languages, zones-pricing, payment methods…),
• the stressful and/or bad experience to buy a ticket in the station (many people at the counter, lack of information/help, lack of time, counter out of service…),
• the high probability to buy the wrong ticket (paying too much for a trip, risk a fine if you choose the wrong pricing…).

To summarize, the shopping experience is rather bad when the user needs to purchase public transport tickets, especially abroad and when the itinerary requires taking into account several variables such as the zone to be covered, the differences in prices (children, adults, seniors for example), the distance to be covered, etc.

My goal here is therefore to improve the purchase experience of public transportation’s ticket through a simplified and seamless customer journey.

IDEATE

While I was gathering information during interviews, ideas for the new feature were just popping right away in my mind, such as:

• Introduce a QR code in the app,
• Develop a partnership with local transportation,
• Launch a top-up card,
• Create a daily “tourist” ticket…

Considering the user pain points and my client’s notoriety, competitors, and current features, one idea stood out to answer the challenge: create a digital ticket (using a coding technology such as QR code, NFC, or RFID, linked with local transportation services) that can be purchased and saved directly on the app.

PROTOTYPE

Now, and this is the last step of this challenge, it is time to put this idea into practice and create a prototype to show my user and collect feedbacks to refine it (this would have been in the “test” step).

For the new feature (digital ticket in the app), the customer journey will be as following:

1. The user searches for an itinerary.
2. He chooses a route according to his criteria(s): duration, number of transport changes, price…
3. When selecting a route, the user has the possibility to buy a digital ticket.
4. If he chooses so, he is asked to proceed to payment.
5. After payment confirmation, a digital ticket is issued and stored directly on the app.

At this early stage of ideation, it doesn’t make sense to spend too much time and money on making a high-fidelity prototype. It is required by the challenge to go with hand-sketched screens as you can see below. This allows us to focus more on the user flows and the information architecture rather than the design.

My own hand-sketched screens

I took as a working basis the actual screens present on Citymapper by adding the possibility of purchasing a digital ticket on the app, which leads to:

• One screen to proceed to payment: the user has to complete his bank details and confirm the purchase,
• Another screen with the digital ticket: after payment, the QR code is issued and stored with the selected route, price, and validity.

Throughout the design thinking process applied to the Citymapper use case, there are several key things I learned:

• Interviews are a great source of information, therefore it is important to keep in mind the client’s requirement so as not to get lost in the process.
• After gathering all sorts of insights it is required to synthesize your findings and define a problem statement to answer in the next steps.
• Prototyping can be very time-consuming, always keep in mind your stage of ideation, if early in the process don’t spend too much time in a high-fidelity model, just draw something to share a “concrete” idea and go with the design in later stages.

If you want to go further in the Citymapper use case, I recommend you read this article on the Cittymapper pass issued in London. Maybe next will be your city?

If you enjoyed this challenge as much as I did, click the applause button down there and feel free to follow my account for more stories of my own!