Layover

Layover

Layover

Explore Layover, a Food Delivery App that Lives in the Airport

Explore Layover, a Food Delivery App that Lives in the Airport

Explore Layover, a Food Delivery App that Lives in the Airport

An explorative case study that merges the world of food delivery with a new fast paced environment.

An explorative case study that merges the world of food delivery with a new fast paced environment.

An explorative case study that merges the world of food delivery with a new fast paced environment.

My Role
My Role
My Role
UX/UI Designer, UX Researcher
UX/UI Designer, UX Researcher
UX/UI Designer, UX Researcher
Date
Date
Date
December 2024 - February 2025
December 2024 - February 2025
December 2024 - February 2025
Category
Category
Category
Mobile App
Mobile App
Mobile App

Problem with the Airport

Problem with the Airport

Problem with the Airport

Each year, thousands of people pass through the airport every day. However, for those who are on a limited budget, it can be a nightmare to find the right shop to settle down and eat.


With the how expensive airport food can be, along with the endless lines at every food stall, many travelers are discouraged from purchasing at all, resulting in a loss of potential sales for the airport. In addition, research has shown people are more keen on waiting for their flights, choosing to forgo food altogether in the fear of missing their plane.

Each year, thousands of people pass through the airport every day. However, for those who are on a limited budget, it can be a nightmare to find the right shop to settle down and eat.


With the how expensive airport food can be, along with the endless lines at every food stall, many travelers are discouraged from purchasing at all, resulting in a loss of potential sales for the airport. In addition, research has shown people are more keen on waiting for their flights, choosing to forgo food altogether in the fear of missing their plane.

Projects & Business Goals

A boarding pass + food delivery app

A boarding pass + food delivery app

A boarding pass + food delivery app

✈️🏢 +📱🚴‍♀️🍔
✈️🏢 +📱🚴‍♀️🍔
✈️🏢 +📱🚴‍♀️🍔

Additionally, this application will also help airports further increase revenue, and help convert hesitant travelers into loyal customers.

Additionally, this application will also help airports further increase revenue, and help convert hesitant travelers into loyal customers.

Additionally, this application will also help airports further increase revenue, and help convert hesitant travelers into loyal customers.

View Prototype

Layover's Research

To understand what is creating stress at the airport, I decided to do some research into the problem. In this study, I will be gathering data through user interviews, then transforming into personas to further identify the problem.


A group of of 5 people between the ages of 20-40 were asked about their experiences in the airport through one on one remote calls.

To understand what is creating stress at the airport, I decided to do some research into the problem. In this study, I will be gathering data through user interviews, then transforming into personas to further identify the problem.


A group of of 5 people between the ages of 20-40 were asked about their experiences in the airport through one on one remote calls.

To understand what is creating stress at the airport, I decided to do some research into the problem. In this study, I will be gathering data through user interviews, then transforming into personas to further identify the problem.


A group of of 5 people between the ages of 20-40 were asked about their experiences in the airport through one on one remote calls.

The Big Picture Problem

Personas were created based on my conclusions on issues faced by travelers in the airport.

Personas were created based on my conclusions on issues faced by travelers in the airport.

Personas were created based on my conclusions on issues faced by travelers in the airport.

Affinity Map

80% expressed:

Fear & Urgency

Users who wait for flights said they were often anxious and stayed near their gates or ordered fast food to save time.

80% expressed:

Fear & Urgency

Users who wait for flights said they were often anxious and stayed near their gates or ordered fast food to save time.

80% expressed:

Fear & Urgency

Users who wait for flights said they were often anxious and stayed near their gates or ordered fast food to save time.

100% hesitated in:

Spending Money

Complaints of expensive shops in the airport lead many to forgo spending, or spending as little as possible.

100% hesitated in:

Spending Money

Complaints of expensive shops in the airport lead many to forgo spending, or spending as little as possible.

100% hesitated in:

Spending Money

Complaints of expensive shops in the airport lead many to forgo spending, or spending as little as possible.

100% spoke up about:

Airport Food

From expensive food prices, to food safety, and tactics to get the cheapest and most filling food, people had a lot to say.

100% spoke up about:

