Ironhack Prework #1 — How to Improve the CityMapper App

Meryll Davis
5 min readJan 5, 2022

My first challenge as a UX/UI Design student at Ironhack is to come up with new prototype for the CityMapper app that will simplify the payment process for users. As a frequent traveler myself, I understand the need for a strong app to help with booking multiple modes of transportation and their associated fares, and I understand how time consuming and frustrating it can be to log in to several different sites and input payment information repeatedly, and then receive a separate confirmation email from each company. My goal is to design a way for travelers to choose and pay for all their transportation needs through one channel.

BACKGROUND

CityMapper is a transportation app with which a user can search for various route options between any two location points in a city supported by the app. The app is quite integrative, in that it not only includes taxis, driving, trains, buses, walking, and public and private biking, but also gives live timing information and even the estimated number of calories you’ll burn depending on which route and type of transportation you choose. Users can also choose among different “routing powers”, which can help to minimize the number of transfers, or prioritize speed or lack of steps and stairs, or keep travelers only on trains, only on bikes, etc. The app even encourages users to save trees and money by allowing them to prioritize routes that are the cheapest, or that are the least environmentally harmful!

EMPATHY

In trying to book a sample trip through the city of Boston, I noticed that the app is fun to use, but does have at least one pain point, as described in the Ironhack assignment. When I get to the payment screen, the app asks me to pay for each leg of the journey separately through the website of each transportation company — in this case, a Lyft ride, the Boston T Subway, and public BlueBikes. It would be a hassle, especially if I were in a foreign country, to book each of these separately.

So, the problem I would like to solve is: how to simplify the payment process for all legs of a user’s journey into one payment channel.

My audience is: all users of public transit in any city supported by CityMapper, especially those who use public transportation very frequently and those who travel to other cities.

Competitors for CityMappers are: Moovit, Waze, Google Maps, and Transit.

The tone or feeling associated is: frustration, rushing, and doubt.

INTERVIEWS

To find out about other users’ experiences and pain points with public city transit, I performed 5 interviews with friends who frequently use public transportation. The interviewees ranged in age from 27 to 49, including 2 Americans, 2 Europeans, and 1 Indian, all of whom have done a good deal of traveling.

The questions I asked were:

  1. How often do you use public transportation at home, and for what purposes?
  2. Do you also use it for traveling abroad, and if so, how often?
  3. Which apps do you usually use to research transit options? Are you happy with these? Why or why not?
  4. How do you typically pay for public transportation, and are you happy with this way of doing so? If not, why?
  5. Have you ever had any trouble with booking multi-modal city transit? If so, can you describe it?
  6. Is there anything you wish were different in the apps you use?
  7. How would you feel about being able to pay for all legs of your transit in one app?

DEFINE

The common negative themes that I saw in most interviews were:

  • In foreign cities, doubt about whether interviewees are choosing the best options in terms of reliability, efficiency, and pricing
  • Frustration when payments don’t go through
  • Frustration with needing to make multiple payments and possibly pick up multiple tickets or cards
  • Feeling that the timing reported in some apps is not very accurate
  • Not being able to track the approach of a public bus or train
  • Having to redo payments if a ride falls through
  • Not knowing if the information they’re receiving is accurate

Problem Statement: Some users of public transportation apps feel doubt about the accuracy and reliability of the information they receive from the apps, and they feel frustration at the complicated payment process requiring them to log in to multiple company sites, submit payment info on each, and deal with the different types of tickets, cards, and bar codes sent for each leg of the journey.

To Solve: How to simplify the payment process into one payment and receipt channel for all legs of transit a user will take.

IDEATE

After considering several options, I think that the the easiest way to pay for all transit tickets at once, and have them in one place, is to use a QR code. CityMapper as a company can have linked accounts to all major transit options in each city, or there could be a way for a user initially to link their various accounts and add payment info. Then, when the user chooses their preferred route, the next screen allows them to choose if they would like to pay for tickets now, to enter or confirm payment info, and then be taken to a bar code page. They can save this bar code in a “wallet” section, or perhaps in Google Wallet, but it also minimizes to a small, accessible thumbnail back on the navigation screen.

THINGS I LEARNED

I learned that there are numerous options for how to solve a pain point, and that only by at least paper prototyping can the designer actually see what might work best, and what’s still missing. I also learned that user interviews are essential to understanding how to think about a solution. It is easy to assume that I can think like the potential users, but that’s not true! I need diverse perspectives to see an app, or a pain point, from all directions.

I also learned that I need better pens and markers in order to make clearer and more appealing sketches. Looking forward to going to find some today!

Thanks for reading 🖖.

--

--

Meryll Davis

Counselor turned designer exploring the convergence of the human, natural, and virtual worlds.