Branding, Visual Design & UI/UX

Simplifying table booking with a digital app

Simplifying table booking with a digital app
Year
2021
Role
Lead Digital Designer & Creative Head
Company
Table Buddy

Abstract

Our clients (Rakesh and Ryan) wanted to launch an app that caters to online table booking for restaurants. They already had the app designed, but when they approached us for branding, we realized that we can improve the app design. We modified the app, now called Table Buddy, into an app that caters to a complete, contactless dining experience adding features that would uniquely position the app in the market. 

The app is currently in the development phase, after which we will move onto the brand launch and marketing phase. 

Overview 

The 2019 global pandemic impacted the world as we knew it, changing our everyday routines to essentially how every organization and industry was operating. One industry that took a big hit during the pandemic is the restaurant industry. 

Restaurants had to close down dine-in and survive on deliveries and takeaways for a while. Even when lockdowns across the globe were gradually lifted, certain SOPs were set in place that needed to be strictly followed. Resultantly, restaurants had to face staffing limits and a lack of customers, which put a serious strain on their revenue. 

In May 2021, we are approached by Rakesh and Ryan for the branding of an online table booking app, we were immediately drawn to the project. The solution was pragmatic and opportunistic, so we believed it would perform well given the current scenario. 

Before proceeding to the branding, we conducted a design audit to ensure that the branding ideology resonated with the app’s functionality. However, the design audit brought to our attention several challenges linked with the current version of the app: there was a lack of features, limited functionality, and it did not align with the business goals. 

Luckily for Rakesh and Ryan, the Little Team is also skilled to design apps that function efficiently (yay, team!). Therefore, we were brought on board for the entirety of the project, including branding, product design, UI/UX design, and marketing. 

Branding 

We knew that the first step was creating a brand identity that resonated with the product’s purpose as well as with its potential users. 

Brand Name

When it was time to choosing a brand name, there was a lot of brainstorming. Like seriously, a LOT. We wanted to pick a name that was self-explanatory to the purpose. Furthermore, since Arabic is Bahrain’s official language, we wanted to choose a simple name. Lastly, food delivery apps are abundant in the industry, so we didn’t want a name that might confuse a user into thinking it is another food delivery app. 


Based on the given criteria, we finally settled on calling the app “Table Buddy”.

Tagline: Your Very Own Companion Elevating Your Dining Experience

Brand Logo

The logo was kept simple, with the brand name legible. A circle was added to represent a table in a restaurant, and a subtle smiley was formulated using the word ‘buddy’ to further enunciate our concept of offering a companion in your dining experiences. 

We chose the colors deep burgundy and mustard as the logo’s foundation, as they were eye-catching yet soothing to look at. 

Our client wanted a logo that was easy-to-understand but also visually appealing. Safe to say, the logo we designed successfully catered to both aspects. 

UI/UX Design

Product Features 

Initially, our client wanted us to create an app that lets you book your tables online. However, we wanted to include some more features that would help Table Buddy stand out amongst its competition. 

After critically analyzing the existing market, we thought Table Buddy would be uniquely positioned if it enhances the users’ dining experience by offering contactless services throughout the entire process. These were the features that we added to the app:

  • View Table Placement and Book Tables: The user can choose the table and the area where they’d like to be seated (indoor/outdoor/nonsmoking). 
  • Filter Customization for Restaurant Search: Set several filters to optimize your search. Filters such as cuisine, meal-type (breakfast/dinner).
  • View Menu 
  • Place Order and Pay Via App
  • View and Write Reviews
  • Invite Guests to Restaurant
    We set this to be USP (unique selling point) for Table Buddy. Once you’ve booked a table, you can even invite your guests directly through the app. You can email/SMS the invites, send reminders, and include the GPS location of the restaurant. 

User Flow and Wireframing

The user flow is the path a user takes on a website or app to complete a task, from the entry point towards a successful and final outcome. We started by roughly sketching how the app should flow to maximize ease of use. Once the initial draft was ready, we started formally wireframing on Figma. We would get one team member to test the user flow nearly every day to ensure the app was as smooth as possible. This was a trial-and-error method, which involved regular team discussions and client feedback sessions.

Two interfaces had to be developed: one for the users who were booking tables, and another interface for Restaurant Managers. 

We decided that a mobile app would be designed for customers and a web app for Restaurant Managers and Owners. Ryan and I thought a web app would work better since managers would mostly use the interface on tablet and laptop screens. 

Mobile App for Customers 

The Booking Process 

  1. Search Restaurants: including multiple filters to optimize your search. We also included pictures of restaurants, menus, and reviews to help users decide. 
  2. Pick A Restaurant
  3. Book A Table: In this step, the user could see the floor plan and table placement. Users can also choose the area they wish to be seated in (indoor/outdoor/smoking/non-smoking).
  4. Invite Guests: Users can add guest details to send invites directly through the app. 
  5. Confirm Booking: Once the booking is confirmed, you can still invite more guests. Furthermore, we added an option to send reminders to guests and include the GPS location of the restaurant. 

At The Restaurant 

Once the booking process was completed, the app can also be used once the user has arrived at the restaurant:

  1. Check-In: Upon arrival, use the app to check-in and be placed at your table
  2. Order Food: The app will have a menu, and you can place your order via the app.
  3. Check Out: Upon completion of the meal, you can check out from the app, review your order and move to the next step. 
  4. Pay: Another USP is that you can pay your bill through Table Buddy.
  5. Review: Write a review once your experience is complete. 

Throughout this process, our objective was to ensure usability was a priority. The following are a few snippets from the wireframing process: 

Web App for Restaurant Managers and Owners 

This interface needed to include all aspects that a restaurant manager can benefit from, including reviewing restaurant performance and customer satisfaction. We included the following information: 

Business Analytics: Managers can see the overall performance of the restaurant in terms of:

  • Overall Exposure: Number of views, Search results that included a restaurant, Paid Promotions
  • Overall Income: Categorized under Last Week, Last Month, All Time, and Average
  • Overall Bookings
  • Dishes: to understand which dishes are more popular amongst customers
  • Menu: Managers can edit menus, add photos and descriptions. The app lets the manager decide if they want the price to be visible or not. 
  • Add Franchise and Managers: To cater to restaurants with multiple franchises, the app lets you add franchise details and manager details.
  • Table Management: Create and edit floor plans. 
  • Booking Requests: View booking requests, and confirm or decline. Options include viewing Bookings in Next Hour, Today’s Bookings, and All Bookings.
  • Canceled Requests: Users have the option to cancel their bookings, but managers have the authority to confirm or decline their requests. 
  • Check-In Requests: Accept check-in requests upon customer’s arrival. 
  • Check Out Requests: Review customer’s order, and send bill upon confirming check out.

Final Screen Designs 

After critically analyzing the user flow and wireframing and getting approval from the client, the next step was to start officially designing the final screens for the Table Buddy app. Our client wanted the app to be attractive and functional enough to get customers to step out of their homes to experience dining through Table Buddy.

Conclusion

Currently, the Table Buddy application is in its development phase. Once that is completed, our team will move onto the marketing phase. The global pandemic of 2019 introduced a market gap in the restaurant industry, and we believe that Table Buddy will cater to that gap efficiently.

Did we catch your attention? Come say hello!