Airport Food

From expensive food prices, to food safety, and tactics to get the cheapest and most filling food, people had a lot to say.

100% spoke up about:

Airport Food

From expensive food prices, to food safety, and tactics to get the cheapest and most filling food, people had a lot to say.

100% expressed:

Stressful Tasks

Going through TSA, to navigating the airport, every user expressed some degrees of frustration with the process.

100% expressed:

Stressful Tasks

Going through TSA, to navigating the airport, every user expressed some degrees of frustration with the process.

100% expressed:

Stressful Tasks

Going through TSA, to navigating the airport, every user expressed some degrees of frustration with the process.

Problem Summary

80% expressed:

Fear & Urgency

Some users were anxious about missing their flights and often waited at their gate.

100% hesitated in:

Spending Money

Complaints of expensive shops in the airport lead to spending as little as possible.

100% spoke up about:

Airport Food

Being too expensive, to being concerned about food quality.

100% expressed:

Stressful Tasks

Navigating the airport, TSA and so on were a huge burden for many.

Findings Further Analyzed:


  • Airport Food: Some users ate fast food because sit down restaurants took too long to serve them.


  • Stressful Airport Tasks: 40% of users interviewed said they were overwhelmed by the amount of tasks and people in the airport to remain at ease.

Layover's Personas

Personas were created based on my conclusions on issues faced by travelers in the airport.

Personas were created based on my conclusions on issues faced by travelers in the airport.

Personas were created based on my conclusions on issues faced by travelers in the airport.

Persona 1

Persona 1

Persona 1

Persona 2

Persona 2

Persona 2

Defining the Problem

Once I created my personas, I was now able to see the problems plaguing my users. Here, they are defined as the following struggles:

Anxieties Over Time & Missed Flights

Users have expressed their desire to catch their flights on time and are unwilling to comprise on longer wait times, leading to potential loss of business for vendors in the airport

Users have expressed their desire to catch their flights on time and are unwilling to comprise on longer wait times, leading to potential loss of business for vendors in the airport

Users have expressed their desire to catch their flights on time and are unwilling to comprise on longer wait times, leading to potential loss of business for vendors in the airport

An Expensive Place to Be

Evidence has shown of users saying things are too expensive in the airport, so they are less willing to spend.

Evidence has shown of users saying things are too expensive in the airport, so they are less willing to spend.

Evidence has shown of users saying things are too expensive in the airport, so they are less willing to spend.

Business Problem
Business Problem
Business Problem

From the airport's perspective, things are just as bad because they are losing potential customers that could have generated revenue and increased profits.

From the airport's perspective, things are just as bad because they are losing potential customers that could have generated revenue and increased profits.

From the airport's perspective, things are just as bad because they are losing potential customers that could have generated revenue and increased profits.

Competitive Analysis

Since my topic was very niche, I looked up relevant to adjacent competitors, searching for features that already worked in delivery or an airport environment. I picked out both applications that already existed in the airport such as AtYourGate, as well as analyzed competitors like Door Dash for modern UI trends.

Since my topic was very niche, I looked up relevant to adjacent competitors, searching for features that already worked in delivery or an airport environment. I picked out both applications that already existed in the airport such as AtYourGate, as well as analyzed competitors like Door Dash for modern UI trends.

Since my topic was very niche, I looked up relevant to adjacent competitors, searching for features that already worked in delivery or an airport environment. I picked out both applications that already existed in the airport such as AtYourGate, as well as analyzed competitors like Door Dash for modern UI trends.

The Main Four Competitors

Competitive Analysis

Competitive Analysis

Competitive Analysis

Competitive Analysis

Key Findings


  • All competitors had some type of store carousel or layout that allowed users to tap in to see their basic information such as menus, location, estimated times, delivery, or pickup options in some form.


  • Door dash was the most advanced out of all these apps and provided extra services such as recommendations for extra orders, but was also the most fee intensive with an optional membership and service fees.


  • Aside from B4, all other services had some form of order ahead feature that allowed users to place orders either ahead of time or hold orders.

Defining the Concept

