Ichiraku is a Japanese restaurant mobile app. It aims to introduce the delicacies of Japan to all the food lovers.
Why is it designed?
Challenges identified
• Easiness to use and quickness to place orders from resturant app. • Placing orders from table. • Lack of ATs (multi-language support) to help non-native users. • Lackof flexibility in communication with food delivery partners.
Goal
The app is designed for inclusive experience focused on wide range of users especially users with language barier and users who focus productivity over waiting in long queues to order food.
My role
Overview
• UX designer performing - Research, Visuals, Interaction and Motion design from conception to completion for this app. • Design Tool: Figma, Google Jamboard.
Contribution details
• Conducting User Research – Creating empathy maps, Personas, User stories & Journey maps, Defining problem & Hypothesis statements, User Flows, Competitive Audit. • Creating Wireframes. • Creating Low Fidelity prototypes. • Usability Study Plan and Research. • Creating Spread sheet notes and Affinity Diagrams to develop insights. • Creating Sticker sheet, Mockups and High-Fidelity prototypes using Figma. • Accounting for Accessibility and Iterating on the design.
User Research: Summary
I conducted interviews and created empathy maps to understand the users.
Target Audience
Primary user groups identified were adults (within age group of 18 to 60) with: · Tight schedules/ Productivity concerns. · Language barrier. · Low/ limited technical literacy.
Pain points identified
· Time – Easy and quickness to order food. · Accessibility – Multi-language support. · Features – Table orders.
Personas
Persona 1 - Ngele Nkota
Problem statement:
Ngeleis a busy individual who is primarily focused on his productivity and sometimes prefers to work while he eats at a restaurant and sometimes he orders takeaways to enjoy with his friends from work.
Image – Persona: Ngele Nkota
Persona 2 - Lara Smith
Problem statement:
Lara is non-native to English who requires multi-language feature and she prefers to order food from apps that are simple and straight forward.
Image – Persona: Lara Smith
User Journey Map
Mapping user journey revealed how helpful it will be for users to be able order food hassle free, without waiting in long queues and also multi-language support to help them throughout before ordering, which only makes it a more memorable experience.
Image - User Journey
Wireframes
Paper Wireframe
By drafting iterations of a screen on paper ensured that the elements which made it to digital wireframes would be well-suited to address user pain points.
Image - Paper Wireframe set (1) of Ichiraku App
Image - Paper Wireframe set (2) of Ichiraku App
Digital Wireframe
As the initial design phase continued, I made sure to base screen designs on feedback and findings from user research. Easy order and navigation were the key user needs to address in the design in addition to equipping the app with multi-language support.
Image (1) - Digital Wireframe of Ichiraku App
Image (2) - Digital Wireframe of Ichiraku App
Low - Fidelity Prototype
In this early version of prototype, design is more focused on user flow. ("Design changes" can be found under usability study)
Image- Low Fidelity Prototype of Ichiraku App with links connecting all the screens
Usability Study finding
No.of participants – 5
Round 1 Findings Summary
· Auto-login or stay signed-in feature. · Language accessibility in login and other sub-sequent screens. · Easily accessible navigation to previous orders. · Users need more intuitive icons/buttons to edit order
Design changes
Early designs allowed for some customization as follow -
The initial design paved way for further discovery of design direction during usability study and the research participants provided insights on their concerns and added suggestions that would make their experience better.
After Usability Study 1
· Added “stay signed-in”. · Multi-language feature in login and all subsequent pages. · Add (+)/ remove (-) items buttons change. · More intuitive check out button. · Quick navigation to previous orders.
Image (1) - Final design of Ichiraku App highlighting design changes after Usability Study 1
Image (2) - Final design of Ichiraku App highlighting design changes after Usability Study 1
Round 2 Findings Summary
· More spacing between contents. · Food rating can be made easier to read.
After Usability Study 2
· Removed info snippet from home screen, allowing for more breathing space. · Add(+)/ remove (-) item button design change. · Numeric rating. · Track order icon change. · Minor Visual upgrades.
Image (1) - Final design of Ichiraku App highlighting design changes after Usability Study 2
Mockups
Sample mockup images from the app
Image - Ichiraku App Welcome Screen
Image - Ichiraku App Landing Screen
Image - Ichiraku App Menu Screen
Image - Ichiraku App Checkout Screen
Image - Ichiraku App Order Tracking Screen
High - Fidelity Prototype
The final prototype presented smooth user flows for users to order food from the restaurant – ICHIRAKU
It met the user needs basis initial usability studies.
Image- High Fidelity Prototype of Circle App with links connecting all the screens
· Contrasting colors, icons and explicit instructions to help users navigate easily. · Voice search feature as an alternative to assist users. · Multi-language feature is made available in the design even in login/user registration.
Takeaway
Impact
· The app offers lot of flexibility and features which makes users feel the app is inclusive and simple for diverse demography.
What I learned
While designing Ichiarku app, I learned that a simple, direct and flexible experience was found to be more meaningful to users and the usability studies influenced each iteration of the app’s design. It showed how a simple design change can also significantly impact user’s experience.
Next Steps
Conduct further rounds of usability studies to validate whether the pain points are effectively being addressed with an intention to explore and bring new design ideas that help elevate user experience.
THANK YOU!
For your time reviewing my work on Ichiraku Mobile App. If you’d like to get in touch, please fill the form below and I will get in touch with you :-)
%20US1.png)
%20US1.png)
%20US2.png)
