United Airlines Seatback App Design System:
Establishing the foundation for United’s next-gen
in-flight entertainment experience
Client
United Airlines / In-House Design
Date
Fall 2023 - Fall 2024
My Role
Senior UX Designer and Delivery Lead on United's In-Flight Entertainment team. Led the creation of a custom, dark-mode design system for the Android-based seatback app, aligning with United’s brand and system standards. Worked cross-functionally with developers, design system stakeholders, and product owners to define components, enforce accessibility, and deliver scalable design artifacts in Figma.
Project Overview
United Airlines, in partnership with Panasonic, is deploying a new Android-based seatback app to deliver seamless, touch-based in-flight entertainment across more than 400 aircraft. This experience extends the functionality of United’s mobile app and is designed to provide a cohesive user journey from ground to air.
When I joined the team, the project was still in early exploration and lacked a formalized design system. My role was to bring clarity and structure to the design while ensuring scalability, accessibility, and alignment with United’s visual language and the technical constraints of in-flight hardware.
The Challenge
Transitioning United’s mobile design system to a hardware-based Android environment introduced unique challenges. Screen types, resolutions, ambient lighting, and in-flight use cases required rethinking components and interactions. Early design work lacked cohesion, creating confusion and technical inefficiencies. A key decision was whether to retrofit existing elements or build a new system from scratch, all while supporting active sprints and ongoing feature delivery.
To ensure scalability and efficiency, we focused on technical feasibility, smooth design handoff, and easy onboarding. The system also had to be built entirely in dark mode to support passenger comfort in low-light cabins, shaping decisions around color, contrast, and component behavior from the start.
Should we utilize elements of the system and try to rename and relabel, or should we just start from scratch?
How will a new, dark mode only system maintain United brand styling?
Would this new system work for the developers more than previous iterations?
How might we ensure that the learning curve for new developers and product designers remains low as they begin to use this new design system?
Can we utilize Figma as a software to the best of its ability in order to create an easy and intuitive process?
The new dark mode design system was created to be deployed across 400+ aircraft on the United Airlines fleet.
The Solution
The new design system was built and tailored specifically to the constraints and opportunities of the seatback platform. This gave us the flexibility to address core usability issues, prioritize dark mode patterns for cabin environments, and ensure accessibility compliance from the outset.
Key process highlights:
Audit & Research: Assessed the existing mobile system and documented mismatches or limitations within the new platform context.
Collaboration: Worked closely with United’s in-house systems team to align component nomenclature and structure while allowing for seatback-specific variations.
Component Creation: Designed foundational atoms (e.g., buttons, typography, icons), molecules (e.g., cards, menus), and templates—optimized for both dark mode and accessibility.
Figma Systemization: Leveraged advanced Figma features like variants, auto layout, and component properties to make the system modular, scalable, and intuitive for future contributors.
Developer Handoff: Maintained constant communication with engineering, aligning token structures and validating build feasibility early and often.
While the system is still evolving, it has already dramatically improved consistency, speed of implementation, and confidence across the design and dev teams.
Android screen density pixel challenges
At the start, the design system focused on varying screen sizes by cabin and aircraft. Collaborating with engineers, I refined the approach to use proper density pixels that scale effectively across the fleet.
Building Blocks of the New System
The new IFE system can accommodate a variety of customer decisions and purchases, from seat upgrades to trip booking.
Design system in action on future flights
Drafts of current and future screens utilizing the new dark mode design system
Results
The design system is currently in active use, streamlining UI development and reducing ambiguity in handoffs. Early feedback from designers and developers has been overwhelmingly positive, citing ease of use and clarity as major improvements. The system will continue to scale alongside new features, ensuring United can deliver a premium and cohesive in-flight experience as the seatback platform evolves.