Once I was inspired by the features of my competitors, I set up to define my app concept by doing some low fidelity sketching. First, I started with the dashboard, which combined a user's air travel journey, then an item carousel plus checkout page to detail how said user would make a purchase. I added in the air travel aspect because I noticed no other competitor tracked the user's journey. From my research, many travelers said they were concerned with long wait times and anxiety about missing their flights so an in built tracker should help serve as a good reminder.


By the time I finished my concept, I came up with a hybrid delivery and boarding pass application.


Low Fidelity Sketches

Low Fidelity Sketches

Low Fidelity Sketches

Low Fidelity Sketches

Layover's Architecture

From my sketches and the competitive analysis, I started to define a theoretical map of what features could show up in the app. This is the first iteration of the site map, which will change drastically once an order ahead feature will be added to help users save time.

From my sketches and the competitive analysis, I started to define a theoretical map of what features could show up in the app. This is the first iteration of the site map, which will change drastically once an order ahead feature will be added to help users save time.

From my sketches and the competitive analysis, I started to define a theoretical map of what features could show up in the app. This is the first iteration of the site map, which will change drastically once an order ahead feature will be added to help users save time.

Site Map

Site Map of Layover App

Mid Fidelity Part 1 (IAD Placing a Delivery Order)

Mid Fidelity Part 1 (IAD Placing a Delivery Order)

Task Flows


Completing the site map, I created a range of task flows to show what type of actions can happen in the app. The most important flow will be the "Order Food" flow, as it's the main function it will have.

How to Order Food, Search for Restaurant, and Delivery Preferences

Mid Fidelity Part 1 (IAD Placing a Delivery Order)

Mid Fidelity Part 1 (IAD Placing a Delivery Order)

Layover's Mid Fidelity

The mid fidelity I came up with consisted of 3 task flows that made up the Layover experience.

The mid fidelity I came up with consisted of 3 task flows that made up the Layover experience.

The mid fidelity I came up with consisted of 3 task flows that made up the Layover experience.

Changes From Low to Mid Fidelity

Major Change From Low to Mid Fidelity

As I was building the mid fidelity, halfway through, I decided to add an "Order Ahead" feature which was found in my competitive analysis. In this way, users will not only be able to order in their current airports, but to the next airport they will be landing at to shave off those precious extra minutes.

Meeting Business Demands
In addition to being convenient to the user, "Order Ahead" will also generate more revenue on the business side.

Major Change From Low to Mid Fidelity

As I was building the mid fidelity, I referred back to my data to make sure I was correctly meeting my user's needs, when thinking about how to help them save time.


Once I was halfway through, I decided to add an "Order Ahead" feature which was found in my competitive analysis. In this way, users will not only be able to order in their current airports, but like in Doordash, they can order ahead for another time, but in this case, to the next airport they will be landing at to shave off those precious minutes.

Meeting Business Demands
In addition to being convenient to user, "Order Ahead" will also generate more revenue on the business side.

Major Change From Low to Mid Fidelity

As I was building the mid fidelity, I referred back to my data to make sure I was correctly meeting my user's needs, when thinking about how to help them save time.


Once I was halfway through, I decided to add an "Order Ahead" feature which was found in my competitive analysis. In this way, users will not only be able to order in their current airports, but like in Doordash, they can order ahead for another time, but in this case, to the next airport they will be landing at to shave off those precious minutes.

Meeting Business Demands
In addition to being convenient to user, "Order Ahead" will also generate more revenue on the business side.

Part 1: Placing an Order


The first flow is how to place an order in the user's current airport. In this case, IAD airport was used as the example. Early concept of a boarding pass feature and a purchase flow can be seen here.

Mid Fidelity Part 1 (IAD Placing a Delivery Order)

Mid Fidelity Part 1 (IAD Placing a Delivery Order)

Mid Fidelity Part 1 (IAD Placing a Delivery Order)

Part 2: Selecting Order Ahead Location at the Next Airport


Part 2 introduces the first half of the "Order Ahead", flow where a user must select their location inside the airport where they want their item to be delivered.

Mid Fidelity Part 2 (Select an Location in LAX)

Mid Fidelity Part 2 (Select an Location in LAX)

Mid Fidelity Part 2 (Select an Location in LAX)

