Flight Booking Interactions.
Interaction Design
Many Airlines these days are going for the self-service approach, replacing service counters with automated kiosks. Online check-ins have made the boarding process fast and convenient.
As many travellers use mobile platforms to complete their transactions, being able to provide organic, intuitive interactions between the user and interface makes a big difference in user experience.
Identified Deficiency - Disconnected User Flow
Currently on many travel application, when user complete a flight search heading to finish booking, it's usually a multiple-page process. Where flight detail on one page, payment options on the next page, order confirmation jumps user to another page. When the booking process is complete, user receives a email in the inbox. And when traveller arrives at the airport, the person still need to use an automated kiosk to have the boarding pass printed.
These series of steps require user to switch between multiple individual applications. Each application uses distinctive interface, interaction that requires a learning curve to users in order to master the process, which could lead to confusion, frustration and human error.
Proposed Solution -
Integrated Booking Experience
To tackle the deficiency identified above, my solution is to simplify, integrate the booking process into intuitive interactions.
1. Visibility of system status
7. Flexibility and efficiency of use
- Jakob Nielsen's 10 Usability Heuristics
First off, starting from the flight detail page, payment options are appeared on the same page with flight detail. Users can get a double-check before heading to payments, this way reduces the chance of confusion.
Type of Interaction: #Vertical Scroll, #Horizontal Scroll
4. Consistency and standards
- Jakob Nielsen's 10 Usability Heuristics
When user have chosen the payment method, in this case, we use ApplePay as an example. Standard ApplePay interface appears from the bottom, providing a familiar interface that is consistent across all ApplePay-enabled application.
By using a consistent payment interface that is widely used on all Apple products, users can complete action much faster, without wondering about the words, buttons and actions.
Type of Interaction: #Vertical Scroll, #Touch ID, #Vibration feedback
1. Visibility of system status
2. Match between system and the real world
8. Aesthetic and minimalist design
- Jakob Nielsen's 10 Usability Heuristics
Alrighty! User have now successfully booked their flight. What more can we do to speed up their journey?
Currently, booking confirmations are nothing more than an email that looks like something printed from a typewriter in 1960s. And online checkin means user have to go somewhere else, entering name, flight number, booking reference, again.
With all the information already available, why not to generate the boarding pass so user can have it right away?
On the final screen, on the top-left corner, "Ready to go" and "your flight is booked" are there to indicate the status of process for the user, which helps users understand their booking is complete. The digital boarding pass mimics the printed boarding pass. When the user is at the airport, a simple scroll on the screen, the boarding pass will become fullscreen and ready for the scanner.
Type of Interaction: #Vertical Scroll, #Scale, #Opacity
Rationale
Although travel is always exciting, planning a travel and keeping everything organized can be a big headache for some people. For a-little-bit-OCD person like me, I always plan my trip down to hours, double check, triple check my flights, hotel reservations, make sure I have a plan B, or even plan C and D. Having to do all those things between multiple sites, master all kinds of payment portal, carry tons of paperworks is extremely painful.
As a trained IxD person, I always think, will there be a well integrated, intuitive interaction that can save me from my OCD? Something that allows me to “book-and-go” in one place, scan the digital boarding pass and I will be on my way, simple as getting a cup of coffee at Starbucks.