Integration icon

Team

1 UX/UI Designer (me)
1 Product Manager
2 Engineers
Integration icon

Role

User Research
Concept Development
Wireframing & Prototypes
Usability Test
Integration icon

Tools

Figma
Google Forms
Marvel
Maze

Overview

During the COVID-19 pandemic, a significant concern when dining out is the potential risk of contracting the virus through close contact. As a result, minimizing contact between guests has become paramount for ensuring their health and safety. However, implementing social distancing measures has led restaurants to reduce their seating capacity, thereby impacting their table turnover rate. This raises an important question: How can restaurants enhance their table turnover rate while adhering to social distancing guidelines and prioritizing guest safety?

Stakeholder Interviews

To gain a comprehensive understanding of the business goals and challenges associated with implementing a new feature for dining in at La Madeleine within their mobile app, I conducted stakeholder interviews. These interviews were instrumental in capturing insights from key stakeholders within the organization, such as senior management, operations, and marketing teams. Through these discussions, I explored their vision for the app, identified their specific objectives, and gained insights into their expectations for the order and pay feature. Additionally, I delved into the potential challenges and constraints the team may face in integrating this functionality. By conducting stakeholder interviews, I obtained valuable information that will guide the design and development process, ensuring that the feature aligns with La Madeleine's business goals while addressing any potential challenges in implementation.

Business Goals

1. Offer a safe dining experience
2. Enhance brand loyalty
3. Increase revenue & customer satisfaction
4. Rethink restaurant flow, staffing, and standard operating procedures

Challenges

1. Integrated with existing design system
2. Limited resources require new features to be easy and quick to build
3. Clients are adamant that there will be no upgrade to P.O.S

Market Research

In March 2020, COVID-19 disrupted the food industry ranging from decreased food sales and staffing to customers being cautious about their health & safety. However, data also showed that customers are eager for a sit-down meal and craving a return to socialization norms.

Survey & User Interview

A list of survey questions were sent out to 50 participants to understand the dining preferences during pandemic. The survey responses also helped prepared questions that could be asked during user interviews to understand the reason why behind those dining preferences.
View user interview guide

Key findings

Seeks safety and socialization at restaurants in wake of COVID-19.

Andree S.

Is willing to use contactless dine-in if it helps them avoid lines.

Megan P.

Is motivated to visit restaurants that offer contactless dining solutions.

Christi N.

Expressed concerns about contracting COVID-19 through close contact with other people or through shared devices like kiosks.

Joe S.

Expressed frustration about miscommunication with waiters/servers or when their orders were made incorrectly.

Nick K.

Feel impatient if he does not know when is the order ready. There should be a way to track order status when dining in.

Mark R.

Competitive Analysis

Integration iconIntegration iconIntegration iconIntegration icon

Consistent user flow

Despite different ordering options, the user flow is kept consistent to avoid confusion.

Push notifications

Ability to alert guests on Dine-in ordering option and on the order status is essential.

Locate the guests

The importance of contactless dine-in is having the food delivered to the right guest. It is crucial to have a way to locate where the guest is seating.

Pay & Tip

Most of our competitors ask customers to pay and tip while they’re checking out. This could be convenient since they do not have to worry about paying and tipping afterwards. However, some customers may want to enjoy their food and service first before paying.

How might we streamline the ordering process and implement the feature into the current app?

Journey Map

I soon discovered the importance of reducing wait times, ensuring accurate food orders, and minimizing contact with other people. With these goals in mind, we can improve the customer experience and increase table turnover rates.

To ensure that I capture the right target users and understand the user journey when dining in, I created research artifacts before moving on to the design stage.
User journey when dining out

Opportunity

The goal is to offer a safe dining solution and enhance customer service:
1. The user flow is consistent with ordering for Pick-up and Delivery
2. Ability to locate where the guest is sitting through mobile order placement
3. Ability to pay immediately or pay later
4. Should real-time order tracking be offered for Dine-in?
5. Should scheduled orders be available?
6. Push notifications to let the guest know about the feature when arrive at the restaurant

Information Architecture

Based on the findings from competitive research and user interviews, I created a user flow that focuses on how diners can order food from a specific restaurant location. I also considered the flow for ordering and paying after they finish their meals.

To arrive at the final user flow, I created multiple sketches. Given that it is crucial to locate where the guests are seated and ensure that the food is served correctly, the table number must be asked immediately after they select the "Dine in" option.

Payment and tipping should be the same for both the pay later and pay now routes. To initiate payment for the pay later route, customers must scan the QR code on the paper receipt they receive from their waiter.
From ordering to paying on la Madeleine app user flow

Solution Ideation

When translating pain points into ideas, I kept in mind how to seamlessly integrate the new feature into the current order flow. I worked with the technical product manager and engineering team to navigate a variety of technical and operational constraints.

The Constraints

Real-time order tracking: current third-party Point of Sale provider does not support real-time order status tracking. If implementing, it requires technology upgrade which is not a preferred route.

Group order: it is not yet available. Each diner will need to order separately.

Open check & Splitting check: Open check might be out of scope. Customers are requested to pay and tip at checkout. Splitting check requires additional function.

Scheduled order: We’re not able to fulfill scheduled order for dine-in ordering. Customers have to enter the table number where they are sitting.

App download: New customers have to download the app and register an account in order to browse the menu. There isn’t a QR code menu.
Early version of the new feature

Usability Test

I conducted the testing both in person and remotely using Maze and Zoom. The goals are to validate the user flows that I constructed, and discover users' frustrations.

"It was easy to place an order. However, it would be better to make the payment section more visible with a default payment selected."

Sam F.

"I was able to complete the task. There are repetitive fields such as email address that do not need to re-enter multiple times."

Helen W.

Iterations

Based on the affinity map, I created a priority matrix to determine which improvements I could tackle first for intuitive navigation. I wanted to ensure the order confirmation and payment process do not cause any confusion.
MockupMockup

Final Design

When translating the pain points into ideas, I kept in mind how complicated personal finance apps are and aimed to design the interface with intuitive navigation for users to be able to complete different tasks. I started with low-fi wireframes and developed into mid-fi wireframes.

Order & Pay

Users can order & pay through la Madeleine mobile app when dine-in. They can opt for pay later if they decide to finish the meal first and proceed with payment after.

Track order status

Users can now track their order through the app when dining in.

Outcomes & Impacts

10%
Improve table turn over rate
20%
Increased revenue

Takeaways

Balance business goals with user needs
It’s important to align business goals with users’ needs and march towards a solution that brings positive impact.

Know what your constraints are
Flexibility and efficient collaboration are essential in navigating through constraints and delivering a final product.

UX is iterative
We have to constantly adjust our design and keep a list of success metrics to track changes and benchmark against iterations
Continue reading...

Other projects

Moner main image

Moner

Optimizing finance management
Link to project

Unifocus

Hotel operations. Made simple.
Link to project

Pro Brite

Conversion-focused website