Umai App

Improve dinning experience for users

Role

UX/UI Designer

Industry

Restaurant

Duration

2 months

Project Overview

Dining should be fun and easy, but for many at Umai, a popular Japanese restaurant, it wasn’t. Complex menus, language barriers, slow ordering and no allergen info meant confusion and frustration. So myself and Pedro de Almeida we designed an app to make every part of the Umai dining experience better.

Project Overview

Whole Dinning experience thorugh phone Explanation

The Problem

Traditional Umai experiences were hindered by:

Complex Menu Navigation: 30% of customers found the menu too hard to navigate.
Language Barriers: 16% couldn’t understand the menu due to limited translations and Japanese terminology.
Slow Order Processing: Slow ordering meant longer wait times and annoyed customers.
No Allergen Info: 7% of customers with dietary restrictions couldn’t find clear allergen info, limiting their meal options and putting their health at risk.

Usual Client quote:

"I like the food here but the menu is so confusing. I end up ordering something I didn’t expect because I couldn’t understand the descriptions." — Emily, first-time visitor.

My Role and Collaboration

I was the Product Designer for this project, from concept to high-fidelity prototype over three months. Collaboration was key:

Customers: Interviewed and usability tested over 10 customers.
Restaurant Staff: Spoke with servers and management to understand operational pain points.

User Research

Interviews and Surveys

To get to the bottom of the issues we:

4 In-depth Interviews: Explored individual dining experiences, pain points and desires.
Online Survey with 100 participants: Quantitative data on common pain points and preferences.

Persona
Name: Sarah
Age: 28
Background: Foodie with gluten allergy.
Goals: To eat out without worrying about allergens or confusing menus.
Frustrations: Can’t navigate complex menus and doesn’t trust due to lack of allergen info.

Competitve Analysis

We looked at five popular dining and restaurant apps to find gaps:

Limited Multilingual Support: Most apps had limited language options.
Complex Menu Navigation: No visual aids.
No Allergen Info: Few apps had allergen filters.

Outcomes

Inclusive Design: For non-native speakers and people with dietary restrictions.
Simplify Ordering: Reduce wait times and improve satisfaction.
Transparency: Show detailed allergen info to build trust and loyalty.

Competitve Analysis

We looked at five popular dining and restaurant apps to find gaps:

Limited Multilingual Support: Most apps had limited language options.
Complex Menu Navigation: No visual aids.
No Allergen Info: Few apps had allergen filters.

Outcomes

Inclusive Design: For non-native speakers and people with dietary restrictions.
Simplify Ordering: Reduce wait times and improve satisfaction.
Transparency: Show detailed allergen info to build trust and loyalty.

Ideation and Design

Used FigJam for collaborative brainstorming and idea generation.

Methods

Mind Mapping: 30+ ideas for menu navigation, language support and allergen info.
Crazy Eights: Rapid sketching for key features and layouts.

Information Architecture

Designed user flows and sitemap to ensure easy navigation and quick access to key features.

Wireframing

Low-fidelity wireframes to establish the basic structure and layout of the app

Ideation and Design

Used FigJam for collaborative brainstorming and idea generation.

Methods

Mind Mapping: 30+ ideas for menu navigation, language support and allergen info.
Crazy Eights: Rapid sketching for key features and layouts.

Information Architecture

Designed user flows and sitemap to ensure easy navigation and quick access to key features.

Wireframing

Low-fidelity wireframes to establish the basic structure and layout of the app

Prototyping

High-fidelity prototypes in Figma for key screens:

Home Screen
Menu Navigation
Order Process

Prototyping

High-fidelity prototypes in Figma for key screens:

Home Screen
Menu Navigation
Order Process

User Testing and Iteration

Tested with 6 customers from our target audience.

Tasks

Navigate and select a dish from the menu.
Order through the app.
Access and use allergen filters.

Feedback

Good: Users liked the visual elements and the interface.
Room for Improvement: Some users wanted more intuitive language toggles.

Actions

Language Toggle: Incorporate an easy way to change the app language any time to allow users to place and order

Design Features

Simplified Menu Navigation

Visual Menus: High res images with detailed descriptions.
Category Organisation: Logical grouping of dishes (e.g. appetizers, sushi, desserts).
Search: Find specific dishes quickly.

Multilingual Support

Language Options: English, Japanese, Spanish, Mandarin.
Easy switching: the app language can be easily changed on the setting menu

Fast Order Processing

In-App Ordering: Order directly from the app.
Customisation: Modify dishes to suit your preferences or dietary needs.
Order History: Reorder favourite dishes easily.

Clear Allergen Info

Allergen Icons: Symbols next to each dish for common allergens.
Allergen Filters: Filter out dishes with specific allergens.
Ingredient Lists: For users who need more info.

Payment Option

Multiple: Apple Pay, credit/debit cards, pay at the restaurant.
Split Bill: Split the bill among multiple people in the app.

Live Order Tracking

Real-time updates: Notifications on order status from prep to ready for pickup.
Estimated Wait Times: Transparency and managing customer expectations.

Conclusion and Takeaways

Personal Development

Empathy-Driven Design: I can design solutions that address real user fears and needs better.
User-Centred Approach: I know the importance of involving users throughout the design process.

Key Takeaways

Iterative Design: Testing and feedback is key to refining features.
Communication: I can explain design decisions and reasoning better.