app icon


Flight Booking App Design Concept

holding device


In order to simply people’s global lifestyle, our project will solve premium travellers’ problem of booking flights which take times and lack of privacy by giving them an app, WiseFlight, which knows their need to replace the secretaries and travel agencies and enable them to book flights within few mins.

• • • • • •

24/7 Realtime Assistent
Provide thoughtful services, useful info and help according to different scenarios and your command.

Simple and Fast Booking
Simply the flow of booking flights, including flight selection and payment to save their time.

Select for You
We know the customer’s behaviors and preference according to the data we collected and analyzed.

One Place for All Things
Boarding pass, the miles your earned and receipts are stored in the apps.


27 Oct - 5 Nov 2017

My Role

Interaction Design
Visual Design

Day 1-2 - Research and Interview

Investigate user behaviors and thoughts

Why I Interview

Talking to your audiences is the fast way to know what they are thinking about. It is impossible to design a product when we do not know our users and what problem we want to tackle.

How I Conduct

I post the interview message on my Facebook to recruit interviewees who have booked business or first class flights for their bosses or themselves and interview with them within one day and interveiw them via Skype or Messanger.

Worthy of note, the business and first-class travellers may not book flights by themselves. 4 of interviewees have booked economy and business class for themselves; 2 of interviewees have booked flights for their bosses. I list some questions for the semi-contracted interviews.

Because of limited of time, I do not have many candidates and have no chance to talk with agents and bosses whom their secretaries have booked for.

The interview questions are focused on the experience of booking a flight, including the process and how and why do they choose a flight. You can click here to access the details of interview questions and notes.

What I Find

  1. Departure and arrival time are the most important factors of selecting flights. The prices are the second factor.
  2. "I would select the best one according to time and fare. The arrival time is main consideration. If the time is bad, no matter how ticket is cheap, we still won’t select it." - Cathie

  3. Business class travelers usually select the same airline company because earning miles keeps their royalty.
  4. "My boss prefers China airlines because he has a credit card, HSBC China Airline Infinite Card, which be used to accumulate miles." - Cathie

  5. Customers choose business class because they want to get enough rest on the plane, especially when taking a long-haul flight.
  6. "If it is a long-haul flight, like from HK to the US, I will book a business class and non-stopped flight because I want to get rest." - Kang

  7. They book flights via travel agencies to avoid any possible inconvenience. Travel agencies have their personal info and preference and that save time to book flights.
  8. "I usually ask a travel agency, Lion Travel, to help me book flights because they know which seat is better and they can fix all problems fast. For example, if my name is spelt wrong, they can correct it immediately without extra charge or if my flight is cancelled, they can arrange another flight for me." - Ms. Shen

  9. use free transport service provided by credit cards to the airport. They will reserve the service after flights are confirmed.
  10. "I will serve the transport service provided by my credit card to the airport. It’s free for 4 times within a year because I spent over 1million NTD last year. The credit card also provides cheap transport service even you take a ride over 4 times." - Ms. Shen

  11. Experienced travellers are quite familiar with cabin features and not care too much about meal.
  12. "Basically I will sleep directly after boarding, so I do not care about flight food. I usually skip the first meal." - Carol

  13. There are lots of steps when the travellers ask their secretary and agent to book a flight and that would waste much time.
  14. "I make a call, email or use message app, Line, to tell the agency my requirement, like time, date, name and cabin class. My agency know my personal info, so they will ask me who will take the flight at first. ... They will send me an email with the flight info. If everything is OK, I will send my authentication letter of credit card payment to the agency. After payment, they will send me the electronic ticket. The travel agency will give me a receipt showing how much spent which I can give it to my accountants with a payment request form." - Ms. Shen

The user flow of Booking a flight

Ask a secretary

  1. A traveller tell his requirements to his secretary
  2. The secretary contacts with a travel agency
  3. The agent searches flights and sends results back
  4. The secretary selects and confirms the routine
  5. The agent sends a authorization form of credit card payment
  6. ‎Fill in the form and send it back
  7. ‎Tickets are issued and sent to the traveller/secretary
  8. ‎Add flight info to their calendar
  9. The secretary reserves transport service

Ask a travel agent

  1. Tell an agent requirements
  2. The agent searches flights and sends results back
  3. Select and confirm the routine
  4. The agent sends a authorization form of credit card payment
  5. ‎Fill in the form and send it back
  6. Tickets are issued and sent to the traveller
  7. Add flight info to their calendar
  8. Reserve transport service