Part 3: Ordering Ahead


Part 3 has our user ordering ahead to their next airport (LAX) even before they arrive. After selecting a location for delivery from part 2, they are able to pick a time of when they want their food to be delivered, or place it manually from the Dashboard (last panel to the right) for when they physically arrive.

Mid Fidelity Part 3 (LAX Place Order Ahead)

Mid Fidelity Part 3 (LAX Place Order Ahead)

Mid Fidelity Part 3 (LAX Place Order Ahead)


Mid Fidelity Testing


Changes were made according to user frustrations. 5 users were interviewed from various backgrounds. Each test was conducted over video call with users sharing their screens and facial reactions.

Mid Fidelity Testing Results

80% did not understand:

The Save Order Feature

Users had trouble explaining what the "Save Order" feature meant and were split into two camps.

40% Requested:

Automatic Order Feature

After seeing the "Save Order" feature in the "Order Ahead" flow, 40% of users wanted orders to be placed automatically.

80% did not know:

Where to Find the Shops

Users were confused by the Dashboard and couldn't figure out where to click.

80% did not know:

Where to Find the Shops

Users were confused by the Dashboard and couldn't figure out where to click.

80% did not know:

Where to Find the Shops

Users were confused by the Dashboard and couldn't figure out where to click.

40% did not like the:

Confusing Dashboard

Users said the Dashboard appeared more like a boarding pass app than a food delivery app.

40% did not like the:

Confusing Dashboard

Users said the Dashboard appeared more like a boarding pass app than a food delivery app.

40% did not like the:

Confusing Dashboard

Users said the Dashboard appeared more like a boarding pass app than a food delivery app.

80% did not know:

Where to Find the Shops

Users were confused by the Dashboard and couldn't figure out where to click.

40% did not like the:

Confusing Dashboard

Users said the Dashboard appeared more like a boarding pass than a food delivery app.

80% did not understand:

The Save Order Feature

Users had trouble explaining what the "Save Order" feature meant and were split into two camps.

80% did not understand:

The Save Order Feature

Users had trouble explaining what the "Save Order" feature meant and were split into two camps.

80% did not understand:

The Save Order Feature

Users had trouble explaining what the "Save Order" feature meant and were split into two camps.

40% Requested:

Automatic Order Feature

After seeing "Save Order" feature in the "Order Ahead" flow, 40% of users wanted orders to be placed automatically.

40% Requested:

Automatic Order Feature

After seeing "Save Order" feature in the "Order Ahead" flow, 40% of users wanted orders to be placed automatically.

40% Requested:

Automatic Order Feature

After seeing "Save Order" feature in the "Order Ahead" flow, 40% of users wanted orders to be placed automatically.


Analysis


From testing, the Dashboard and the Check Out page that houses the "Order Ahead" feature appears to be the most confusing. My theory for this was because the hybrid modal, where I would merge the features of air travel (boarding pass), with food delivery UI, ended up misleading users.


Since there was no app on the market as of writing that has these two mental modals merged, I could only relay on my data and sketches to come up with a viable solution.

Branding

To create this app, not only did I need to focus on the UX, but also creating good UI.

Through several iterations, I created both a UI Kit and brand name for my application.

To create this app, not only did I need to focus on the UX, but also creating good UI.

Through several iterations, I created both a UI Kit and brand name for my application.

To create this app, not only did I need to focus on the UX, but also creating good UI.

Through several iterations, I created both a UI Kit and brand name for my application.

Introducing: Layover


Layover's UI was focused on simple colors and strong visuals. I specifically studied the appearances of other apps such as Doordash and Uber Eats, being inspired by their visual language.

Brand Logo

Layover Brand Logo

Layover Brand Logo

Layover Brand Logo

UI Kit

Layover UI Kit

Layover UI Kit

Layover UI Kit

High Fidelity Creation

Fixes


The first version of the high fidelity was built with the following fixes according to mid fidelity testing:


  • The Dashboard screen received a redesign that emphasized the "food delivery" aspect of the app, however I still carried over the boarding pass feature from before. Boarding pass information can be extremely helpful at the airport for deliveries.


  • A removal of a pervious "Choose your location" from the mid fidelity. The decision to remove this feature was because the inclusion of the boarding pass also displayed the user's location.

