Ironhack Prework: Challenge 1
Design Thinking of New Feature for Citymapper Transit App
How applying Design Thinking helped me create a prototype of a new feature for Citymapper transit app. This feature would alleviate the problem of not having to purchase different tickets for different modes of transportation in an urban environment.
Citymapper: The Ultimate Transit App — is a mobile and web-based transport app that uses mapping technology and the power of open data to make transport sustainable and hassle-free.
Its goal is to make cities more usable by providing a free-of-charge service to its users to help them facilitate getting from A to B in the most efficient manner including the use of multi-modal options for transport (e.g. Subway, ride-share, e-scooter).
When choosing your destination, the app provides you with travel options in real-time for all urban mobility modes of transportation.
This challenge was part of a “Prework” exercise for Ironhack’s UX/UI Design Bootcamp that focuses on the Design Thinking process of solving a problem.
What is Design Thinking?
Design thinking is a non-linear, iterative process that teams use to understand users, challenge assumptions, redefine problems and create innovative solutions to prototype and test. Involving five phases — Empathize, Define, Ideate, Prototype and Test — it is most useful to tackle problems that are ill-defined or unknown.
© 2021 Interaction-Design Foundation
What is the challenge?
The goal is to design a new feature for Citymapper that would alleviate the user of having the problem to purchase different public transport tickets from different vendors (e.g. ride-share, subway, city bikes) when traveling around the city.
By adding this feature to the app, it would finally make Citymapper a one-stop-shop for everything related to urban mobility:
- Planning your route (enter your destination)
- Choose your modes of transport (e.g. train, bike, car, scooter, etc.)
- Pay once for these services (using your stored banking data)
Why Design Thinking?
One of the fun parts of this challenge was to use a common problem-solving method that has its roots in the centuries-old scientific method.
For this challenge, I proceeded with this solution-based approach using the 5-step process of:
- Empathize with the users to establish rapport and understand their pain points. Also, understand the business context of Citymapper to serve their needs as well
- Define the user’s needs based on the user research I’ve done and synthesize the results from user interviews to help me design solutions.
- Ideate possible solutions based on my assumptions of solving the problem and pick the best option
- Prototype the best solution using low-to-high fidelity paper wireframes
- Test the prototype with users to determine where to refine the solution. [This was not part of the challenge]
Step 1: Empathize
Finding out the business objective and the user needs
In order to tackle this problem, I approached this via two routes. The first route was to understand the business, so I researched what Citymapper and comparable apps are all about. I went to Citymapper’s website to figure out their value propositions and mission and came across this:
I noticed that they emphasized providing the user with a personalized experience, clear communications, and the joy of exploring their city. This led me to hypothesize that what they are truly after is to provide as “seamless” of an experience as possible. In other words: The experience should provide an enjoyable travel flow that is as transparent and efficient as possible. And this transparency would be displayed on the app with clear communications about routes, transport services, and ticketing/pricing.
To better understand the users’ needs, I had to define a target group of users that I would conduct a 1:1 interview with. So I decided to choose users in my network that are in the age group of 35 to 50 years representing working professionals which already have some travel experiences on their back.
To get a more global context of the problem, I’ve interviewed 3 users in my current city of Berlin, Germany, one user each remotely in Mexico City, and in San Francisco, California. All three locations represent major cities that offer diverse options for urban transit and they represent cities I’ve considered home. Additionally, each city tackles its urban mobility problem differently, which gave my research a unique angle to address different market needs.
UX Research: 1:1 Interviews
Before I conducted the interviews I crafted an outline of what kind of questions I would be asking in order to get a broad sense of their experiences with urban transit and their specific pain points.
The interviews I structured into 3 parts:
- Beginning — describing my study and establishing rapport with easy open-ended questions followed by concrete questions
- Middle — covering the main topics of urban transit to gather insights on problems the subjects may have experienced in the past
- End — where I asked participants if they wanted to add to prior discussions, such as a deep-dive on a certain topic. Finally, I thanked them for their participation and elaborated on the next steps.
Some sample beginning open-ended questions included:
- Tell me about the last time you used public transport?
- What are your criteria when choosing which public transport service? Is there one service or mode that is your favorite? How so?
- When was a situation when you did not choose your preferred mode of transit and opted for another channel? What was your reasoning behind it?
For the middle part of the interview I was interested in particular in bad experiences they may have had:
- Did you ever have a negative experience using public transport? What were your tasks involved in that overall experience?
- When it comes to the purchasing ticket experience, have you ever faced any obstacles? Is there anything you would have liked to be different?
- How easy or how difficult do you find it to purchase a ticket when using for instance a ride-share app, a subway system, or an urban scooter?
For the last question in particular, I wanted to see if they shared a specific negative experience in their purchasing behavior and what that prompted them to opt for a certain mode of transportation vs. another.
At the end of the interview, I usually shared some thoughts on what the participant said about a particularly interesting discussion we had, and then usually that prompted them to add more details to their experience and sometimes offer suggestions for improvement.
For instance, if they shared that they had a negative experience with the ticketing system, I elaborated on if they believe there is a problem in general with ticketing systems or charging for transportation services. This opened up the discussion more on what their specific pain points are related to what Citymapper is trying to solve.
Observations & Pain Points
Overall my experience interviewing my network was quite rewarding, as they revealed some similar and some quite different experiences when it comes to urban mobility. Overall they agreed upon the following:
- Public transport needs to be fast, efficient, and hassle-free
- The purchasing process of tickets, whether on an app or in-person using a machine should be as seamless and easy as possible.
- Using their preferred mode of transport is always their first option, before even considering ways to reach their destinations.
For their pain points, the following was mentioned:
- “I don’t like waiting in line to purchase tickets and I hate broken ticketing machines, especially when I’m on a tight deadline and would miss my ride”
- “I don’t want to think about what ticket I should buy, I just want to get on with my life”
- “I’ve had a bad experience using the bus at certain times, I didn’t feel safe.”
- “I feel under pressure having to complete a route in a certain amount of time in order to be able to transfer to other modes of transport”
- “The vending machine broke, even though I had already purchased my ticket, but I’ve never received my ticket and had to prove that I’ve purchased it”
- “Due to the pandemic, there are fewer options to travel using fewer modes of transportation and due to the health-guide lines you can’t purchase tickets at every ticketing machine”
Stage 2: Define
Synthesize your research findings to define the problem to be solved
From my findings of the 1:1 interviews, I narrowed down the path I wanted to take to ideate possible solutions to the problem. But before I could do so, I had to figure out what the underlying issues really are in order to define a problem statement to guide me in my ideation.
My interviewees were primarily concerned with the hassles (cognitive loads) of ticketing experience, their preferred method of transport based on their prior comfort levels, using technology to easily purchase tickets vs. dealing with crowds near ticketing machines during the Covid-19 pandemic.
From this I derived that they want a seamless experience, otherwise, they go back to old habits based on comfort. This experience should translate to the payment system of the Citymapper app.
Problem Statement
How can we improve the process of purchasing tickets for different modes of transportation to make the overall travel experience even more seamless and personable?
Step 3: Ideate
Concept ideations of possible solutions to address the problem
After defining the problem, I also looked at possible existing solutions that perhaps are already addressing the problem. In each city, in which my interviewees reside, has addressed this problem partially in a unique manner. But it seems that one way to go is to offer a metro pass, whether physical or digital on your device that uses near-field communications (NFC) in order to pay for your ride. Usually, these passes are meant to be refilled with cash to use them, or you have to purchase a pre-determined amount to use it as a city day pass.
Ideation 1: Tap & Go
For the City Pass Enthusiast
For the first idea, I was thinking of my Mexico City and San Francisco participants that rely on city mobility passes for multimodal use of transport.
For this idea, I looked at pre-purchasing a city pass that is essentially a digital card using refillable monetary funds. To spend the funds, you would choose your destination and pick your modes of transport, and add each to the pass. Finally, the pass would spend those funds based on the chosen transport services.
Pros
- Choosing your transport services ahead of time and spend the funds on a pre-filled pass.
- You get to see what service to spend on before final purchase
Cons
- Tap & Go system needs to be implemented by upgrading the ticketing infrastructure with these “tap points”
- You have to pre-fill your card with a significant amount of funds before you can use this service.
- Typically card-refills with a replenishment amount once the balance is below the limit
Ideation 2: Pick ‘n Choose
For the Cost-Conscious Folks
Two of my interviewees were more cost-conscious and that criteria determined their choice of transport. For that reason, transparency and choice is a must. This lead me to my next ideation of “Pick and Choose”, where the user gets to pick his or her travel options before the final purchase is done via the phone’s digital wallet.
Pros
- You only pay for what you will actually use
- You don’t need new infrastructure for a “tap & go” feature
- It integrates all your tickets in a nice overview and knows whether to display a QR-code for a ticket-checking agent or just simply an activation code for let’s say an urban scooter.
Cons
- This is not for ad-hoc, on-the-go people who don’t want to deal with the hassle of planning their trip.
- Buy-in and integration of third-party vendors could be a business challenge
They need work together along with city’s public transport authority, need to work to gether to come up with a standardized pricing scheme that gives the user the best price based on a combination of fixed pricing (e.g. city’s public transport) and variable pricing (e.g. Scooter miles ridden / time-based charge). This requires buy-in from third-parties and APIs to integrate their pricing methodology to the app.
Ideation 3: Location-Aware
For the On-the-Go Type
For this idea, I’ve thought of a super-seamless experience using NFC (near field communication) and location-awareness technology. This idea is meant for people who don’t even want to plan their trip and just travel ad-hoc because they are in a rush. The idea is to be near a transportation point (e.g subway station or parked E-Scooter) and let the phone handle it from there. It detects your location and offers your travel option, then choose what you want and use your digital wallet to pay.
Pros
- Super-easy to use and fast
- Less cognitive load to plan a trip
- Ready when you are
Cons
- Require more technology integration to make this work with the app
- Most users plan their trip than just travel ad-hoc. Especially if you are a tourist or new in town.
- More interactions involved if you use multiple modes of transportation
Step 4: Protoype
Paper prototype of the chosen solution
I ended up choosing my ideation 2: Pick ‘n Choose, because most of my interviewees told me that they want to be able to choose and know ahead of time what modes of transport they’ll be using. Additionally, it’s the most cost-effective mode to travel.
Here are the paper prototype screens I’ve created that show the following flow described below:
Task Flow of Paper Prototypes
- Choose destination
- Select your best travel option
- Purchase ticket
- Choose payment option (digital wallet)
- Click to confirm
- Purchase confirmation
- Itenary and tickets
- Ticket view
To try out this paper prototype I’ve chosen POP, an application by Marvel that lets you take pictures of your wireframes and lets you construct your user flow with interactions. Check it out below!
Link to Prototype on paper
https://marvelapp.com/prototype/61e3d2e/screen/77511326
Task Flow
- Enter your destination
- Choose Travel Option
- Purchase Multi-Ticket
- Choose Payment Options
- Confirm “Apple Payment”
- Purchase Confirmation
- Travel Itinerary with Individual Tickets
- Individual ticket view with QR-Code
Step 5: Usability Testing
Testing your prototype with users and improving the UX
This wasn’t required for the assignment, but if I would have had more time, I would have tested the above prototype by conducting a usability test. I would have chosen some sample users and conduct the test while I observe how they manage to complete the task of purchasing a ticket. That’s for next time :)
Conclusion
Overall, I’ve really enjoyed this exercise, as it was the first time I had to document in a step-by-step process using Design Thinking to solve a problem. It really challenged me and took some time to get used to with respect to documenting your planning and thought process. My wish is to improve my user research skills to become a better UX/UI Designer.
I thank all my participants for their time and am eager to share my results.
About Carlos
I’m a Berlin-based product & UX/UI designer from the San Francisco Bay Area. I come from a non-linear background in mechanical engineering and marketing-communications, powering me to solve the most challenging design problems in a human-centric way. I have delivered delightful experiences for digital products in consumer & enterprise applications for web and mobile apps for the past five years.
You can check out my UX design work here.
