![](https://static.wixstatic.com/media/f77a35_4f2f1e4be73b4de9a621ca5dc166d4de~mv2.png/v1/fill/w_972,h_546,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_4f2f1e4be73b4de9a621ca5dc166d4de~mv2.png)
Project Overview
About the project
Eat Repeat is a restaurant which serves delicious food around the city. Restaurants that are often busy have trouble serving patrons in a timely patrons. They required an app for menu and payment process in order to save the time for customers.
The Problem
Menus with too many items cause confusion and hesitation when trying to order food. Customers need to wait for the waiter to take their order to the kitchen.
The Goal
Design an app where the users can order their food instead of waiting for the waiter and make the payment online from their table itself.
My Role & Responsibilities
Researcher, UI designer, Visual Designer, Interaction designer.
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.
Project Duration
6 weeks
User Research
I conducted interviews and created empathy maps to understand the users I’m designing for and their needs. A primary user group identified through research was working adults who don’t have time to cook meals.
This user group confirmed initial assumptions about the customers, but research also revealed that time was not the only factor to give the order. Other user problems included obligations, interests, or challenges that make it difficult to wait for order and also for the payment process.
Pain Points
1
Time
Most of the customers were not able to order food with assistive technologies
2
Accesibility
Most of the customers were exhausted to wait for the waiter
3
IA
Text-heavy menus in apps are often difficult to read and order from the application.
User Persona
![](https://static.wixstatic.com/media/f77a35_a5a0ef03c7714367b34e56129a24719a~mv2.png/v1/crop/x_502,y_191,w_864,h_480/fill/w_864,h_480,al_c,q_90,enc_avif,quality_auto/f77a35_a5a0ef03c7714367b34e56129a24719a~mv2.png)
Ideation
Paper Wireframes
![](https://static.wixstatic.com/media/f77a35_b8764ec7fe5e4cf6a7dae77e1dab9d47~mv2.jpeg/v1/fill/w_433,h_433,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_b8764ec7fe5e4cf6a7dae77e1dab9d47~mv2.jpeg)
![](https://static.wixstatic.com/media/f77a35_20b1e55361084d179452cd66b8e1cb6e~mv2.jpeg/v1/fill/w_433,h_433,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_20b1e55361084d179452cd66b8e1cb6e~mv2.jpeg)
Digital Wireframes
![](https://static.wixstatic.com/media/f77a35_95a2ca99ea024f448a89ad000d242b21~mv2.png/v1/fill/w_852,h_476,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_95a2ca99ea024f448a89ad000d242b21~mv2.png)
Low-fidelity Prototype
![](https://static.wixstatic.com/media/f77a35_6b28a6d156c0436ea0463e33c4b855bf~mv2.png/v1/crop/x_257,y_252,w_919,h_468/fill/w_846,h_431,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_6b28a6d156c0436ea0463e33c4b855bf~mv2.png)
Usability Study- Findings
I conducted usability studies of two rounds. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.
Round 1 Findings
-
User wants a confirmation before placing the order
-
User wants the buttons to be larger and visible
-
User want to order food very quickly
Round 2 Findings
-
User cannot find the added items.
-
User wants the checkout to be simple
Refining the Design
Mockups
![](https://static.wixstatic.com/media/f77a35_6e7a2ad7b904492eb7f8412563d3db5b~mv2.png/v1/fill/w_459,h_532,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_6e7a2ad7b904492eb7f8412563d3db5b~mv2.png)
![](https://static.wixstatic.com/media/f77a35_5d4d0b82629b4252a7c2f04ceb1c7821~mv2.png/v1/fill/w_627,h_539,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_5d4d0b82629b4252a7c2f04ceb1c7821~mv2.png)
![](https://static.wixstatic.com/media/f77a35_5274ecb474a5489e8aa1128ec713c938~mv2.png/v1/fill/w_471,h_539,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_5274ecb474a5489e8aa1128ec713c938~mv2.png)
![](https://static.wixstatic.com/media/f77a35_b98f6740d1f34271a5a2a9b3a83e572f~mv2.png/v1/fill/w_627,h_539,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_b98f6740d1f34271a5a2a9b3a83e572f~mv2.png)
High- fidelity prototype
![](https://static.wixstatic.com/media/f77a35_4590154fa5b3428cb263808374893747~mv2.png/v1/crop/x_247,y_161,w_948,h_569/fill/w_945,h_567,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/f77a35_4590154fa5b3428cb263808374893747~mv2.png)
Accessibility considerations
-
Color Contrast has been considered and made it accessible for all users. I have used the WCAG tool to check the color contrast for buttons, backgrounds and icons.
-
I have considered the accessibility for Text Sizes, Font Type and Focus Indicators on all the screens.
-
I have made sure that users can navigate through the app and can perform actions even using a screen reader.