By themselves

  1. Search travel related information
  2. Book flights on the airline official website
  3. ‎Issued tickets are sent to the traveller’s email address
  4. ‎Add to calendar
  5. ‎Call for transport service reservation

Day 3 - Direction and Product Thinking


Some Rough Thoughts

From the research, premium customers may ask for assistants to book a flight for them or book by themselves. Whom the app should be designed for? I also find premium customers use message app to communication with agents. Maybe I can design a chatbot which can help users book a flight or provide useful information. Should the app be as an individual app or based on Messenger/Whatsapp?

Should The app be designed for assistants
or premium customers?

For Asistents

1. How can we make money? What the business model will be?

For premium customers

1. Replace the assistants and travel agencies, simply the flow of booking flights.
2. The flight info just are kept in the premium users’ mobile phone.
3. Collect the valued data from premium customers.
4. Cooperate with airline companies provide customized services (eg. in-flight sales).
5. Provide travel insurance services.

Should chatbot be built on Messenger/Whatsapp
or an individual app?


1. Users are not required to install another app
2. Users are familiar with the app and the learning curve will be flat
3. The cost of time and money may be less


1. If we want to collect users data, it may have some restricted.
2. Restricted by the apps, their terms and policies may be changed.


Product Thinking

After thinking, I select Business Travellers, age 35-50 because people at this age may have successful careers already, have nice income and are not afraid of tech staff. We will have opportunity to earn money via providing excellent services.

Day 4 Visual Style


Color Scheme

Collecting images which represent luxury, elegance and executiveness. Dark indigo and rose golden are selected as main color scheme.


Visual features

Using serif font on titles to create sense of elegance; the golden lines to repesent luxury. Emphasizing the details on light and shadow of objects to create paper texture.

Day 5-9 Ideation and UI/UX Design


Side Menu

In order to emphasize and encourage user to use our smart chatbot, WiseAssistent, I adopt a navigation drawer. Besides, those categories have specific purposes during different phases, users would not switch views from different categories freguently.

iOS screen


WiseAssistent - Booking a Flight

WiseAssistent knows your preference and recommends the flights according to your past booking history. It also will help you to reserve a seat, add flight information to your calendar and provide credit card service information after booking.

iOS screen
iOS screen
iOS screen


WiseAssistent - Packing Suggestions

When depart date is coming, WiseAssistent will remind you to pack your baggages with useful information, like baggage rules, weather prediction and clothing suggestions for the trip.

iOS screen
iOS screen


WiseAssistent - Check-in and Bording Pass

WiseFlight reminds your online check-in while 48 hours before departure. WiseFlight knows you just arrived the airport and pop up the boarding pass for you.

iOS screen
iOS screen


Booking a Flight - Explore

WiseFlight knows your current location and provides some destinations for your weekend trips or your future vacations. The topper background image and location hint text in the search bar changes every 5 seconds.

iOS screen
iOS screen
iOS screen


Booking a Flight - Search

You can select dates and cabin classes. Your preference will be saved for the next booking. According to the earlier research, business class travellers usally choose specific airlines, so the filter is provided if business class is selected.

iOS screen
iOS screen
iOS screen


Booking a Flight - Results

Accroding to the research. Departure and arrival time and price are the most important factors for travellers, so the information is highlighted. In flight details screen, I use icons to represent the in-flight services to save spaces. Because frequent travellers have been familiar with the cabin, services and may not care about the meal too much, so those detailed information are put in the deeper level.

iOS screen
iOS screen
iOS screen


Booking a Flight - Passenger Details

WiseFlight keeps your information, so you do not need to fill in your personal information unless your personal information changed. There are step indicators above the continue button letting users know how many steps left.

iOS screen
iOS screen


Booking a Flight - Payment

From the research, travellers usually use the same credits, which can be used to accumulate points for exchange extra services. So I do not provide lots of creadit cards for users to select here, but I keep the flexibility in using different card and decide if they want to replace old card by new one.

iOS screen
iOS screen


Booking a Flight - Booking Confirmed

Using big font and tick icon let users can easily know they completed the booking. Booking number is also shown for the case when users have questions and need it to easily get help.

iOS screen
iOS screen

Day 10 - High-Fidelity Prototype

Using Principle as a prototyping tool to design the transitions and communicate the user flow.