OpenTable Concept

August 2021

Electronic menus at restaurants are here to stay. It's time to pay the check from your phone.

I enter Distrito, the it-spot to get Mexican food and margaritas on Penn's campus, after making a reservation for four on OpenTable. The host points to a laminated card adorned with the now ubiquitous QR code. You can scan the code to see our menu, she says.

A scene like this was a rarity two years ago, but it has emerged as a permanent fixture in restaurants now. Why can't I get the check with my phone, too? That’s why I created Pay with OpenTable.

Background

In 1998, at the dawn of the internet, OpenTable burst onto the scene promising to revolutionize the often confusing and tedious task of obtaining a restaurant reservation. They've come to dominate the field, seating around 83 million diners each month and working with 60,000 restaurants worldwide. [1]

23 years later, they face challenges that threaten their market grip. Bookings Holdings, which now owns it, has written down the company's value since its $2.6 billion acquisition in 2014 and is reducing investment into the platform. A new batch of competitors, like Resy, are quickly onboarding the restaurants most attractive to customers by offering better pricing and newer tech. How might we take advantage of OpenTable's market dominance to make the dining experience more seamless for customers?

Research

I took a look at OpenTable's Summer 2021 diner insights to get a better feel for the state of the restaurant industry.

Key Findings

• People still care about restaurant's safety precautions. 18% of people say when choosing a restaurant, the most important thing is that a restaurant follows regulated health and safety measures. This is still a 25% decrease from 2020.
• Food still takes the cake when choosing where to dine. 58% of people rank food as the most important factor when choosing where to dine. Safety precautions are ranked second.
• 58% of US diners and 77% of Canadian diners feel communicating strict cleaning policies is extremely or highly important to feeling comfortable going out to eat.
• 56% of people want restaurants to continue contactless pay, ordering, or menus, compared to only 20% who want this to stop.

This shows the time is now to enhance the touchless experience at restaurants, but it's important to toe the line between keeping the memorable experience of being served and enjoying a sit-down meal at a restaurant and dehumanizing the restaurant experience in the name of convenience.

Here were some of my ideas.

• Paying the check electronically through the app at the end of the meal. After all, OpenTable already has your payment info and can charge you
• Opening an electronic tab connected to your OpenTable account. Get charged automatically. Walk right out of the restaurant
• New, more creative electronic menu experiences
• Showing live wait times
• Improved rewards

With all of this in mind, I went to work designing and prototyping a mobile check flow. This is still a work in progress. I plan on adding more functionality and refinement to this.

Process

User Journey
I created a User Journey Map to lay out the high level events, pains, and gains, a user may go through using my proposed feature.

Wireframes
I made some quick wireframes in Balsamiq to get a visual guide as I fleshed out my high fidelity mockups.

Typeface Update

The first thing I noticed when digging into the app was OpenTable's fragmented typography system. Some text was set in their brand font, Brandon Text. The other text was set in Apple's system font, SF Pro. I decided to consolidate everything into the geometric sans-serif from Laurenz Brunner, Circular Std. It's friendly, it's unique, and it's beautiful.

Easy Navigation

View your current reservation from the home screen. One of the only reasons you'd open the OpenTable app during the meal is to pay your check. Putting it at the very top of the home screen increases discoverability. I also changed the notification tab to be the rewards tab (coming soon).

View Check

See your bill, apply rewards, and swipe up to pay. The swipe gesture is an easy, ergonomic way to pay the bill. This resembles Robinhood's easy checkout flow.

Change payment

Easily change your payment method from any menu. Get rid of the hassle of accidentally paying with your personal card instead of business, or vice versa.

Add Tip

After you pay, you can add the tip. This creates a focused view on the tip modal, conveying a primary action you must take. You cannot click finish until you have added a tip. The tip could be any amount, including zero. 

Split Check

Easily assign items to one or multiple guests. Tax and tip calculator is built in.

Learnings

I designed this feature without much regard for the restaurant's side. Questions remain: how does this integrate with their existing payment system? Can restaurants use this for customers who don't even have OpenTable? What does the fee structure look like?

If you like this, let's connect. I developed this project intermittently throughout August 2021 and my goal was to design a feature that I would be excited to use. Since I had primarily been designing desktop web apps this year, I wanted to challenge myself with a mobile product. Nonetheless, I really enjoyed this project, and putting my process into writing was constructive.