Chuck McQuilkin

Southwest App Case Study

Redesigning the Southwest Mobile App

Southwest Mobile App

My role | 2014

  • UX design
  • Prototypes

Team

  • Kristin Landgraf, Design
  • Kyungsun Kim, Design
  • Brad Zabroski, Design
  • Shane Bbzdok, Design
  • Chuck McQuilkin, Design

As part of the southwest mobile app redesign, a key product feature from the roadmap was adding a way to facilitate rebooking repeat trips. We also needed to add the ability to use companion passes and airport maps. For the Southwest App, I worked on:

  • User flows
  • Android Wireframes

THE PROBLEM

The Southwest mobile app did not support Hot rebooking and Early Bird check-in.

THE OPPORTUNITY

The existing app did not allow authenticated users to save a flight search before purchase. A user who did not immediately book the flight they were researching would have to start their flight search all over when they finally intend to book. To solve this problem, I worked on the following:

  • Revised the booking flow for hot and warm users
  • Added a 'save flight for later purchase' link
  • Designed UI to prefilled passenger's payment information for hot users
  • Added EarlyBird Check-In to multiple touchpoints in the app
  • Streamlined Companion Pass user flow
  • Revised new account enrollment
  • Designed UI for airport maps feature

Exploration and Iteration

Whiteboard Sketch

White boarding helped work out the new flows

Original booking user flow

Original Booking Flow

The original user flow (above) featured a linear process from sign-in to booking confirmation.

Hot booking user flow

Revised Hot Booking Flow

Our revised flow streamlines the purchase process, allowing returning users to skip previously entered payment details and contact information.

Companion user flow

Revised Companion Booking Flow

Our revised flow streamlines the contact info needed for companion passes.

Sample Android Wireframes

Android Wireframes - Booking

I developed the Android wireframes for the booking redesign.

Android Wireframes

My Android wireframes also revised the account enrollment process.

Android Wireframes - Utilities

I also developed wireframes for the utility section of the iOS and Android app (Android above).

OUTCOME

Results and what I learned:

  1. It's OK to change the experience to conform to platform differences between iOS and Android
  2. Sometimes regulatory constraints like those from the TSA limit how designers can simplify a form or a flow.

Wireframes:

Southwest Checkin & Flight Status: Wireframes [PDF]
Southwest Booking: Wireframes [PDF]

#ui #interaction #mobile