BACK
BACK

Designing effortless and enjoyable restaurant reservations

CLIENT
Table Tango (Concept)
RESPONSIBILITIES
UI Design
UX Research
Prototyping
year
2025
challenges
Have you ever spent hours waiting for a table at a restaurant? Or searched multiple platforms just to find contact details and make a reservation?

These are common challenges for those who love dining out. An app that lets you discover restaurants and easily book reservations would make the dining experience much more seamless.

Design Process

IDENTIFYING PROBLEMS

Dining out is a wonderful way to connect with others, but booking a restaurant table can be frustrating and outdated.

Limited real-time availability and slow, error-prone phone bookings make it difficult to find restaurants with open seating. Without a streamlined reservation system, restaurants risk losing potential customers.

Identifying Problems

I conducted field observations at mall restaurants to understand the dining experience and customer flow. This helped me identify pain points in the reservation and waiting process such as:

Photo grabbed for visualization

https://www.culinarydepotinc.com/product_images/uploaded_images/great-restaurant-location.png

High demand during peak hours creates bottlenecks, overwhelming staff as they juggle bookings and current customers. Without an efficient system, wait times increase, and restaurants miss opportunities to optimize operations and enhance customer satisfaction.

COMPETITOR ANALYSIS

I analyzed reservation apps and, finding only one in the Philippines, included another from abroad to gain more insights.

Opentable
Features
  • Filters for different occasion and cuisine on search restaurants
  • Allows users to specify seating preferences like window or outdoor seating.
  • Points System for diners of who regularly use the app
Opportunities
  • Allow users to set dietary preferences or allergies (e.g., vegan, gluten-free) and get tailored restaurant suggestions or menu highlights.
  • Enhance with interactive table selection based on restaurant layouts.
  • Partner with restaurants to offer exclusive deals for app users (e.g., complimentary appetizers).
theFork
Features
  • Each Restaurant has a gallery of the customers they have.
  • Some restaurants allow users to pay their bill directly through the app.
  • Restaurant suggestions based on user reviews and popularity.
Opportunities
  • Create a gallery of customers that tag the restaurants using their social media.
  • Include split-bill functionality for group payments and tip calculation.
  • Offer tailored recommendations using machine learning based on user preferences, dining history, and real-time data.

GOAL

Based on my research, I need to design an app that simplifies dining by offering easy reservations, personalized recommendations, in-app payments, and a split-bill feature. With specific table reservations, the app will ensure a seamless and smooth user experience.

USER FLOWS

After the research, I created flows on how user will use the app from the homepage into successfully reservation on a restaurant.

INFORMATION ARCHITECTURE

I designed the app's Information Architecture to organize each screen's content, ensuring a clear and efficient user experience.

WIREFRAMING

Next, I created wireframes for each screen, incorporating text to conceptualize the information displayed on them.

DESIGN SYSTEM

After wireframing, I developed a design system using SF Pro Display for typography, along with a consistent set of colors and icons, to maintain uniformity and speed in creating UI elements.

High-Fidelity

After structuring the screens and creating a design system, I began designing the app, using orange as the primary color to evoke energy and excitement.

PROTOTYPING

I also mapped out user flows for various scenarios, such as booking a restaurant, using dietary filters, and utilizing the in-app payment and split-bill features.

Booking a restaurant

In this flow, users can search for restaurants from the home screen, with results filtered based on their preferences. After selecting a restaurant, users choose the date, time, guest count, and a specific table before proceeding to the reservation summary.

Using the Dietary Filter

This flow focuses on users applying filter options to search for restaurants based on their dietary preferences.

Paying using the App and Split-Bill Feature

This flow demonstrates how users can link their cards for faster in-app payments with the restaurant. It also shows the split-bill feature, where users add friends to confirm their share before completing the payment.