OverviewUnderstandDesignNext Steps

CASE STUDY

EatApp

Reserve your favorite restaurant with ease

Wireframing
Prototyping
User Story
User Testing
Lo-Fis
Hi-Fis
Project Type
Delivery, Booking
Platform
Mobile App, Web
Tools Used
Figma, Whimsical

Project Background

EatApp is a mobile application that helps users reserve tables at their desired restaurants without the need for in-person contact. With EatApp, users can easily make reservations straight from the application, remotely.

Our app offers a wide variety of international cuisine options from around the world, catering to everyone from busy students to hard-working professionals between the ages of 18 and 55.

Whether you're looking for a quick meal or a fancy dinner, EatApp makes it easy to find and book a table at your preferred restaurant.

Project Duration - Jun-Sep 2022

Project Overview

The Problem

Existing reservation websites tend to have cluttered content, which makes it challenging for users to navigate through them. The interfaces of these websites are often not user-friendly, resulting in users spending an excessive amount of time attempting to reserve a table.

Project Goal

The project aims to make restaurant reservations easy by creating a user-friendly website with an intuitive interface that simplifies the reservation process for users. The intuitive interface makes the reservation process quick and effortless, ensuring that users can book their seats with minimal effort.

My Role

UX designer
leading EatApp website design

Responsibilities

Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, iterating on accessibility, designs and responsive design

Understanding The User

User Research Summary

I conducted several interviews and build empathy maps in order to understand end-user needs, wants, motivation and pain points. A primary target audience determined based on the conducted research was students and adults with busy schedule and prefers outdoor eating, but they don't have spare time to waste on table reservation by call in or walk in.

In addition, It turned out that many reservation websites are overwhelming and difficult to navigate, which end ups in frustrating many potential users, leading to overall non-enjoyable experience.

The user group confirmed initial assumptions about EatApp customers, but it was revealed from the research that apart from timing, easy reservation was needed.

Other user pain points highlighted as it was difficult to find the free space in case of walk-in to restaurants in person.

User Research - Pain Points

1
Navigation
Reservation websites often have cluttered designs that make navigation unpleasant
2
More Gallery
Websites for table reservations lacks more venue galleries to explore in depth
3
Reservation
Users requires to have simple flow to reserve the desired venue

User Persona - George

Problem Statement

Georgie is a busy executive who wants to reserve restaurants online with simple navigation, quickly and easily

Use Journey Map

Mapping George’s user journey revealed possible paint points and opportunities for further improvements
Goal: Do restaurant reservation online with simple and quick navigation

Starting The Design

Sitemap

Cluttered design on the reservation websites was the primary pain point.

To ease the user flow, I created strategic information architecture decisions that supported in improving overall website navigation

Usability Study Parameters

Study Type
Unmoderated
Location
Georgia, Tbilisi
Participants
5 Users
Time Length
25-30 min

Usability Findings

1
Listing Details
Users were not able to save desired restaurant for later view
2
Homepage Section
User were confused with “free reservation” section as seen on Lo-Fi
3
CTA Placement
Call in action buttons was barely visible at the bottom of the page

Refining The Design

Mockups

User were not able to save favorite restaurant/venue for later view. To address this pain point, heart symbol icon was added to every card of the homepage.

Now user can easily favorite desired places and check them later.

Key Mockups (Desktop/App)

Hi-Fi Prototypes

The final high-fidelity prototype presented cleaner user flows for building EatApp and mere reservation process.

It also met user needs for a quick reservation.​

View Prototype (Figma)
Click to View

Accessibility Considerations

Headings

used headings with different text style to create clear visual hierarchy

Icons with Text

Used Nav icons along with text description to help make navigation easier

Bigger Thumbnails

Used bigger size thumbnails to enable better and easy view of selected venues.

Going Forward

What I Learned

When I was working on designing EatApp, I came to the realization that the initial drafts were just ideas and concepts that provided a starting point for creating a product to present to potential end-users. In reality, the design process was shaped by the results of usability studies and the feedback we received from actual end-users.

It's crucial to design a user experience that aligns with the user's needs, rather than what we as designers might think is best.

Impact

The app makes users feel like EatApp really thinks about how to meet their needs.

Quote from peer feedback​

“This website simplifies my life when it comes to table reservation at the favorite restaurant with easy navigation and fantastic user experience."

More to Explore 🙌