Citybus

Saving it from 1.3⭐️ Rating and Make It Great Again

Citybus
Project Duration
2 weeks
Scope

Design Thinking

Problem Discovery

UX Design

UI Design

Sector

Transport

City Service

Platform
App

Background

Citybus limited is one of the major bus operators that provides franchised bus service in Hong Kong. The company created an app for its passenger to check the bus arrival time and it's currently ranked #12 in the travel category app in App store. (As of Oct 16 2023).

As a frequent user of the app, I found this app very unintuitive and often took many clicks to find the information I want. I can tell how many people felt the same when I saw most people waiting for the bus were also using the app.

⚠️ Disclaimer: This is a personal project and is not affiliated with NWS Transport Services Limited. The case study may have limited coverage due to limited access of information I can gathered such as data, technical constraints etc. This case study was done for my personal learning.

Problem Discovery

To kickstart the project, I started gathering the problems I've encountered during my daily usage. I also went to the App Store and Google Play to read user's comment about the app to understand their pain points.

⭐️ 1.4/5

Citybus App App Store Rating (16,142 votes)

⭐️ 2.5/5

Citybus App Google Play Rating (6144 votes)

What did users say about the app?

"I understand that ads are huge source of income for app developers and providers, but please get your basics right before attempting anything fancy or promo ads."

By fixyourbusapp

"Need to key in the bus route in order to find out which stop you are at and then to provide an estimated arrival time of the buses"
"How many clicks do we need in order to find the bus arrival time!!!"

By Jwonghs

"The app UI is so poorly designed that you have to click down at least 5 levels (including the ads) just to get to the bus stop and check when the next bus is arriving."

By Tatty Fung

Competitor Analysis

I downloaded other competitor's app and performed same tasks to check the bus arrival time to understand the pros & cons of each searching method.

User Survey

To understand how people feel whenusing the app, I surveyed 14 people aged between 16-45 using google forms.

Below are the questions I asked in the user survey to learn about the target users and their thoughts about the app:

  1. What's ur age?
  2. How often do you use the Citybus NWFB app? If None, why?
  3. Why do you use the Citybus NWFB app? How do you use it?
  4. Which features do you use most frequently? Why?
  5. How do you plan your journey?
  6. Do you need to transfer during your journey?
  7. Is the app helpful to you when finding the information you need to get to your destination? If not, what’s missing and what can be improved?
  8. Please name 1–3 transportation apps/websites you use (if any)
  9. Please name 3 apps/websites (any category) you use most frequently
  10. What would you like to see in the next update?

Insights

  • People who don’t take Citybus/NWFB never downloaded the app
  • The majority of respondents mainly use the app to check bus arrival time
  • Users complained about not being able to check the length of journey and estimated arrival time when search by Destination
  • They are tech-savvy and active on instant messenger and social media, they loved to be connected and updated
  • They would like to see better interface, better route search experience, route information sharing and fewer ads in the next update
  • Half of the users need to transfer during their journey, which means we also need to take that into consideration when designing the point to point search

Current experience

Nearby Routes

  • Bookmark & History sections are mixed together which makes the bookmarked route hard to find when user has recently searched
  • The route shown could be inaccurate sometimes as the app location service may detect wrong user location

Search by Routes

  • The select routing page is confusing

Search by Destinations

  • Point to Point search result is hard to read and understand
  • After entering the destination name, user has to scroll to find the location, it doesn’t sort the location by distance/most searched
  • Bad readability makes the search result very hard to digest
  • Doesn’t guide user to the bus stop

Problem

The app failed to serve it's main purpose of helping users to find the bus arrival time. In general, the problem is cause by 3 aspects such as

  • App stability and performance issue
  • Full-screen pop-up ads
  • Poorly design search experience
How Might we

help users find the bus arrival time within 10s?

Solution

In order to design a comprehensive solution that covers all potential users. I have created 3 personas based on my findings as my design reference.

Personas

Justin Chan

Age: 28

Education: Bachelor's degree

Lives in: Tsuen Wan, Kowloon

