The task

Usher in United’s airport kiosk applications to the brand’s new design system as quickly and efficiently as possible.

Old lobby kiosk start screen

New lobby kiosk start screen

My role

Recognizing a need

In 2017, United began a large-scale redesign and replatforming of its website and a modernization of its mobile applications. Working in tandem with this effort was a 2018 brand refresh. This undertaking involved years of work, which you can read about here, but finally, in late 2019, United’s design system stabilized. The only consumer channel that had been neglected was the airport kiosk application. I proposed that we bring it into the new design system so that we could create cohesion across all of United’s digital channels.

The challenge

The website redesign had included copy changes, functional improvements, flow changes, and backend replatforming. The app was also replatformed to a new codebase and, though flows and functionality stayed the same, it was given a frontend refresh: new UI components, typography, etc. 

There was no need to give as many resources to the kiosk rebrand. In the near future, United plans to make large scale changes at the airport that would replace kiosk devices and retire the legacy application.

The goal

With the lifespan of the airport kiosk in question, we simply couldn’t give it the same attention that the website and mobile applications had received. No replatforming. No UX overhauls. 

We needed to expand the rebrand into the kiosk with minimal intervention. And we needed to do it quickly.

The UI

UI element

Old

New

Primary colors
Secondary colors
Grays
Page title
Heading 1
Subheading
Body copy
Header
Buttons
Checkbox
Stepper
Toggle
Tabs

Execution

To make sure the kiosk rebrand aligned with the web and mobile redesign, I brought my design concepts to the brand and design system teams. We easily agreed upon a UI design and style guide, including component and color direction, and in January 2020, I presented plans to the development team. 

Working on the reduced scope, the development team was able to alter the CSS of common components, easily swap out images, icons, and colors.

We didn’t want to leave behind any custom components, so in February 2020, we followed that work up with an audit of the 300 pages that exist within the kiosk application. The rebrand was ready to go.

Transformation

Old

New

Cohesive check-in channels

Web

Kiosk

App

Impact

We were prepared for a Q1 release, but in March 2020, covid-19 put our plans on indefinite hold. In a global pandemic, it doesn’t seem wise to invest resources into a touchscreen kiosk, and we’re currently testing how we can apply this UI to the kiosk in a touch-free way.