Design thinking Challenge— towards an integrated ticket purchasing feature for Citymapper
Contextual Setting…
Citymapper is a free public transit and mapping app whose mission is to simplify problems in urban mobility. They offer mutlimodal routing to help with directions, a data factory that fixes open data so users can get accurate information, and a myriad of product features that solve everyday use cases.
It has been created in 2011 by a former Google employee and first launched in London.
Scope of the project
This exercise is part of the required prework for the UX/UI bootcamp that I will attend at Ironhack, Paris.
I will try to create a feature for this app that solves the pain of having to purchase different public transport tickets by different channels, using Design Thinking methodology.
According to IDEO, the design firm that pioneered human-centered design, “Design thinking is a deeply human process that taps into abilities we all have but get overlooked by more conventional problem-solving practices. It relies on our ability to be intuitive, to recognize patterns, and to construct ideas that are emotionally meaningful as well as functional.”
So, first things first, let’s get to know more about people who actually use public transportation.
User interviews
I decided to interview four people around me who frequently use public transportation, mainly to go to work, but also to visit, go out and explore cities. Two of them are 25 and use public transportation at least 5 days out of 7, one of them is 29 use it on a daily basis, and the last one is 23 and mainly used it when travelling in Japan.
As it is recommended when it comes to interviewing users at this point of the design process, I wrote some questions that were going to help me conduct the interview. Because every interview is, and should be different from one another, I also reacted on the answers given by my testers.
Here are some of the leading questions I asked :
- How often do you use public transportation ?
- For what purpose ?
- How do you buy your tickets ?
- How do you feel when you need to get tickets at a vending machine ?
- Do you use applications when you have to search for an itinerary ?
- What do you like about it (depending on the previous answer) ?
- Have you ever used public transportation abroad ?
- How was the experience ?
After transcribing the interviews and gathering the results, I started to recognize patterns in the way people felt about the experience of purchasing public transportation tickets.
N.B : All of my subjects live in Ile-de-France region and therefore, all posess a Navigo Card. It is a contactless smart card that already simplified a lot the experience of purchasing tickets. Since 2006, it has been possible to use it in all means of transport and all over the IDF region and is gradually replacing the conventional paper tickets.
The main problems that I identified were as it follows :
- It takes time to buy tickets, or to load your Navigo card at the vending machines
- The facilities perform poorly
- The conventional system relies too much on “material”
I came up with this problem statement, which represents the problem I will try to solve :
Young working professionnals need a way to purchase dematerialised tickets for public transportation quickly.
Time to ideate …
In order to come up with some ideas, I remembered one of the first and most striking of the 10 Laws of UX : Jakob’s law.
It states that : “Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know.”
As a inhabitant of IDF myself, I was already aware of some applications that were serving the same purpose than CityMapper. So I went trhough some of them (ViaNavigo, Google Maps, SNCF Assistant) in order to see what was going on and if they offered a purchasing feature.
It turned out that for ViaNavigo and SNCF Assistant that are public-owned applications, they were actually offering this feature through the NFC technology. Here was the solution.
At this point, I tried to step back a little bit and think about other ideas that could work as well and I found two other :
- The QR Code technology
- A virtual wallet with a multi-purpose card
Here is a picture of my global Mind Map trhough this ideation process.
Because the infrastructures in IDF are already equipped with the NFC technology, I chose to go for this idea which is, to me, the more convenient and manageable solution.
Now, it’s time to prototype !
Purchasing feature in few sketches
First of all, I chose to put a “purchase button” on every suggested intinerary, right under the price so that users are aware of what they are buying. At this point, the screen is exactly the same as it is now except from this button. As of screen n°2, everything is created from scracth.
On screen n°2, after the user clicked on the purchase button of the itinerary of his choice, he can choose to load his tickets directly on his phone, or to load them on his navigo card.
Screen n°3 represents a reminder of the purchase, whether the user chose to load the tickets on the phone or on the Navigo card.
At this point, he can also chose to receive a receipt by email, label the purchase (optional) and has to accept Terms and Conditions.
Once he is sure he wants to purchase these tickets, he can view his receipt (Screen n°4) which will involve Date and Time, Siret number, Card number etc… and download it on his phone.
On Screen n°5.1, the user is in the flow where he chose to load his tickets on his Navigo Card. A checkbox shows him that the transaction was accepted, and that he needs now to load his tickets on the card. As it is explained, he has to place his navigo card on the back of his phone in order to load his tickets with the NFC technology. (Here, we assume the NFC function was already turned on on his phone, oherwise, an error message would appear to remind that he has to turn it on.)
The user flow when loading the tickets on the phone is one step shorter because it does not require the action of placing the card on the back of the phone.
Here on Screen n°5.2 and n°6.1, once the payment is confirmed, an other checkbox tells the user when the tickets are actually loaded on his phone, or on his card.
When interviewing my subjects, I realised that for people who already used this kind of technology on other apps (RATP app for example), something was missing in order to have a complete experience.
Because this way of purchasing tickets is not democratized yet, they often forgot that they had dematerialised tickets on their app. One extra idea for this feature to be even more attractive and efficient, the app should remind the user that he has available tickets through a push notification system for example.
Feedback on my first user research and rapid prototyping
It’s now time to step back and analyse my first experience as a baby UX designer.
Because it was easier to interview people around me, I ended up interviewing people that are close to me, same age range, location and lifestyle in general. At this point it was difficult for me to think as a designer, and not as a user myself.
Also, because I am an actual user of the Citymapper app and I already faced the problem of having to queue to purchase tickets at a vending machine that will finally not work, I already had in mind an idea about the feature, even before interviewing people. With this in mind, I was also very surprised of how the interviews gave me real insights and helped me to sharpen my first ideas.
Side Note for myself: next time, I will try not to think about the solution, before thinking about the problem. Isn’t that what a good UX designer is ?
