UX Case Study: Public Transportation App

Wahyu Dwi Widharto
6 min readFeb 10, 2019

--

This case study is a challenge that I did for Binar Academy which is to design a mobile public transportation app.

What I written below is the process that I already done in order to accomplish the objectives that given, with research and test results. Here are my process:

Ideation, research and analysis

  • Ideation (Understanding the case)
  • Identify the problems
  • User research
  • Personas

Understanding the flow and mapping

  • Customer journey
  • User flow

Design and prototype

  • Lo-fi design
  • Hi-fi design
  • Solution to pain points

Evaluation

  • Testing

Ideation, research & analysis

Ideation

One day Indonesia will become a developed country. Therefore, public transportation is one of important aspects of a developed country. The terms of public transportation are trains, cabs, buses, and trams which is provided by government.

Nowadays, people are used to use smartphone almost in every activity, for instance buying groceries, hotel reservation, learning some courses and even to hail a cab.

Main objectives:

  • Helping users finding the schedule of public transport
  • Giving information of public transports’ routes
  • Buying tickets
  • Cashless payment within the app

Platform that i choose:

Platform that i choose to design is Android. Why? It’s simple. It’s because more than 90% of smartphone users in Indonesia are all using android. (see the stats here: link)

Identifying the problems

There are already 4 main objectives from the test that must be solved first. Those are:

  • Helping users finding the schedule of public transport
  • Giving information of public transports’ routes
  • Buying tickets
  • Cashless payment within the app

But, in order to make this app more impactful, i also did some small user research to gather more information about major problems that i did not know before.

I created a short survey form in google form (result link: here) and spread it to 21 respondents. There are major problems that i found the user research (most of them are same with objective that defined above):

  • Misinformation about schedule & routes.
  • Schedule is not same with real situation (late arrival of the transport)
  • Users want to know when the capacity of the transport is already full (for now there is no fixed capacity limit regulation, thats the problem)

Persona

To create less assumption, i created personas of this case, based on the research that i have done. I think this will help to determine who are the initial users when I create a MVP of the product. I cannot say it is very accurate because in order to find the best accuracy it also need deep and long research.

Name: Nabila (Occasionally Commuter)
Age range: 24–29
Occupation: Employee of private-owned company
Preferred transportation: Bus

Needs:

  • Information about available transportation for her destination
  • Information about actual schedule, route & pricing
  • Information if the bus will be late without keep asking the bus shelter officer

Pain points:

  • Difficulty finding schedule and route for her trip
  • Don’t know if the vehicle will arrive on time or late
  • Often found that the vehicle that she want to ride is already full

User journey

This is Nabila’s first day on her office. She needs to go work without being late. She want to know the fastest route to arrive in her new office in-time, the pricing of each possible route, and also quick and easy payment

Nabila’s customer journey map

Okay, based from the journey above, we can find that there are 5 major problems that need to be solved. Those are:

  • Difficulty finding vehicle route for her trip
  • Difficulty finding suitable schedule
  • Need faster & easier payment method
  • Often encounter full vehicle
  • No information on late arrival/schedule changes

There are also potential solutions that i defined for each solution, those are:

  • Provide easy search & list for designated route complete with the schedule
  • Provide filter & sorting features
  • Provide in-app payment method (using credits, like ovo/gopay etc.) and easy validation process (fingerprint scan)
  • Create vehicle quota information for each route before payment
  • Status on every route (if somehow the vehicle is late)

User flow

After the problems & solutions based on my research is all prepared, user flow is made. Creating user flow is very helpful in-order to mapped out all of the app interfaces that i need to design.

User flow

Design & prototype

Lo-fi design

In order to create interfaces that will solve the problem, i made a lo-fi design/wireframe first. In this wireframe, i tried to apply the solutions for the problems that users encounter and to achieve the objectives that been set.

Wireframe preview

Here are the link for my wireframe file in Figma (to see it more clearly):

Click here to see my wireframe in figma file

Hi-fi design (UI mockup)

From the wireframe above, i made this final UI design with all the color and my fictional brand (TransLine)

Moodboard & branding overview

I use blue as main color. My reason is, because the ministry of transportation’s color is dominated by blue (lol). I also use Roboto as my app typeface because its native typeface for android (optimized).

Final UI mockup

Here are link for my UI mockup design: click here

Also, here are link to my UI prototype: click here

Solution to pain points/problems

  • Difficulty finding vehicle route & for her trip
  • Difficulty finding suitable schedule
  • Late information
  • Sorting & filter
  • Seating quota

So, in the screen that i designed, it contains all the important information that needed by users

  • Need faster & easier payment method

Evaluation

Testing

Because i spent most of my time in research, i did not really allocate my time to testing. So i just sort of asking feedback about app that i designed. Here’s some of the feedback:

  1. What if user didn’t have fingerprint feature on their phone?
  2. Still little bit confused how to read the cards from route lists (not familiar with the coded bus)
  3. Need live-tracking of the vehicle location

Takeaways

I know that this concept that i made is far far from perfect. I didn’t test it with extreme use-case yet. The user research is also far from valid. There are so many things that still can be explored and improved. I just hope that this is can be a good basis to further and actual development of this app.

--

--