App DEsign
Table Spotter
An informative app that simplifies the table search process of a mall food court.
School Project
Sep - Dec 2022
Figma, Mural
Research, Ideation, Wire-framing, Prototyping, Visual Design, Data Visualization

Simplifying the Table Search Process

The design challenge was to create a digital intervention that enhances a everyday experience.

The product aims to simplify the table search process by providing users with real-time information on table occupancy and availability, allowing them to search for tables based on their preferences or table number.


How might we reduce the time and effort required for customers to find an available table in the food court?

Customers in a crowded food court often face difficulty in finding available tables, particularly during peak hours. Customers need to walk around the food court to search for tables, which can be inconvenient and time-consuming, especially for those visiting with young children or carrying shopping bags. There is a need to simplify the table search process and provide real-time information on table availability to enhance the dining experience for customers.


Providing Information on Table Occupancy

The idea of this mobile app is to simplify the table search process in a crowded food court by providing real-time information on table occupancy and availability. Each table will be assigned a unique table number and equipped with pressure sensors that provide accurate occupancy data.

With this app, users will be able to:

  • skip walking around to search for unoccupied tables
  • quickly locate available tables based on their personal preferences, such as proximity to specific vendors, seating capacity, or distance from high traffic areas
  • know their friends' locations easily by using the assigned table number and the detailed floor plan
· Video Demo ·
Searching by Table Number / by Preference
· Walkthrough ·
Searching by Table Number
· Walkthrough ·
Searching by Preference

On-Site Observations of Customer Pain Points

On-Site Observations

I performed 3 site visits, each lasted for 40-60 minutes, to gather information on the issues and the inconvenience faced by the customers when they visit the mall’s food court.


Utilizing Scenario Mapping & ERAF System Diagrams

I used the scenario map and ERAF system diagram to summarize the data from my observations, identify the potential areas for improvement and brainstorm ideas.

Attracting More Visitors by Enhancing the Dining Experience

Currently, the mall takes a passive role in managing the food court and only provides basic maintenance. However, by enhancing the dining experience in the food court, the mall can attract more visitors as many consider eating in the food court a part of their shopping itinerary.

The mall can work on facilitating the dining experience and providing more supports to customers. The proposed ideation, a table occupancy indicator, if adopted by the mall, will be able to provide a smooth and seamless dinning experience for customers.

Scenario Map
ERAF Diagram
Data Visualization

Customers who bring kids to the food court usually take a longer time to find a table due to

  • slow walking pace
  • distracted kids
  • space needed for the stroller
  • large party size

A table occupancy indicator can minimize the time spent on walking around in the food court.

More customers bring kids to food court during lunch hours probably because they prefer to have the kids back home earlier in daytime.

Providing table suggestions can facilitate efficient use of space. For example, by grouping small party sizes into adjacent tables, larger tables with more space can be reserved for customers with larger parties or those with kids.

More customers carry shopping bags to food court during dinner hours mainly because they visit the food court after shopping at the mall.

The ideation can minimize walking around and increase customers’ interests in dining in the food court.

Customers who come and order in a large group sometimes take a longer time to place an order and get their food because they need time to discuss and decide on what to get.

During peak hours, area B in the food court is less crowded compared to the larger area A. In one of my observations, a family had to navigate from area A to B while pushing a baby stroller, which was challenging due to the high foot traffic.

A table occupancy indicator can help utilize both areas efficiently by providing the occupancy information in different seating areas. This will allow them to choose less crowded areas without having to walk around.

Leftover food containers and uncovered bins in the tray areas can make these areas unsanitary and unappealing for customers to sit near. As a result, most customers try to avoid these areas.

While increasing cleaning can help address this issue, a table occupancy indicator can also help customers find a table based on their preferences.


Focusing on Utility & Practicality


I chose a dark background with sharp and contrasting colours for highlights because this app focuses on utility and practicality. The dark background and sharp highlights provide easy visibility and contrast, and help bring users’ focus to the most important information.


The typeface “Inter” was used because of its excellent readability on digital screens. Also, the modern and minimalist style complements the app’s focus on utility.

Style Kit

Optimizing User Experience

Home Screen

Initially, the floor plan, search function and general information were planned as separate screens. However, after considering most users would want to check the occupancy rate before searching for a table, all three functions were merged into the home screen to provide a more streamlined experience.

Search Results

In the final version, an overview of all tables is provided to replace the need to tap 'next' or swipe to view details of different tables.

Symbols and text placements are used to indicate fulfilled criteria, making it easier for users to understand table details. The 'New search' button has been removed, as users can simply click on the arrow in the top left corner to go back and navigate the app more efficiently.

Try the Prototype


Areas of Improvement

There are some areas of improvement for this project. For example, using colours to represent the overall occupancy information on the top of the home screen may not be the most effective approach, as users may interpret colours differently. Instead, symbols or other visual indicators could be used to provide clearer supplementary information.

Also, if I had more time, I would experiment with different colour schemes as the dark background may not be the most visually appealing to some users. Exploring alternative methods for presenting criteria fulfillment in the search results could be beneficial too, as the current approach is a bit redundant.