Simplifying and modernising flight selection
2020 to 2021, British Airways
I led the redesign of British Airways’ iOS flight-selection flow as part of its new design language. Working alongside a designer and researcher, I owned the final concepts, refinement and implementation handover, collaborating with product, engineering and QA on complex itineraries, cabin choice and pricing.
Making complex itineraries clear at a glance
Flight information appeared differently across British Airways’ products, creating inconsistencies in hierarchy and legibility. I developed a reusable flight-card system that could stand on its own and scale across surfaces.
The card prioritised departure, arrival and duration, with expanded details connecting flight legs, layovers and airport changes. I worked through multiple airlines, overnight journeys, translated content and long currency values. Clearer copy and a single primary fare action made the choice easier to follow.
The itinerary hierarchy across mobile and desktop. Desktop selector shown as a design exploration.
Keeping cabin choice and price together
Across several rounds of testing, I worked with a researcher and writer to assess comprehension, discoverability and progression. An early approach pinned cabin choices above the flight list. Research showed that separating them from the prices made the relationship confusing, so I brought cabin choice and price together within each flight card.
Earlier exploration: cabin choices pinned above the flight list, separate from their prices.
Designing the transition from loading to selection
I defined loading, loaded and expanded states, helping establish how the new design language handled skeletons, page transitions and interaction animations. I worked closely with engineering through implementation reviews to refine the behaviour and details.
Comparing nearby fares without loading every date
Fetching every date and fare combination was expensive. We initially loaded the lowest fares for three days either side of the selected date, then fetched further three-day batches as travellers scrolled.
Establishing patterns through a shipped iOS experience
The complete flow shipped on iOS after I left British Airways, with the flight-summary pattern also adopted in desktop checkout. As the first full shipment of the new design language, it established patterns for flight information, spacing, typography, copy and motion.
The flight-summary pattern reused in desktop checkout.