United Airlines:Internal Tool Redesign
As an embedded designer from the design agency, One North, I worked with the United Airlines Jet Team on the final redesign of their Advanced Passenger Information System (APIS). The project was critical in allowing lobby agents to follow complex and changing regulations when confirming if a customer has met all requirements for travel and can therefore be checked in to begin their journey. Reducing errors in the workflow has led to a reduction in fines to United Airlines and increased peace of mind for the agents and customers.
The Goal
How might we guide agents in a timely and accurate manner through complex layers of requirements and regulations when handling customers' travel permissions?
By guiding agents through form field errors and requirements then guiding them through government specific regulations, we are giving clarity to the agents and covering the gaps in knowledge for junior agents, ultimately reducing and eliminating costly fines for the airlines.
The Industry
United Airlines operated in a heavily regulated travel industry where combinations of individual exemptions along with destination government regulations can create many pain points for agents while checking in customers at the Lobby.
1
My Role
I was the lead designer for the final redesign of a critical feature for Advanced Passenger Information Systems (APIS) and baggage handling for United Airlines. This project will detail only my work with APIS.
2
The Team
The core product team consisted of the BA, Engineering Manager, Researcher, Subject Matter Experts (SMEs) who were senior agents in the field, and myself. We also consulted with the Facilitations Team who updated and maintained security codes within the backend system.
3
The Product
This project would be the 3rd and final version of APIS. Agents in international stations used the feature regularly for identifying requirements and restrictions for customer travel, and we were able to deliver an intuitive, guided experience for agents to resolve issues with reliability and accountability.
2
Duration
From start to finish the design and research process took two months. The app launched into Beta with only minor/known incidents, and moved to Production for over 360 stations globally just two weeks later.
APIS High Level User Flow
Challenges
APIS was primarily used by agents in the lobby checking in customers for international travel. They also had busy and slow times depending on how the flights had been scheduled. During busy times they needed to resolve issues with customer travel permissions as quickly as possible so that customers do not miss their flights and their connections.
1
Technical Limitations
2 separate tiers of alerts and security requirements led to consecutive user flows that agents had to resolve. In a typical user flow, agents must first submit the customer APIS (free from spelling and empty field errors), which then may return an Agent Override Alert (additional flags on required information or documents). Once they address or override the alert, they may submit the APIS again which will then be directed to the governing body regulating travel to the desired international destination. Then the governing arm of the destination may return requests for security requirements if needed.
This resulted in two issues overall we needed to address in the final redesign:
-
First tier, how to present first tier alerts (often multiple) that were categorized as Agent Overrides, like name mismatch, passport expired required, exit date required and prior to the first APIS submission.
-
Second tier, how to present Security Code alerts (usually only one) for agents to resolve.
2
User Experience
Lack of context particularly for new agents. In the legacy flow, agents were taken to a separate page. In the existing redesign, they were taken to a modal. Both versions failed to give agents the context of where in the form the issues originated.
Lack of targeted guidance. In the error messages, Agents were not given enough information to make informed decisions such that overrides were being given to passengers who should not have been given the permission to travel. If they selected the link that would direct them to more information, they would scroll through pages of content that was difficult to parse through when they were in a time crunch.
Agents felt they were caught in a loop. Due to multiple error and security tiers, agents felt they were addressing issue after issue with no end in sight.
3
Project Budget & Timeline
There were budgeting and timeline concerns given that this was the third iteration and needed to be the final iteration. When I joined the team, a redesign had been in development. It had been user tested, but for various reasons, the issues had not been addressed when it went into production, and those same issues arose in Beta as complaints from agents Beta testing in the field. I needed to move quickly to redesign the features and address those issues not satisfactorily resolved by the previous iterations.
Tier 1: Agent Override Alerts
This section will focus on Agent Override product design and processes. Security Code Requirements details will follow the Agent Override section.
APIS High Level User Flow - Highlighting Agent Override Alert stage of the user experience.
References
Different past efforts addressed only parts of the agent pain points and not the root of the pain points for the agents.
When I worked on the final iteration, I referenced the research conducted on the latest version of APIS. I also recalled a particular UI element designed by my colleague that could solve the problems with the multiple alerts present at the Agent Override tier.
Tier one - Legacy Agent Override Alerts
The legacy iteration of designs took agents to a separate page to correct all form issues. The existing redesign opened a modal for each issue. I believed that neither of these UX patterns addressed the core problems, that agents were taken out of context and not given enough information to make fast paced yet informed decisions.
Past Research for Existing Designs
I referenced research conducted with 8 agents with 1-35 years of experience in the field to make sure that we captured the positive and negative findings and that we fixed what was broken and kept what was working.
The past research showed that agents wanted more action oriented information and more specificity. They preferred that the fields that needed attention were called out, referring to a "smart" system.
Existing Validated UI Elements
A different designer had previously archived an exploration of permanent message carousels which had tested well in early iterations, but implementation for that project had been deprecated. I recommended we resurface this element as a solution for form field multiple alert handling for Agent Overrides.
Wireframes & Iterations Agent Override
I created variations on the permanent message carousels based on the work started by my colleague.
Variations:
Interactions
-
Fading cards vs. Chevron icons
-
Then Chevron icon only buttons
-
Then disabled buttons or removing the buttons altogether
-
-
Number counts vs dot UI
Visual Presentation
-
Stacked cards vs. Single cards
Expansion Defaults
-
Expanded
Automatic Interactions
-
Autoscrolling to the part of the form pertaining to the alert.
-
Adding form fields as needed directly into the customer APIS rather than interrupting workflows with a modal for each alert.
Usability Testing
I worked with the Researcher to conduct moderated user testing and followed up with A/B testing with a group of internal subject matter experts (SMEs).
1
Individual Sessions
Goals
-
Understand CSR’s current experiences when dealing with multiple notifications within APIS.
-
Identify usability challenges when dealing with a variety of errors in the APIS form flow that slow down our agents or cause frustration.
-
We needed to know preferences between three versions of the card UI treatment, two versions of the card counter, and introduced the autoscroll interaction that directs agents to the part of the APIS form requiring attention.
Demographics
-
8 agents total - 4 Junior, 4 Senior
Method
-
45 minute individual moderated usability testing sessions
-
Agents walked us through their APIS experiences, sharing:
-
Current problem-solving techniques when addressing notification errors when in or outside of Jet.
-
Their reactions walking through our new APIS experience within the Jet prototype, highlighting any missing functionality or information regarding navigating single passenger APIS scenarios.
-
Sentiment when comparing the new prototype to previous versions within Jet.
-
2
Group Session
Group Session
-
After conducting an initial round of testing, SME's were presented with 3 different variations of the Permanent Message Agent Override Alert UI to determine:
-
Which notification banner versions (cascaded card, single card, stacked cards) they prefer and would improve their experience.
-
General feedback on the updated notification banner design and functionality.
-
Survey results to determine clear path forward.
-
Demographics
-
45 SMEs (senior agents) total
Method
-
We followed the individual moderated testing sessions with 1 group session where we showed the 3 UI variations for the Permanent Message Agent Override Alert UI
Agent Override Research Insights
Agents appreciated having all notifications available, clearly identifying errors and being able to edit the form on one page.
Agent Override Research Topline
This research presentation was created by the researcher with me contributing feedback and additional formatting as needed.
1
Feedback Overall
Agents Value Streamlined Efficiency
-
Workflows that save time, minimize repetitive actions, and provide clear error resolution was consistently emphasized. Features like auto-scroll and compact multiple notifications were particularly valued for their ability to improve accuracy and overall efficiency in task completion.
2
Prototype Feedback
Permanent Message Carousel UI & Layout
-
Certain elements, like the number counter, were not immediate noticed by agents, so we made those semi-bold. Agents seemed confident they will be able to note the number counter now that they have been informed it is there to help them, which is similar to their experience with training sessions when they are updated about new features.
3
Recommended Iteration
Permanent Message Carousel Interaction
-
We ultimately continued with Chevron Icon only buttons and removed disabled buttons which were causing confusion.
-
Since sentiment was split 50/50 between the single card UI vs stacked card UI treatments, we went with the single card UI to save engineering time.
-
Agents really appreciated staying in the APIS form and autoscrolling to the relevant sections.
Final Designs
Tier 2: Security Code Requirements
This section will focus on Security Code Requirement/Alert details following the Agent Override section. It is possible that agents may only see a Security Code message after the first APIS Form submit, if there are not Agent Override Alerts to address.
APIS High Level User Flow - Highlighting the Security Code Requirements.
References - Security Code
While Agent Override alerts may happen frequently enough that agents have the necessary actions for the alerts memorized, Security codes, were infrequent and often came with many possible resolution paths depending on the destination and the customers unique circumstances. Options for actions available to the agent may also differ depending on whether the agent was a supervisor with security code override privileges or not. These were in place to protect the agents and the airlines from fines.
Layer two - Legacy Security Codes
The legacy designs treated the Agent override and Security Codes differently. Then the existing redesigns put both scenarios into modals. My designs would eliminate the use of modals that interrupted the agents' workflow and took them out of context.
Mapping & Templates
After further discussion with the Facilitations Team, who were responsible for updating and maintaining the Security Codes, it became apparent that we needed templated user flows for dealing with different types of Security Codes and what actions they required from the agent. This task had never been taken on despite how much it was actually needed for agent accuracy.
The BA, SMEs and I collaborated with the Facilitations Team to manually map the codes to user flows based on the variety of required actions and choices the agents are expected to handle. We also rewrote the copy to be more precise and action oriented to provide more specific guidance to the agents.
I made this visualization of the security codes to help with standardizing templates. We ultimately needed 7 total templates, which could also be referred to as user flow patterns for 34 unique security codes. The total number may have changed since more security codes may be added or changed in reference to different country's requirements, requiring that we also established a long term security code maintenance plan for mapping onto templates.
Wireframes & Iterations Security Code
We originally kept the designs in modals since it was only one security code alert and therefore only one user flow that agents were expected to complete.
Usability Testing
I worked with the Researcher on a research guide and with the BA on the testing demographics with international agents and agents in international travel hubs. I provided clickable prototypes.
1
Goals
-
Understand CSR’s current experiences when dealing with security errors within APIS.
-
Uncover opportunities for more guidance and accuracy for agents throughout single and multi-passenger flows.
-
Compare existing user flows and user experience to the new versions to establish a baseline.
2
Demographics
-
8 agents total - 4 Junior, 4 Senior
3
Method
-
45 minute individual moderated usability testing sessions
Security Code - Research Insights
Agents consistently preferred the prototyped workflows over what was live in production due
to their improved clarity and user experience.
Security Code Research Insignts
This research presentation was created by the researcher with me contributing feedback and additional formatting as needed.
1
Feedback Overall
Inconsistent Data Recognition
-
Agents stressed the need for reliable system that consistently recognizes updates the agents make and imports data correctly when scanning passports or travel documents. Confidence in system functionality is essential for them to efficiently resolve issues and serve customer effectively.
Need For Intuitive Tools
-
Agents highlighted the importance of intuitive features, such as banner errors and guiding agents through incomplete tasks. These features make workflows easier to navigate and reduce confusion during task completion.
2
Prototype Feedback
Review APIS & Continue Flow in the Security Code Modal
-
Agents intuitively understood the "Review APIS" button.
-
However, many also anticipated that clicking "Continue" would similarly return them to the APIS screen.
-
Some found the need to select continue introduced an unnecessary additional step.
"If the customer is eligible for military travel, then I will click the first button... Where it should take me to a place where I can enter the military ID number. "
– Senior NRT agent
3
Recommended Iteration
AU AAP Security Code Flow
-
Agents found the AU AAP flow intuitive and easy to understand, seamlessly navigating its steps as intended.
-
However, many were frustrated over the existing security protocol for lead sign-off, particularly given that leads are not always readily available. This could lead to operational bottlenecks and line backups, causing delays. Despite these challenges, agents anticipated the flow would direct them to a lead login for the necessary authorization.
"I get it, but needing a lead sign-off can really slow things down, especially when they're not around."
– Junior LHR Agent.
Iterations Security Codes
Our team was moving rapidly with many projects in flight simultaneously, but we were able to achieve alignment with other teams and new design decisions, even as we executed quickly on updates based on user feedback for the optimal user experience and consistency across the platform.
UI Limitations & Consistency
-
We reused components where possible and considered keeping Security Code flows in modals. But then the design system team created new parameters for the mobile modals, where the modal height should not exceed 50% of the screen.
-
Given the additional guidance copy we were adding for Security Codes, most modals were exceeding the 50% height limitation. I did a quick mockup exploration of what a two part modal may look like, but was concerned it would deprecate important information unintentionally by hiding copy on the second card, and create more work for agents to have to click through.
-
Similarly we understood after user testing that the CTAs to take agents out of the modal were creating uncertainty as to where agents would be taken after performing the steps required in the modal.
-
I realized we needed to shift to a similar format as the Agent Overrides, with permanent messages and dynamic form fields that appear in the customer's APIS. It was a solution that actually fit our requirements much better than modals ever did.
Compressed Timeline
-
We had tested the modal flow with security codes. But because we had tested Agent Override with the permanent messages, we were confident to move forward without retesting the flow and functionality.
Final Designs
Next Steps
The final redesign of APIS launched into Beta with only minor and known incidents. A short 2 weeks later, APIS moved to Production for all 360 stations at airports across the globe.
-
Agents can now address layers of Agent Override issues and security code issues in one streamlined interaction pattern that retains their context and guides them towards solutions while automating the tedious parts of their work with interactions like autoscroll.
-
Agents were better able to predict the time it would take to resolve issues for the customer by knowing ahead of time with the card counter, how many issues they need to resolve in the Agent Override layer.