BermudAir
Building the design system, booking experience, and mobile app for a premium airline launching from zero
| PLATFORM | Web + iOS / Android |
| TEAM | Design Lead (me), 1 Product Designer, Product Manager, Development team |
| DOMAIN | Travel / Aviation |
| METHODS | Competitive analysis, design system audit |
| TOOLS | Figma |
BermudAir is a premium airline operating flights between Bermuda and major US destinations. The company launched with no digital presence: no website, no app, no UI components. The project delivered three things: a marketing landing page, a six-step flight booking funnel, and a native mobile app.
The booking funnel covers location and date selection, flight results, fare options, passenger details, extras, and checkout. It also needed to handle two membership tiers with different payment logic: Standard pay-per-flight and Founders Club with prepaid credits. I led design across all three surfaces, working with one Product Designer, a Product Manager, and the development team.
Four constraints collided at project start. Each one was manageable alone; together they shaped every decision that followed.
- 01No design system
BermudAir had a branding guide but no design system or UI kit. Every component had to be built from scratch, for both web and mobile, before any screen design could begin.
- 02Brand colors failed WCAG 2.1
The brand's color palette, the only visual identity asset for a company about to launch, failed WCAG 2.1 AA contrast ratios. The colors could not be used as-is for any production interface without shipping inaccessible UI.
- 03Constrained booking platform
The website had to be built on an existing booking platform with limited customization. Layout and interaction patterns were constrained by what the platform could support.
- 04Two membership types, one checkout
Standard and Founders Club members had different payment logic (pay-per-flight versus prepaid credits) that had to be unified into a single checkout experience without adding friction for either group.
- 01Discovery
Audited BermudAir's branding guide against WCAG 2.1 AA. Mapped the existing booking platform's customization constraints by documenting what layout and component patterns it could and could not support. Analyzed competitor airline booking flows to identify conventions passengers already understood, patterns we could rely on rather than redefine.
- 02Design System Foundation
Built an accessible design system from the branding guide up. Adjusted the brand color palette to meet WCAG 2.1 AA contrast ratios while staying within the same color families. Created a component library in Figma covering both web and mobile: typography scales, color tokens, form elements, buttons, cards, and navigation patterns, so that all subsequent screen design could work from a shared, consistent base.
- 03Web Booking Funnel
Designed the six-step booking flow within the existing platform's constraints: location and dates, flight results, fare selection, passenger details, extras, and checkout. The checkout step required the most careful design work: Standard members pay per flight while Founders Club members draw from a prepaid credit balance. These two flows had to share the same structure so neither group encountered a materially different experience.
- 04Mobile App Design
Translated the web booking journey into a native mobile experience. Adapted layouts for touch interaction and smaller viewports, restructured multi-column elements into single-column flows, and ensured tap target sizes met accessibility guidelines. The design system component library provided a consistent vocabulary across both platforms from the start.
- 05Delivery
Prepared annotated specs for web and mobile and handed off to the development team. The design system served as the single source of truth across both platforms: every component, token, and pattern documented in Figma with usage guidance.
BermudAir's brand colors failed WCAG 2.1 AA contrast ratios. The branding guide was the only visual identity asset for a company preparing to launch. Changing the colors risked misaligning with a brand the marketing team had already approved and was using in materials already in production.
Use the original brand colors as-is, compensating with larger font sizes and heavier weights where contrast failed. Preserves exact brand alignment but ships interfaces that fail accessibility standards for body text and interactive elements.
Propose entirely new colors to the client. Guarantees accessibility compliance but risks delaying the project and conflicting with marketing materials already in production, potentially triggering a rebrand conversation the timeline could not absorb.
I adjusted the existing brand color shades (darker or lighter variations of the same hues) to meet WCAG 2.1 AA while staying within the same color families. Presented the adjusted palette alongside the originals to stakeholders with contrast ratios annotated for both. The shift was imperceptible without a direct side-by-side comparison. Stakeholders approved the adjusted palette in the same meeting. No rebrand negotiation, no timeline impact, and the product shipped with accessible color contrasts from day one.
BermudAir launched with a complete digital presence built on an accessible design system. The system served as the single source of truth across the landing page, booking funnel, and mobile app, ensuring visual consistency across all three surfaces from day one. The adjusted color palette met WCAG 2.1 AA without requiring a rebrand, and the booking funnel handled both Standard and Founders Club payment flows in a unified checkout experience. Starting from no UI components, the project delivered a working design system, a six-step web booking funnel, and a native mobile app.