Behind the Booking Flow: A Small Sliver of a Big Redesign
Design decisions, lessons learned, and details that made the biggest impact.
Professional Project for:
Role: UX/UI Designer (Individual Contributor)
Team: Small in-house design team
Platform: iOS & Android
Timeline: 2 Years from Ideation to Release; 3 Month Design System
My Contribution:
As a UX/UI designer on a lean internal team, I contributed across the full app redesign, with a primary focus on improving the seat selection experience. This project gave me hands-on exposure to the entire product design lifecycle — from early research and IA exploration to visual systems and competitive analysis.
Though not the lead designer, I played a key role in shaping critical parts of the experience. I collaborated closely with designers, researchers, and product leads, participating in research synthesis, design critiques, and cross-functional decision-making. This experience deepened my skills in both user-centered design and strategic product thinking.
Overview:
Frontier’s mobile app hadn’t kept up with traveler expectations or the evolution of the brand. It lacked structure and clarity, and didn’t reflect the bold, unbundled nature of Frontier’s ultra low-cost business model.
This redesign was an opportunity to rethink what a ULCC experience could look and feel like — giving travelers more control, reducing friction, and creating a more modern, mobile-first journey from booking to boarding.
Writing about a project of this scale isn’t simple — there were so many moving parts, and my role shifted as different parts of the app evolved. For this case study, I’m focusing specifically on the booking flow, which was a big part of my focus throughout the project. Within that, the seat selection experience was the piece I fully owned from start to finish.
Of course, the bigger design themes carried through the whole app — but this story is about how we brought those principles to life in the booking experience, step by step.
Establishing a Foundation
Research and Discovery
Qualitative Research and Connecting with Skakeholders
By the end of 2023, our researcher had compiled stacks of documentation — like the example you see here — filled with rich qualitative research insights.
Our discovery phase was driven by deep user and stakeholder research. A dedicated UX researcher conducted extensive usability testing on the legacy app, stakeholder interviews, and conversations with loyalty members. These efforts uncovered key pain points and user needs, shaping the foundation for a more intuitive and user-centered redesign.
Bridging Research and UI: Identifying Key Areas for Improvement
There was a disconnect in accessibility
The previous app was using font sizes that were far too small for even those with average vision.
Inconsistent Branding and Mismatched Patterns
Imagery and iconography was outdated and all over the place.
Some icons were only used on the app and no were on the website
The icons used on the website were too detailed, dramatically varied in size and
A booking flow that created doubt instead of confidence
The third-party company managing Frontier’s app was no longer aligned with the company’s evolving needs. While I say that with respect, it’s simply the nature of the business at times. It was the right moment for a refresh—one led by a team closer to home.
A Constant Race with Competitive Analysis
Every step of the booking process went through a thorough comparison — we broke each part of the booking flow process down piece by ui piece. Our stakeholders were really interested in how other airlines were presenting and representing their products down to every detail.
Note: These are some of the oldest screenshots we have and do not come close to the amount of airlines we have looked at overall.
Booking widget
Seats Flow
Bags Flow
ULCC with Ambition: Learning from Legacy Discovering Breeze Airways — To inform our flow design we looked closely at both ULCC (Ultra Low-Cost Carrier) and legacy airlines experiences. While our stakeholders often pointed to United as the gold standard — emphasizing its polished, full-service app experience— we also looked closely at peers within the ULCC space. In particular, Breeze stood out as a modern benchmark, spectrum — from Delta and United to Breeze and Spirit— Identified opportunities to elevate Frontier’s digital experience while staying true to the ULCC model.
Understanding Our Travelers
To ground our designs in real traveler needs, our team ran a series of FigJam mapping sessions to better define the range of customers we serve.
We used sticky notes to explore different behaviors, mindsets, and travel habits — capturing everything from frequent flyers to first-timers, and everyone in between.
What we mapped:
Travelers who pack light vs. those who bring lots of extras
First-time flyers vs. loyalty members with elite status
Customers who fly Frontier frequently vs. those who book once in a while
Anonymous, one-time buyers vs. high-value repeat customers
Once we had this big messy wall of sticky notes, we organized our insights into a few comprehensive reference tables. These helped us clarify who we were designing for at each step — from booking add-ons to seat selection — and made it easier to check that our flows worked for the wide range of Frontier travelers.
Discovering New Colors and Typography
Collaborating with Marketing and Developing The Design System
Exploring the Visual Direction:
While redesigning the app, we were also working on Frontier’s new website — so our early design system exploration needed to support both at the same time.
We collaborated closely with marketing to align on brand colors, typography, and tone. At first, it was intentionally messy: mixing and matching palettes, testing fresh type combinations, and experimenting with styles that could feel modern yet still “Frontier.”
Designing the app and website side by side gave us helpful cross-references. It made clear which elements needed to stay consistent and where we could adapt things for a better mobile experience.
Building Frontier’s First Design System
When we redesigned the app and website, we built Frontier’s first design system from scratch — giving the digital experience a clear, unified foundation for the first time.
Key highlights:
New typography: We paired Poppins (body text) with Montserrat (titles).
(Montserrat, inspired by old Buenos Aires posters, adds bold character while Poppins keeps longer text clean and readable.)Fresh color scheme: Designed for clarity, consistency, and better accessibility across mobile and responsive web.
Cross-platform: Everything was built to work seamlessly for both the app and the new site.
—To the right is a collage of the screens I contributed to during this redesign.
I’ll go deeper in another case study — covering the components I created, what I learned about building and maintaining a system from scratch, and how we kept it strong over two years across multiple platforms.
Design Iteration
Gray-scale to Hi-fidelity with a Few Curve-balls In-between
Wire-framing & Early Ideas
Once we had our design system basics in place, we built out a simple wire-framing kit to explore different ideas quickly.
This phase let us test layouts, flows, and interactions with low effort — so we could see what worked, what didn’t, and what was worth pushing further.
We eliminated a lot of concepts early on, but wireframing also gave us space to play. One of my favorite “wacky” experiments: adding a few animal icons into the traveler information screens. They were meant to be tiny moments of delight — they didn’t last long, but they did make us smile
Iterating — And Learning When It Didn’t Work
Like any big redesign, not every idea worked perfectly the first time. We had a tight timeline, and the app was something a lot of people cared about — so input came from stakeholders, marketing, and other designers, all at once.
At one point, we ended up with an iteration that just didn’t hold up. The flow looked fine at first glance, but the UI lacked strong usability, some heuristics were off, and the color palette — especially the blue headers — felt inconsistent and disconnected from our original intent.
The concepts behind the color choices got diluted as more voices weighed in, and we lost some of the clarity we’d built up earlier. Unfortunately, there wasn’t time for formal user testing — so instead, we did our best to step back, run a fresh heuristic evaluation, and revisit our competitive analysis to get the flow back on track.
This version taught us a lot about sticking to good usability and staying true to clear design decisions — even with a lot of input.
Final Refinements — One Small Change, Big Impact
After going back to the drawing board, I had an idea that helped push us toward a much cleaner, more usable UI:
What if we just focused on our headers?
This inspiration came from looking at other airline apps. Many of them used simple, minimal headers — just a clear title and a single back button in the form of a chevron. When I revisited the design through the lens of heuristics, I realized this pattern checked almost every box:
Visibility of system status: Users always know where they are.
Recognition rather than recall: Clear, descriptive titles.
User control and freedom: Easy back navigation.
Flexibility and efficiency: Works across every screen.
Consistency and standards: Same interaction model throughout.
Error prevention: Fewer places to get stuck.
Aesthetic and minimal design: Less clutter, more space for what matters.
Once we established the new header style, it had a ripple effect. We realized the blue headers on our cards no longer served any purpose — they cluttered the design and didn’t add meaning. Removing them simplified the visual hierarchy and let the cards stand on their own.
This single change unlocked more space above the fold, created a smoother reading flow, and brought the whole booking experience together with more clarity and ease.
“One small shift made a big impact — proving that sometimes the simplest solutions really are the strongest.”
How This Shift Shaped Seats
This header simplification didn’t just clean up the overall UI — it directly influenced my work on the seat selection flow, too. With the new, minimal headers in place, the seat map felt so much more spacious and intuitive.
By removing unnecessary visual noise, I was able to refine the seat layout to feel clearer and more focused — giving travelers exactly what they needed to make confident choices, without distraction.
I’ll share more about the full seat selection redesign in a separate case study.
The selection flow:
The “skip” functionality:
Reflections
This project is far from done — the iterations are ongoing, and there’s still plenty of work ahead even after this big UI cleanup. But I couldn’t be more proud of what we accomplished together over these past couple of years.
I learned so much about the full product design process, from early research to building flows for real travelers to seeing how even one thoughtful detail can shape an entire experience. An entire app is no small feat — especially for a robust airline with so many offers, features, and behind-the-scenes systems. I honestly can’t emphasize enough how complex an airline really is.
I have nothing but respect for the people who make it all possible — the staff on the ground, in the air, and everyone along the way who helps bring customers from the dream of a trip to actually landing in their destination. It truly takes an incredible team, and being part of this has been one of the biggest honors of my life.
There’s so much more to share, and this case study is just a small sliver of it. Thank you for making it all the way through — I can’t wait to tell more of these stories in the other parts of my portfolio