Overview

BUSolo is a smart public transportation application designed to enhance urban mobility in Solo. Inspired by systems like TransJakarta, it aims to provide a reliable, efficient and affordable commuting experience for residents and tourists alike.

Key visual — seamless ride, every time.
Key visual — seamless ride, every time.
RoleBrand Identity & Interface Design
ClientBinar Academy
DateAug 2025
CategoriesBrand Identity, Interface Design

Problem

Public transportation in Solo lacks integration, real-time information and convenience, making it inefficient and underutilised.

Solution

BUSolo combines real-time bus tracking, route planning and easy digital ticketing in one app to make travelling around Solo simpler and better.

Process

Research, define, ideation, prototype, testing — with the deliverables named up front for each phase so nothing got skipped under deadline pressure.

Design thinking process and phase deliverables.
Design thinking process and phase deliverables.

How might we

Four problems came out of the research, and each one was turned into a How Might We before any solution was allowed near it: uncertainty about arrival times, uncertainty about seat availability, buses too crowded, and the hassle of a physical card.

Problems, How Might We statements and the solutions they produced.
Problems, How Might We statements and the solutions they produced.

Persona

Two personas at opposite ends of the same system: a daily commuter who needs reliability and a visitor who needs legibility. Designing for both is what pushed the app toward plain language and away from insider route codes.

User personas — daily commuter and visiting entrepreneur.
User personas — daily commuter and visiting entrepreneur.

Jobs to be done

The JTBD framework kept features tied to a stated need rather than to what was fun to build.

Jobs to be done — situation, motivation, expected outcome.
Jobs to be done — situation, motivation, expected outcome.

User flow

From splash screen through to check-out, with the wallet as a first-class branch rather than something buried in profile. Scan → check in → check out is the spine of the app.

User flow across search, ticketing, wallet, history and profile.
User flow across search, ticketing, wallet, history and profile.

Wireframes

Wireframes — account, search, live map, stop detail and notifications.
Wireframes — account, search, live map, stop detail and notifications.

Design system

Nunito Sans, with Deep Space Blue as primary and Bright Yellow as the single action colour, plus charcoal, sky blue and scarlet for information and error states. Route cards, timetable rows and the ticket component are all built from the same tokens.

Design system — components, states and the colour roles behind them.
Design system — components, states and the colour roles behind them.

Brand

The wordmark keeps Solo inside BUS — the city name is the product name. A batik-derived pattern runs under the dark navy as a quiet local signal rather than a decorative one, and the yellow is pulled straight from the city’s own buses.

App icon on the home screen.
App icon on the home screen.
Brand applied to livery.
Brand applied to livery.
Onboarding — tap in, tap out.
Onboarding — tap in, tap out.

Interface

Live map with real-time position, stop detail with the full list of halte and operating hours, a wallet with top-up and transaction history, and digital payment through e-wallet or virtual account.

Route detail, schedules, wallet and payment.
Route detail, schedules, wallet and payment.
Home, transaction history and the live map.
Home, transaction history and the live map.

User testing

Testing with seven participants aged 19–27, grouped into route info, accessibility and design interface.

“Detailed and well-organised, easy to plan trips”Sabrina, 19
“Super easy to use, just like Google Maps”Fahmi, 27
“The scan button is strategically placed in the centre”Fahmi, 27
“The colour scheme isn’t intimidating. Everything looks clean”Selvy, 20
“Good and neat, but it needs a bit more fine-tuning”Calista, 20
What did they say — testing feedback by theme.
What did they say — testing feedback by theme.

The last quote is the useful one. “Needs a bit more fine-tuning” pointed at spacing inconsistencies in the transaction list, which went back into the system rather than being patched on one screen.