Marital Status: Single, living with family

Occupation: Accountant

Justin is a 28-year-old senior accountant who works in an accounting firm in Central.

He often takes Citybus for daily commute and going to different places with friends. He missed his bus sometimes and have to wait for the next one.

He wants an app which he can check the next bus arrival time so that he can leave home as late as he can and go home as soon as possible.

His biggest concern is whether the app is easy to use and provide useful information.

How long do I have to wait for the next bus? I've been standing here for 20 minutes. It's so hot under the sun!

Goals

  • Check the next bus arrival time
  • Get updated when the route status change, e.g. limited service, detour etc.
  • Get updated whenever the traffic condition changed, e.g. (traffic accident, detour etc.)
  • Get to know if the bus is full so that they can wait for the next bus with seats available
  • Check the last bus
  • Check other bus arrival time from the same stop

Frustrations

  • Always missed the bus and have to wait for the next one
  • The bus service got cancelled or delayed sometimes without getting noticed
  • Some bus stops are cancelled in the express route

Indah Wati

Age: 34

Education: High School Diploma

Lives in: Central, HK Island

Marital status: Single

Occupation: Domestic Helper

Maria is a 34-year-old domestic helper from Indonesia who works for a local family with 2 kids.

Maria usually takes Citybus to send the kids between home and school and also meeting friends on Sunday.

She often uses the app to check the bus arrival time but find it quite difficult to use. She also wants to know which bus can take her to certain district such as Aberdeen, Qurray bay etc. Sometimes when she bring 2 kids to school, she wants to know which bus would arrive first so that they could queue for the one who arrives first.

Her biggest concern is to find out which route she should take and whether the bus will arrive at school on time so that the kids won't be later for school.

Charlie, Molly! Be quick, we are gonna be late for school! Don't know how long we'll have to wait if we miss the bus!

Goals

  • Check the bus arrival times
  • Get updated whenever the traffic condition changed, e.g. (traffic accident, detour etc.)
  • Check other bus arrival time from the same stop

Frustrations

  • Got on the bus and find out they are stuck in the traffic when they could take other public transport instead if knew earlier
  • Queued for one bus but another bus from different route arrived earlier
  • Get confused when trying to find which bus goes to certain district

Ming

Age: 70

Education: Primary School

Lives in: Sham Shui Po

Marital status: Married

Occupation: Retired

Ming is a 70-year-old retired government employee who is enjoying his retired life.

Ming lives in Sham Shui Po and travels around to meet friends and explore the city by bus.

Ming finds Google Maps a little bit difficult to use and often ask friends/family or use the bus app to check which route to take to go somewhere. However, he gets frustrated sometimes with the Search By Destination function.

His biggest concern is what bus he should take to get to where he wants to go.

Aiya! Why is it so difficult to check which bus to take to go to Stanley! And how do I check where is the stop and the next bus arrival time

Goals

  • Check the bus arrival time
  • Check which bus to take to go to certain district

Frustrations

  • The search by destination function is too difficult to use
  • The location service always set the wrong location for him
  • He doesn't know how to get to the stop

💡 The Redesign

Tweak to adapt user search pattern

With the 3 personas we defined. Based on their needs and behaviours, I have changed how the app works for them.

New User Flow

Iterations

Starting with the first draft of wireframe to get an idea of the layout and how the information should be displayed.

I further refined the design by simplifying the UI, remove unnecessary information and improve the readability and usability of the design.

Search by Route

User searches by route number to see the next bus arrival time and other information. They can also save their most frequently search route to have quick access to its information. I have picked this page as the home page since it is the most common way user check the bus arrival time.

Search by Stop

User searches by nearby stops and see the bus arrival time of multiple routes or go to the saved stops to see multiple bus arrival time of a specific stop.

Search by Destination

User with location service on can search by destination to see where to go and which bus to take to get to the destination. User can also set the Home and Work location to have quick search on which bus they can take. Besides that, user can also click the boxes below to do quick route search to a specific district.

Citybus
Next case study