top of page
Dine App- Seamless Dining Experience
ABOUT
As part of my academic UX project, I developed a twin application ecosystem called Dine Menu and Dine Run. The idea for this project arose during a group visit to a restaurant amidst the COVID-19 pandemic, where we experienced a stressful and unpleasant dining experience due to social distancing and no-contact protocols. We struggled to decide on our food orders, and once we were ready, we had to wait for a server's attention. This experience made me realize how challenging it is to memorize menu items while placing an order.
MY ROLE
In my capacity as the sole UX designer, I followed a systematic design process for this project, from its inception through to the final design, utilizing research, ideation, and UX design principles. My primary objective was to create a fully functional ecosystem that incorporates fundamental user interactions and intricate application architecture.
About
Dine Menu and Dine Run is a twin application ecosystem that I created as part of my academic UX project. As the sole UX designer, I designed this project from inception to final design through research, ideation and UX design principles.
Context
The initial occurrence of the void was initiated with one of our group visits to the restaurants during the recent COVID pandemic. With social distancing and no contact in place, the dining experience we had was very unpleasant and stressful. It took us quite a while to decide on what to eat and once we were ready, we had to wait another couple of minutes to gain the attention of the waiter. That is when I also realised how difficult it was to memorise something you are about to order.
The process was very inefficient and I sensed an opportunity to build something that would magically help us decide and place orders without having to wait.
Initial Challenges
Create an interactive restaurant menu application that makes the dining experience more enriching, convenient and efficient.
Map specific dining use cases and address them by studying human behaviours and patterns.
The app should be aesthetically pleasing, easy and intuitive to use.
Process Overview
1. Research
Research Goals
User Interviews
User Surveys
Landscape Analysis
Need Identification
2. Define
Problem Statement
Objectives
Personas
Behaviour Mapping
User Journey Map
Product Goals
3. Design
Brainstorming
Ideations
Solution Brief
User Task Flows
Information Architecture
Wireframing
UI Design
High Fidelity Screens
4. Development
Prototyping
User Testing - In Progress
Feedback - Next Stage
1st Iteration
Development
1. Research
Research Goals
At the outset of this project, I felt it was important to identify as best as I could what aspects of the dining experience was being liked and disliked by the mass.
I decided to start the research by conducting some preliminary user interviews. To keep things compact, I set these initial research goals:
-
Identify the positive and negative experience markers
-
Identify strategies to promote more pleasant dining experiences
-
Understand the pain points that make the experience unpleasant
I also resolved to answer the following questions:
What aspects of the experience would users like to see improved?
What are the ways by which both customers and the restaurant get value addition?
User Interviews
In order to empathize more, it is very important to interact with actual users. And not just users, but other stakeholders as well. Understanding the entire ecosystem of culinary experiences, especially restaurant owners, how things work, organizational hierarchy, what to do in a restaurant, how waiters organize their day on a regular basis must be understood very well.
Sampling size
Sample size: 7 (4 foodies, 2 waiters, 1 restaurant owner)
Sample Procedure: Convenience Sampling
Sample Contact Method: In-depth interview with phone and video calls
Before asking the interviewees, I informed them about the project, and they agreed to conduct and record the interview and pointed out that the subject analysis of the data was used only for academic purposes.
1. Insights from the foodies
Foodie 1 (Female-31Y)
"Diggin is one of my most favourite hangout places as it is also very close to my workplace. The ambience, music and food are simply amazing. But I always feel the service is too slow as they run full most of the time. At times I also feel the urge to walk into the kitchen and ask if my order is ready." Pain Point
Foodie 2 (Male-34Y)
"One of my worst dining experiences was at (this restaurant) in Greater Kailash where the waiter rarely showed up and each time we want to order something, we have to wait for the waiter to show up." Pain point
"Please look into the option of splitting bills based on what each individual eats. It is inconvenient as we hang out as a group every day after office and split bills equally between everyone. People who haven't had much also have to pay the same as someone who ordered a lot." Opportunity
Foodie 3 (Female-28Y)
"it would really make sense to have an application that would carry all the menu from all the restaurants in the world and I'll never have to wait ever again, neither for the menu nor for the waiter." Opportunity
Foodie 4 (Male-26Y)
"Well, I remember a lot of times when I am stuck in traffic on my way to a restaurant. It would make some sense in being able to pre-order and let them know an estimated time of arrival for me to save time and enjoy a good dining experience." Opportunity
2. Insights from the staff
Staff 1 (Male-33Y)
"I do my best to go around all my tables and make sure their requirements are met. Yet sometimes the diners get angry at me for not attending them. I don't understand why this is happening." Pain Point
Staff 2 (Male-38Y)
"With all the responsibilities in the kitchen, I sometimes get confused on which item was to go where. Currently, we use a manual chit system, but soon hope to do it in the computer." Opportunity
2. Insights from the Restaurant owner
Owner (Male-39Y)
"During the pandemic, we realised the need of a QR based menu system that not only follows the protocols but also makes the service efficient and convenient for our customers." Opportunity
"We are in talks with a lot of companies who make online menus for restaurants. They give us complete software that helps us manage our accounts and orders too. But it does cost a lot." Current Scenario
"I don't mind paying a tiny percentage of profits per customer to any app that brings in loads of customers." Opportunity
"We often feel the need to have software that can manage all our in-restaurant orders and keep us on track with efficient service." Opportunity
User Surveys
I used Google Forms to prepare and share an online survey. The survey was divided into three sets of questions. The first section contained a series of single-answer questions about demographics. In the second section, a statement is made about our area of study (restaurants, eating out, etc.) and respondents are asked to choose from a variety of possible answers that reflect the strength of their views on that particular statement. Was done. Finally, the third section also contained questions about the domain, but respondents were free to choose the ones they were interested in or enter their own answers as needed.
After having several people complete the survey, I was able to view the collection of data in a google excel sheet. Columns with numerical information such as the number of languages spoken or types of restaurants enjoyed were easy to use to obtain percentage values and interpret. Other information took a little more intuition to interpret such as comparing genders (male, female, prefer not to say) and how each responded to questions such as phone usage.
One of the most useful questions in this survey was: “When looking at the menu, I like to see…”, where the user was able to select from any of the predetermined options provided and even input some of their own.
From this, I was able to observe that most users (80%) preferred to have pictures when looking at a restaurant menu. Additionally, I noticed that many users (75%) liked to have the price label present on menus. I also gained some interesting user insight from the responses to this statement in our survey:
The majority of respondents opted to use their phone, which tells us that mobile technology is likely present and actively being used when an individual is at a restaurant. This provides a doorway to applications to assist our users while they are dining out. Correlating this information with other findings in the survey further carves out this niche I am trying to establish with the users. The responses to our question “How do you go about making a decision on what to eat in a restaurant?” exemplify this:
In conjunction with mobile usage, I can see from these responses that users attempt to utilize more options than just the restaurant’s menu when eating out. Users largely rely on this supplemental information through reviews from other people. While dining out as a group people also tend to change their orders based on what others are ordering. I want to offer users an application that takes this factor into account.
Landscape Analysis
With the user interviews in mind, I started looking around for other existing systems that do similar things to what I envisioned. Let’s face it, if there is a product already out there that does exactly what we want to do, then we shouldn’t waste time and resources reinventing the wheel without having any new advantages to propose. The following is a list of potential competitors that were considered from which I could learn from.
Need Identification
With these insights in mind, I established some initial design features and parameters to base the system on:
-
Provide a fast, usable, and convenient method for the application to determine where the user is at, with minimal effort from the user. Whether it be by scanning a QR code or a GPS location-based identification.
-
Standardize content, and provide consistent information across all restaurants: This is so we can bridge the gap between the variability of menus between different restaurants and what information the customer needs to be able to enjoy their dining experience.
-
Create a unique identity by using brand colours to reflect the restaurant they are at.
-
Possibility of multiple payment methods or bill splitting between users. This can be done by creating a user account database to track and combine users sitting on a common table and an integrated payments system.
-
Possibility of a second app that the restraunts use to upload and customize the menus and mange orders.
2. Define
Revised Problem Statement
Based on the research, I determined that there is a general need to create a digital interactive menu that enriches the diner's experience that encompasses modern-day dining scenarios. It was also apparent that as a byproduct a restaurant management app is also required that would help restaurants to manage and operate their menu's and orders.
My goal is to design a product, which addressed this need.
Objective
To understand deeply the user behaviours in a modern dining scenario and design an ecosystem of applications that facilitate an interactive ordering experience and a management app that helps restaurants manage menus and orders.
Personas
A user persona is a representation of the goals and behaviour of a hypothesized group of users. Here the personas are synthesized from data collected from interviews with users.
.png)
Behaviour Mapping - Diner
Next, I tried to look deep into the behaviour of the customer in a dining environment, their patterns and how they chooses to take a certain step. This encompasses mapping every patterns and dependencies that are involved at every stage of the customers journey.
User Journey Mapping - Diner
Based on the above behaviour mapping, I decided to work on a user journey map to understand the pain points and opportunities that are involved in the entire journey.
%20FINAL.jpg)
Project Goals
To create an ecosystem of applications that helps solve the above-formulated problems that benefit users from both ends.
Create Dine Menu and Dine App, an ecosystem that helps enrich the experience of both customers and restaurant owners.
3. Design
Brainstorming
I started the brainstorming session by writing down all the important features that I had to incorporate. Once I started drawing ideas for search a product picture starts to emerge out of it.
Ideations
With the above features, I started bouncing many ideas using sketches and tried quick prototyping to check its usability.
Solution Brief
The solution brief for the Dine Menu app is as follows:
What: A product for diners to create more pleasant, enriching and efficient dining experiences. It should encompass features like pre dine booking, live preparation statuses and split payments.
For: the Diners and restaurants
How: A mobile application with an interactive menu that gives the customer more control to submit food orders directly, create customized orders to the kitchen and help them pre-order as they arrive at the restaurant.
Information Architecture
Based on the ideation I laid down the major task flows for the application and designed the information architecture framework for both Dine Menu and Dine Run (conceptual)
Dine Menu: Information Architecture
Dine Run: Information Architecture
Low Fidelity Wireframes
Once the information architecture was finalized, I moved on to converting the selected ideation sketches to an organised and functional layout in multiples of 8px.
Login Screen
Dine in
Dine in Menu
Pre-Dine Code
Dine in Orders
Pre-Dine Search
Payments
UI Design
After the wireframes were constructed, I moved on to creating a UI scheme for the same. The idea was to keep it as clean and minimal as possible for the real brand to shine out. I had provided space on the top for partners branding for which I created a colour card with a logo embedded inside. I started giving some soft corners to the elements to match up with iOS standards.
High Fidelity Screens
Followed by the UI design, high fidelity screens were developed for the remaining flows. The screens are as seen below:
Dine Menu: Dine in Flow
Splash Screen
Login
Home
Restaurant Home
Menu Order Page
Payments
Dine Menu: Pre Dine Flow
Pre Dine Home
Search
Restaurant Home
Pre Dine Order
Payments
Time of Arrival
Dine Run: Full Flow
Add Details Page
Upload Logo
Select Colours
Select Theme
Waiter's View
Kitchen View
Manager View
Menu Page
Offers Page
Dine Menu: Prototype
Dine Run: Prototype
Dine App Prototype
bottom of page