Tablee

A visual restaurant reservation platform that empowers users to select their preferred seating arrangement, ensuring a tailored dining experience.
Overview

The rise of restaurant reservation apps has transformed the way people book tables. However, current solutions often fall short in accommodating specific seating requests. Whether it's a cozy corner spot for a romantic evening or a central table for a special celebration, users crave more control over their dining experience

ROLE
UX/UI Designer
TIMELINE
May - Jun 2022
TOOLS

PROBLEM STATEMENT

Existing restaurant reservation systems fail to provide users with the flexibility to choose their desired seating arrangement, leading to disappointment and inconvenience.

HYPOTHESIS

By developing a graphical restaurant reservation app that allows users to visually select their preferred seats and tables, we can enhance the overall dining experience and increase user satisfaction.

Research

To better understand the needs and pain points of users, I developed a research plan outlining goals, methodologies, participants, and timeline

Understand how users interact with restaurant booking apps.
Identify factors influencing restaurant selection.
Explore integration of recommendation systems within the app.
Determine user goals, difficulties, and motivators.
COMPETITIVE ANALYSIS
  • Most restaurant booking apps are free to use;
  • Users can filter restaurants by cuisine, rating, and pricing;
  • Apps typically display restaurant photos and menus;
  • Customer support is often difficult to access;
  • Many restaurants do not utilize reservation apps.
SECONDARY RESEARCH
  • Successful order processing apps include OpenTable (48,000 US venues), Fork (30,000 European venues), and Bookatable (1,000 UK venues).
  • Emerging trends include menu mapping with machine learning and AR menus.
  • Loyalty programs offer personalized experiences for restaurant-goers.
INDIVIDUAL INTERVIEWS & ONLINE SURVEY

I conducted 5 remote interviews and 9 online surveys with participants from metropolitan areas who frequently travel for business and leisure.

Personalization
Users desire tailored reservation experiences.
Seating
Restaurant accommodations must meet user expectations.
Recommendation
Users want relevant, personalized recommendations.
Contact
Users struggle to contact restaurants directly for inquiries.

QUOTE FROM PARTICIPANT #3

" When looking for a restaurant, I trust more the number of reviews than the actual rating. "

Projects Goals

To establish a clear direction for the project, I analyzed a combination of user and business goals, as well as technical considerations. This allowed me to consider multiple perspectives and define a comprehensive set of objectives.

Ensure users can effortlessly book their preferred table every time they dine out.
Provide users with personalized reservation options tailored to their preferences.
Facilitate discovery of new restaurants and experiences.
Design an intuitive and user-friendly mobile app.
Persona

Based on research findings, I created a primary persona, Francis, to represent the target user archetype. This persona will guide future design decisions and ensure the solution meets the needs and expectations of the target audience.

Site Map

To establish a clear organization of content, I created a sitemap. This foundational step enabled me to visualize the app's structure and ensure a logical flow of information.

Task Flow

To better understand Francis's needs, I defined a task flow for booking a table at a restaurant through the app. This exercise helped me empathize with Francis's thought process and identify potential pain points.

User Flow

I explored how Francis would interact with the app in various scenarios, including reserving a last-minute table, booking a restaurant for a special occasion, joining a waitlist, and receiving personalized recommendations. By examining these different use cases, I gained insight into Francis's expectations and behaviors, allowing me to design an intuitive and user-friendly experience.

Sketches &
Wireframes

With the key elements defined, I began sketching the app's pages and translating them into wireframes.

SKETCHES | restaurant profile screen, seating screen
SKETCHES | restaurant list screen, restaurant profile screen

These wireframes served as a blueprint for the app's architecture, allowing me to establish a clear hierarchy of content, organize information in a logical and intuitive manner, and validate my design decisions against the research findings.

WIREFRAMES
WIREFRAMES
Concept Testing

To validate the visual direction of the app, I conducted concept testing with 21 participants. I presented three logo and home screen options (magenta, orange, and red) and asked which one resonated most with food.

  • Magenta: 0%
  • Orange: 43%
  • Red: 57%

Based on the overwhelming preference for red, I decided to develop a red color palette for the brand identity.

GROUP SESSION

I facilitated a group session with 10 participants to gather feedback on the low-fidelity design. Key findings included:

  • Text was difficult to read due to small font sizes;
  • Participants expected the homepage to display location information alongside the search bar, with a 'near me' button nearby;
  • Touch targets were too small, making it challenging for users to click on icons;
  • Some wireframes lacked a back button;
  • Separation lines were distracting.
Branding

Tablee's brand identity is designed to evoke a sense of class, boldness, and friendliness. The chosen red color palette is intended to draw attention, stimulate appetite, and convey warmth and hospitality. By consistently applying this color scheme throughout the app, I aim to create a cohesive and recognizable brand image that resonates with users and sets Tablee apart in the market.

MOODBOARD
LOGO
TYPEFACE
COLOR PALETTE
BUTTONS
UI Design

The final responsive design incorporates all the visual explorations of colors, moods, and styles, creating a cohesive and engaging user interface.

Usability Testing

To validate the design, I conducted usability testing with a group of 10 participants. I asked them to complete tasks on the Figma prototype, observing how they interacted with and navigated the app.

View Prototype
OBSERVATIONS
  • 70% of participants found the color palette and branding elements suitable for an online restaurant booking app, describing them as bold, elegant, and classy.
  • 40% of participants suggested adding a comment box to the restaurant screen for special notes.
  • Users requested more categories in the reservation screen.
  • Participants recommended adding cuisine types and images to the popular search feature to enhance suggestions and recommendations.
  • The map feature lacked a clear connection to the restaurant list.
  • 50% of participants found the "blocked/occupied" labels in the table reservation unclear.
INSIGHTS
  • Users desire more personalized recommendations and suggestions to enhance their dining experience.
  • Information about food allergies and restaurant accessibility is crucial for users, and should be easily accessible within the app.
  • Clear labeling and intuitive navigation are essential for a seamless user experience, highlighting the need for further refinement of the app's design.
Revision

Based on the usability testing findings, I implemented the following changes to the prototype:

  • Established a clear connection between the map and list views to improve navigation and usability.
  • Added a confirmation page displaying reservation details, allowing users to easily share information with their party.
  • Increased the font size from 12pt to 16pt to enhance legibility.
  • Incorporated a comment box on the reservation page for special requests.
  • Clarified captions and color codes on the seating map to reduce confusion.
        View final prototype

        TAKEAWAYS

        This project revealed several key insights into the future of restaurant apps. The market is experiencing a growing trend towards implementing immersive technologies like AR/VR.

        Users crave personalized booking experiences, including table selection and tailored recommendations.

        Additionally, the future of restaurants will likely involve menu mapping with machine learning and AR menus, providing a seamless and dynamic experience.