IAD Order Food: New Hybrid Dashboard

IAD Order Food: Part 1

IAD Order Food: Part 1

LAX Save Order Feature


To fix the "Save Order" feature, I referred back to one of my competitive analysis (DFWOrderNow) for inspiration. They appear to have a "Hold Order" feature which I used here in the second screen shot. The term refers to holding an order until the user places it manually. Additionally, I also ordered a few order ahead times so users can pick and chose when the actual order will be sent to the kitchen for preparation.

LAX Order Ahead: Part 1

LAX Order Ahead: Part 1

LAX Order Ahead: Part 1

LAX Order Ahead: Part 2

LAX Order Ahead: Part 2

LAX Order Ahead: Part 2

Priority Revisions

After the high-resolution design was finalized, I conducted additional user trials to verify if the modifications had effectively mitigated their previous bottlenecks.

40% Requested:

Better Colors

The blue was used too often, leading to confusion if certain areas were intractable.

40% Requested:

Moving the Coupon Section

The coupon section should be grouped with the other finance options.

40% Requested:

Better Colors

The same main blue was used too often, leading to confusion if certain areas were intractable.

40% Requested:

Better Colors

The same main blue was used too often, leading to confusion if certain areas were intractable.

40% Requested:

Better Colors

The same main blue was used too often, leading to confusion if certain areas were intractable.

40% Requested:

Moving the Coupon Section

The coupon section at the bottom of the Check Out page should be grouped with the other finance options.

40% Requested:

Moving the Coupon Section

The coupon section at the bottom of the Check Out page should be grouped with the other finance options.

40% Requested:

Moving the Coupon Section

The coupon section at the bottom of the Check Out page should be grouped with the other finance options.

60% Were Unsure if:

Their Order Went Through

At the end of the "Order Ahead" flow, users were unsure if their order was placed.

60% Were Unsure if:

Their Order Went Through

At the end of the "Order Ahead" flow, users were unsure if their order was placed.

60% Were Unsure if:

Their Order Went Through

At the end of the "Order Ahead" flow, users were unsure if their order was placed.

40% Were Unsure if:

They Were Charged

Users complained that the "Order Ahead" process did not assure them if their card was charged or not.

40% Were Unsure if:

They Were Charged

Users complained that the "Order Ahead" process did not assure them if their card was charged or not.

40% Were Unsure if:

They Were Charged

Users complained that the "Order Ahead" process did not assure them if their card was charged or not.

60% Were Unsure if:

Their Order Went Through

At the end of the "Order Ahead" flow, users were unsure if their order was placed.

40% Were Unsure if:

They Were Charged

The "Order Ahead" process did not assure user if their card was charged.

Major Rework of the "Hold Order" Feature

4/5 of users understood what hold order meant, yet 2 users had questions about when this feature would charge their credit cards.


1 user also related the “Hold order” feature to a wishlist, which was an important discovery for my next steps.

Major Rework of the "Hold Order" Feature

4/5 of users understood what hold order meant, yet 2 users had questions about when this feature would charge their credit cards. I find this important because this was an issue I didn’t consider now. Additionally, I suspect more users would have raised concerns if were a real app, because they had no real financial stakes in this test. One user also related the “Hold order” feature to a wishlist, which was an important discovery for my next steps.

Major Rework of the "Hold Order" Feature

4/5 of users understood what hold order meant, yet 2 users had questions about when this feature would charge their credit cards. I find this important because this was an issue I didn’t consider now. Additionally, I suspect more users would have raised concerns if were a real app, because they had no real financial stakes in this test. One user also related the “Hold order” feature to a wishlist, which was an important discovery for my next steps.

Changes to High Fidelity Based on Tests:


  • Colors were improved with more hi-lights such as the orange and lighter blues to help break up information.


  • The "Coupon Section" from the Check Out page has been moved upwards, so now it sits with the credit card payments.

Final High Fidelity IAD: Order Food Part 1

Final High Fidelity IAD: Order Food Part 1

