Mediterranean Restaurant
App | Responsive website
The product
I designed an app and responsive website for a Mediterranean restaurant. Homeyfood is a Mediterranean restaurant that cooks fresh and delicious homemade food, Mediterranean food that everyone loves, whether it’s for special occasions or parties.
View the Homeyfood app in Figma
high-fidelity prototype
View the Homeyfood website mobile in Figma
high-fidelity prototype
View the Homeyfood desktop website in Adobe Xd
high-fidelity prototype
The goal
Design an app for Homeyfood’s restaurant that allows users to easily order and deliver fresh Mediterranean dishes.
The problem
A restaurant in a small place that works only on Fridays. The restaurant accepts phone orders and uses flyers to promote the business.
My role
UX designer leading the app and responsive website design from conception to delivery.
Responsibilities
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs, determining information architecture, and responsive design.
Low-fidelity prototype
I created a low-fidelity prototype. The primary user flow I connected was building an assembly dish so the prototype could be used in a usability study.
View the homeyfood restaurant in Figma
low-fidelity prototype
Paper wireframe
I took the time to draft iterations of each screen on paper, I was able to ensure that the elements that made it to the digital wireframes would be well-suited to address user pain points. The images on the home page needed to be large, beautiful which would encourage users to order the dish they want.
Digital wireframe
As the initial design phase continued, I made sure to base screen designs on feedback and findings from the user research.
Its users need to use the app for shipping and quickly pay.
Usability study findings
I conducted two rounds of usability studies. 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.
1
Users want to order food quickly.
2
Users want more customization options.
3
Users want a delivery option.
4
Users want a Vegan and kids mark on dishes.
Mockups before and after usability study
Early designs allowed for some customization but after the usability studies, I added clear buttons add to the cart, I also revised the design so users see all the options when they are on assembly dishes In the navigation bar.
The users mention a problem with accessibility colors and call-to-action buttons. I also improved the navigation bars
Mockups
The final app, website mobile.
High-fidelity prototype
The final high-fidelity prototype presented cleaner user flows for assembly dishes. It also met user needs for a shipping option as well as clear payment.
User research summary
I interviewed and created maps to understand the users and their needs. The primary user group identified through research was Busy working folks who don’t have time to cook meals on weekends.
User research pain points
Time
Working adults are too busy to spend time on meal prep.
Interaction
They don’t know how to cook Mediterranean dishes.
Accessibility
Platforms for ordering food are not equipped with assistive technologies.
Covid-19
They are anxious to sit in a restaurant so prefer to eat at home.