United Airlines

UX Lead. Designing Aero; software for Agents to manage flights and passenger information around the world.

2014 United Airlines decided to move away from SHARES (a command-line interface) to Aero (GUI). SHARES was hampering their ability to keep talent because it is very difficult to learn. We were working under a literal “No More Tears” initiative; less agents calling in sick or leaving work crying.

Project Goals

  • Create a fully functioning GUI that utilizes the back end functionality of SHARES
  • Consolidate all Agent tools under one banner - Aero
  • Design to meet the needs of global office environments; including Agents without mice, low light scenarios, black and white monitors, and more.
  • Decrease the Agents’ average handle time (AHT)

Team Overview

United’s Airport and Contact Center agents partnered directly with the Critical Mass team and created a collaborative relationship that allowed us to help shape the user experience by working directly with the actual end users and their invaluable insight.

My role

UX Lead

My responsibilities

  • User interviews
  • Requirements gathering
  • Process flows
  • Presentations to United
  • Work within, and help create, a Design System
  • Consult through QA and Development
  • Manage a UX team of 3

Design process

This process is simplified due to each project having its own specifications and needs. No project has been purely linear for me; instead they are a web of relationships that impact one another in complex ways.

However, most projects align to the following steps.

1. Understand the problem

Discover, Define

2. Design the experience

Design, Feedback, and Iteration

3. Deliver a solution

Develop, Deploy


1. Understand the problem

  • User interviews
  • Requirements

We spent a few days a week at Willis Tower talking directly to the Agents. Their knowledge and passion was invaluable; from gathering requirements to validating workflows and designs. Much of the work was very technical and rich with terms used by experts in the field (Deadhead, Ghost seat, PNR, SSMF, FLIFO, etc). We became proficient in both terminology and airline workflows in order to design best-in-class solutions.

User interviews

I would sit with the agents, listening to them describe the feature, explain pain points, and provide potential solutions for the problems. We would document their frustrations and then translate their needs into a UI through the design process and our knowledge of best practices.

Requirements

I partnered with a team of Business Analysts and we would walk through hundreds of requirements, line by line, with a room full of agents, technologists, product owners, and designers to validate and fully understand every piece of the problem we were aiming to solve. This was an instrumental part of the process for me, as it would establish scope, feasibility, and my parameters for what pieces of the feature were flexible and what needed to move into Aero exactly as is.

United Requirements for Messages feature This example is for leaving Messages for other agents regarding Customers. A smaller feature, this spreadsheet has over 100 requirements.

Result

Hearing the problem from the people who experience it themselves is an awesome way for me to gain the context I need to start designing. It also makes me more invested because I have an emotional attachment to the solution. I’m not just trying to update Seat Map functionality, I’m trying to help Mary Pat and her team provide a pleasant experience for thousands of travelers.


2. Design the experience

  • Internal kickoff
  • Prototyping
  • UX Design reviews

Internal kickoff

I would come back to the Critical Mass office and meet with our team; Art Director, Designers, UX, Front-end Dev, PMs, and more as needed. This is where I would recap the Problem, lead internal sketching sessions, collaborate early and often with Design and Development, and establish my plan for solving the problem.

Prototyping

I did all of my wireframing and annotations in Axure. I delivered high-fidelity prototypes to gain sign off from the client. The prototypes also acted as a companion piece for Dev. Axure’s Specification Document served as our annotations document, which was included with many deliveries (until we discovered the prototype was more valuable and easier for downline team members to consume).

United prototype FLIFO (Flight Info) in Axure being created and then shown on the web with instructions for the scripted experience

United annotations Partial pages from the 66 page Seat Map Thru Functions annotations document

UX Design reviews

I would travel to United’s offices for in-person presentations a few times a week. It would be my responsibility to recap the problem, provide context, and sell in how the UX would solve user needs, business goals, and also be technically feasible within the timeline. These design reviews sometimes became collaborative sketching sessions in order to quickly work through a problem.

United Sketching for seat map Various sketches from the Seat Map feature. This was very complex and our solution needed to be bullet proof. Spoiler: It was.

Result

Because we were building a UI from scratch for a user base that had little-to-no familiarity with UI’s, the Axure Prototype proved invaluable for showing the Agents what Aero could actually do for them. We were able to define each click, each interaction, see how it would impact other areas of the interface, and ultimately get confirmation for a feature “sign off”, which would allow us to move into the next phase of the Waterfall.


3. Deliver a solution

  • Visual Design reviews
  • Design system
  • QA

Visual Design reviews

I would work as a supporting role through the Visual Design phase, sitting in on those meetings to help bridge the gap between conceptual wireframes and the finalized designs. If any changes to the requirements would come about, I would lead live sketching or negotiate a solution as quickly as possible to solve the need.

Design system

I was part of the team that organized and defined the schema for the Design System documentation. This deliverable included style guide elements, components, and documentation for a plethora of difference scenarios that could occur in the airport environment. We would lean on this document heavily in order to maintain a clean, organized, and efficient structure for Aero.

Areo design system The master files were in a PSD that would be circulated as PDF.

QA

CM’s developers were the arbiter of functionality - we passed our front end code directly to United (who was responsible for all of the back end code). Before CM developers would submit their build, UX and Visual Design would review, collaborate, define updates, and then give approval. This was a crucial step in ensuring the vision defined in the earlier phases made it through into Aero production.

Result

We were able to sit in from User Interviews to Code Reviews and ensure that the initial vision, defined by the Agents, was correctly executed. The Design System was also helpful in allowing team members to roll off and on without losing momentum.


Final Result

It is very rewarding to know that the work I was doing was having a positive impact on 20,000+ agents worldwide. I remember flying United and asking a Gate Agent about Aero. She seemed confused, but not unhappy, when I told her that FLIFO was going to be released soon. 🤷‍♂️

Years later, Aero is still being worked on and improved. For my part, I was able to help with 25 full features that touched every aspect of the customer journey - from booking to seat changes to irregular operations, to contacting support.

UI - Before the Design Process

A collection of different tools that we had a hand in moving from their native environments over to Areo.

SHARES interface SHARES, the command-line interface that had been around since the 1970s. Responsible for being the backbone of an airline and for countless hours of agent frustration

SHARES interface EZR, a dated interface that Call Center Agents used to modify customer reservations, usually while on the phone with the customer.

SHARES interface


UI - After the Design Process

The output of months of collaboration and hard work.

Aero seat map An example of Aero with the interactive seat map.

Aero seat map Aero’s FLIFO (flight info), come to life through art direction and design

Aero seat map An example of Aero from the Contact Center Agent’s perspective.


Wins

  • Created a GUI where only command-line existed before
  • Earned the right to bring EZR, MileaguePlus, and Booking into Aero
  • Helped to establish the first Aero pattern library
  • Consistently released Aero updates on time, worldwide
  • The Agents we worked with referred to our team as “The Goodness”