Final High Fidelity IAD: Order Food Part 1

Final High Fidelity IAD: Order Food Part 2

Final High Fidelity IAD: Order Food Part 2

Final High Fidelity IAD: Order Food Part 2

The New Hold Order Flow:

The Hold Order Feature will remain, but will be altered. Taking advice from all the users, Hold Order will become a button after user has finished selecting an item. System will prompt the user to “Hold order - Purchase later”, once this is pressed, it will lead the user back to the dashboard where they can press “Place order now” which is when the item will be added to cart, and the normal payment from the first flow continues. 


This flow was based off of the “Wishlist” feature flow where users don’t see a payment screen but they understand mental modal wise that they are adding an item onto a list instead.

The New Hold Order Flow:

The Hold Order Feature will remain, but due to user complaints about payments, the checkout page for LAX’s Order Ahead feature will be changed. Taking advice from all the users, Hold Order will become a button after user has finished selecting an item. System will prompt the user to “Hold order - Purchase later”, once this is pressed, it will lead the user back to the dashboard where they can press “Place order now” which is when the item will be added to cart, and the normal payment from the first flow continues. 


This flow was based off of the “Wishlist” feature flow where users don’t see a payment screen but they understand mental modal wise that they are adding an item onto a list instead. By doing this, I hope to decrease payment confusion from before and let the “Place order now” button lead users into understanding that order hasn’t gone through which they were shown to understand in the interviews.

The New Hold Order Flow:

The Hold Order Feature will remain, but due to user complaints about payments, the checkout page for LAX’s Order Ahead feature will be changed. Taking advice from all the users, Hold Order will become a button after user has finished selecting an item. System will prompt the user to “Hold order - Purchase later”, once this is pressed, it will lead the user back to the dashboard where they can press “Place order now” which is when the item will be added to cart, and the normal payment from the first flow continues. 


This flow was based off of the “Wishlist” feature flow where users don’t see a payment screen but they understand mental modal wise that they are adding an item onto a list instead. By doing this, I hope to decrease payment confusion from before and let the “Place order now” button lead users into understanding that order hasn’t gone through which they were shown to understand in the interviews.

New Task Flow For "Hold Button" in the Order Ahead Flow

New Task Flow For "Hold Button" in the Order Ahead Flow

New Task Flow For "Hold Button" in the Order Ahead Flow

Final High Fidelity LAX: Order Food Part 1

Final High Fidelity LAX: Order Food Part 1

Final High Fidelity LAX: Order Food Part 1

Final High Fidelity LAX: Order Food Part 2

Final High Fidelity LAX: Order Food Part 2

Final High Fidelity LAX: Order Food Part 2

Final Experience

After the final round of revisions, here is the final prototype with the included changes.

Next Steps & Reflection

When I first started this project, I was very excited at the prospect of exploring new mental modals, where I could combine two very different services. Food delivery and travel don't have much in common and so I was intrigued by the "what if" I combined two and what type of UX it could bring out.


It was challenge, as I had little real world examples to go off of, and the ones that did exist were either inaccessible or the service simply didn't exist in 2025. For example, I couldn't get AtYourGate to work so I based off my competitive analysis off of the few screen shots and videos I could find.


Aside from finding materials to refer to for my research, I was also wracking my brain over the "Order Ahead" user flow because between the mid and high fidelity tests, users were still confused by the "Hold Order" feature. That was until my last priority revision test where a user mentioned "Wish List" and I immediately went checked the flow for it and realized my current Order Ahead was very similar to it. From there, I took inspiration, and that was how I came to solve a hard problem that had been plaguing me for days. I'm truly thankful for the people who have worked with me to test this prototype, as these users have been the most important part of this project to guide me to where I am now.


For my next steps, I would once again do another interview and test session to help see if my current wish list is correct.

© 2025 Wei Yan

Email Contact
Yw.rworks@gmail.com
Socials

© 2025 Wei Yan

Email Contact
Yw.rworks@gmail.com
Socials

© 2025 Wei Yan

Email Contact
Yw.rworks@gmail.com
Socials

© 2025 Wei Yan

Email Contact
Yw.rworks@gmail.com
Socials