STARLUX's New Booking Experience — Designed for iOS and Android
STARLUX is positioned to revolutionize the passenger experience with its comprehensive online service in Asia. This project encompasses various aspects, from brand identity to user experience, all aimed at shaping an unparalleled future for its passengers
Role
Lead Designer
Industry
Aerospace
Duration
Dec 21' — Jun 22' (6 months)
Core Responsibilities
Lead designer in team of 2, product strategy, research and mapping, IXD, visual design, illustrations/icons, prototyping, QA assist
Insights &
Scope
STARLUX is seeking to create a new mobile online booking experience. Having recently launched their business during Covid, they are now gearing up to expand in the near future
Core value — distinguishing itself from other airlines, it aims to pioneer the future of flying experiences
Place customer needs and service quality as top priorities
Planning
& Scoping
Design Process — Emphasize, Define, Ideate, Prototype and Test
I start by defining the user and collecting the information and move through the process to an end solution.
The process used here is a 5 stage process
This is the design process I followed for this project
Emphasize
First step: emphasizing and analyzing
Emphasize & Competitive Analysis
I conducted a competitive and feature analysis of the flight booking platforms in the market among Asia and Pacific areas.
Looking directly at competitors of Airlines in Asia and Pacific, most sites are geared towards functionality and are focusing on the web version instead of mobile.
User Analysis
Next, I conducted 3 user interviews, and though I wish I had more participants, I still gained a lot of insights into the booking experience in Asia.
Users in their 20s to mid-30s seem to have a bit of trouble when it comes to booking flight tickets. They've run into issues with prices, found the user experience a bit tricky, and struggled with technology along the way
Define
Second step: creating persona and defining a problem statement
Creating personas involves envisioning the individuals for whom you'll be designing. I've categorized them into three sections: goals and needs, motivations, and fears and frustrations.
Persona — Meet Emma. She lives in Hong Kong as a interior designer, and loves traveling around the world
There are four feature actionable sections to help users to go through the tutorial.
Problem Statement
I deduced that the users need help creating a better experience with less cognitive load and would like to have features that can remind them about their upcoming trips.
"How can we assist people in experiencing a seamless booking system, from purchasing tickets to boarding the plane?"
"How can we increase engagement and interaction through out the app?"
Ideate
Third step: creating wireframes and building the design system
There are two journeys to follow in the frames: onboarding and making sure to follow the eye movements
Asking ourselves: 'How can we organize information with low cognitive load?’
The Design System & Icon Collections
We built a design system based on STARLUX's basic brand guideline, including typography usage, assent and secondary colours, and background colours.
Prototyping
Fourth step: start with the prototype
As users enter the app, prioritizing a seamless and user-friendly experience is crucial to encourage their engagement and smooth progression through the next steps.
In the upcoming phase, customers will only be required to provide their email for confirmation. The initial two steps should be straightforward and direct, designed to retain users within the app. Furthermore, each page should request minimal information, providing users with clear and concise guidance.
Our ongoing challenge is to figure out: "How do we arrange information so users understand it right away?"
To address this, we employ elements such as cards, colour schemes, font sizes, and visual hierarchies to strategically position items. The highlighted boxes represent our primary focus areas, capturing users' immediate attention.
Leveraging colour hierarchy and organize information accordingly
For example, prioritizing important information such as city, airport, terminals, and time on this boarding card helps reduce cognitive confusion.
Make it simple by using airport code (ABA)
For example, using a short blurb for the tab title and specifying information underneath helps users process information easily.
Reflections &
Feedback
Over 500+ downloads in first week.
A 20+% sales jump in mobile ticketing, and seeing huge increase of people using mobile boarding at airports
View Something Else