Firehouse Subs
Reimagining the Kiosk Experience.
.png)
Firehouse Subs is a fast-food chain with over 1,200 locations across the U.S. This project focused on reimagining and optimizing the kiosk experience to reduce friction and streamline ordering, helping guests avoid in-restaurant lines.
My Role.
01 Product Designer
I led the end-to-end design process as the sole designer on this project, driving all stages from discovery to delivery.
02 UX Researcher
As part of my research role, I conducted in-restaurant shadowing, closely observing how guests interacted with the kiosks in a real-world setting. This allowed me to identify friction points, uncover behavioral patterns, and gather qualitative insights.
Discover.
Understanding the problem, gathering insights, and defining opportunities
01 Problem Framing
To shape a meaningful solution, I worked closely with the kiosk team, uncovering their goals, challenges, and technical constraints. These conversations provided critical insights, ensuring the design aligned with business objectives while addressing key pain points in the kiosk experience.
02 In-Restaurant Shadowing
My first action was conducting in-restaurant shadowing to observe how guests interacted with the previously existing kiosk experience. This hands-on research provided firsthand insights into user behaviors, decision-making patterns, and pain points, uncovering key usability issues that shaped the next steps in the design process.
Photography capturing in-restaurant shadowing of the existing kiosk experience in Jacksonville, FL
Key pain points observed during in-restaurant research
03 Competitive Analysis
The best way to conduct competitor analysis in this case was through firsthand experience. My team and I visited over 10 competitor restaurants during a two-day offsite, ordering food and analyzing their kiosk experiences in detail.
.jpg)
Photos from our offsite research, exploring competitor kiosk experiences
Define.
Turning insights into a clear problem statement to guide focused and impactful design solutions
How might we create a more intuitive, accessible, and seamless kiosk experience that reduces friction, improves engagement, and enhances the overall ordering process?
These were the key pain points identified during the discovery phase:
01 Low Kiosk Awareness & Adoption
Many guests didn’t realize they could order from the kiosk, often waiting in line for a cashier until staff directed them otherwise.
02 Navigation & Usability Challenges
Users struggled with unclear CTAs, confusing order flow, and difficulty differentiating combos. Some also attempted to insert payment too early due to misleading labels.
03 Accessibility & Readability Issues
Small fonts made text hard to read, especially for older users, and the kiosk height forced some guests to squat to interact comfortably.
Develop.
Exploring and iterating on solutions to address the defined problem
01 Ideation
Building on the problem statement, I explored multiple solutions through brainstorming sessions and rapid iterations. By leveraging cross-functional input and UX best practices, I generated ideas to improve kiosk visibility, enhance navigation, and create a more seamless ordering experience.
02 Prototyping & Usability Testing
After ideation, I translated key concepts into interactive prototypes and conducted usability testing to validate assumptions. Feedback from this process helped refine interactions, address friction points, and ensure the kiosk experience was intuitive and seamless.
Deliver.
Finalizing and implementing solutions for a seamless user experience
01 Design Handoff
Ensured a smooth design handoff with detailed Figma files, documentation of business rules, edge cases, error states, and empty states to align teams and maintain design integrity.
.jpg)
02 Design System
To ensure design consistency and scalability, we built and documented a new atomic-based design system specifically for the kiosk experience. This framework streamlined implementation, aligned teams, and established a strong foundation for future iterations.
Example of our atomic Design System documentation
03 Visual Validation (QA)
Conducted visual QA to ensure design accuracy, consistency, and alignment with the final implementation.
Final Designs.
.jpg)
.jpg)
.jpg)
.jpg)
.jpg)
.jpg)
Results.
The design efforts led to significant improvements in conversion rates and ROI for the brand
01 Impact
The kiosk design improvements are currently being implemented, with early indicators showing promising potential. Our goal is to drive higher kiosk adoption, increase the average check size, and reduce order time by streamlining the experience.
As rollout progresses, we continue to track key metrics and user behavior to ensure a data-driven, impact-focused implementation.
As rollout progresses, we continue to track key metrics and user behavior to ensure a data-driven, impact-focused implementation.
02 Learnings & Findings
Enhanced Accessibility – Negotiated larger kiosk screens with the provider and increased font sizes across all screens for better readability.
Improved Kiosk Adoption – Designed a more prominent start screen, combined with larger hardware and better placement to drive adoption and prevent lines.
Better Scrolling Usability – Introduced an improved scroll handler and a subtle 2s animation to guide users in discovering more content.
Optimized Flow for Speed – Streamlined the ordering process by reducing screens and taps, ensuring a faster and more efficient experience.
