-
Ramen House
Designing a self-ordering kiosk for a restaurant. -
Process
1 - Research
2 - Ideation
3 - Design
4 - Reflection -
Role / Duration
UX/UI Design
Prototype2 weeks
-
Overview
The "Ramen House" project is a UX/UI side initiative focused on designing a self-ordering kiosk for a ramen restaurant. The primary goal is to enhance the customer experience by streamlining the ordering process through an intuitive and engaging interface.
-
Problem
The rise and usage of technology is increasing more and more each day. It’s no doubt that we’re headed towards the efficiency that machines provide us. My challenge is to design and mock up a complete menu and order option for a ramen shop. -
Solution
Intuitive Menu Navigation: Design a user-friendly interface that allows customers to effortlessly navigate the menu. Implement clear categories, such as types of ramen (shio, miso, shoyu, tonkotsu).Efficient Ordering Process: A straightforward checkout system that summarizes the selected items and allows users to modify their orders before confirmation.






RESEARCH
How Might We
I started with a list of “How Might We” statements to lead the direction and goal of this design.
Maintain a cohesive and visually appealing theme consistent with the branding of the ramen shop, creating a memorable and aesthetically pleasing experience for users?
Simplify the ordering process to make it efficient and user-friendly, reducing the steps required for customers to place and confirm their ramen orders?
Utilize visual elements such as icons and images to make the menu more engaging and help users quickly comprehend the different ramen options?
Design a seamless transition between the online menu and the physical dining experience for customers who choose to dine in, maintaining consistency and enhancing the overall customer journey?
Personalize their ramen orders effectively, providing a seamless and enjoyable customization experience that caters to individual preferences?
Design a visually appealing and informative presentation of each ramen dish, including detailed descriptions and high-quality images, to entice and inform customers about the menu items?
Brainstorm
I also created a 1-minute word cloud to brainstorm any ideas or thoughts going into the design.
Mood Board
I went on Pinterest to create a mood board for the ramen shop's design. I want to capture the overall feel and ambiance I want to convey. By curating images, colors, and textures that evoke the desired atmosphere, a mood board serves as a creative guide for the design process. This approach allows us to ensure that the UX/UI elements align harmoniously, reflecting the intended mood and resonating effectively with our customers.
IDEATION
User Flow
This would be the typical user flow from the time they begin their order until receiving their food.
Crazy 8’s
I used the Crazy 8’s design process to rapidly generate ideas without worrying about the nitty gritty details. I spent 1 minute per wireframe.
Paper and Digital Wireframes
DESIGN
Hi-Fidelity Interactive Screens
There are two important areas to consider for interaction: ordering and summary. The goal was to create a simple way for users to pick the ramen of their choice and a summary before completing their order.
Ordering Interaction
• When an option is selected the button turns, and/or stays, orange.
• The summary page can be navigated to by tapping:
(1) The Cart represented by the circle icon on the top right
(2) Complete Order button below.
Summary Interaction
• Size: Users can easily choose between a small and regular by tapping the button.
• Quantity: Tap the minus (-) or plus (+) button to change the desired quantity.
REFLECTION
A key takeaway from my exploration into user experience is the significant impact of micro-interactions in instilling user confidence. I've come to appreciate the importance of eliminating any potential uncertainties for the end user, striving to make every interaction seamlessly intuitive. This project has been enjoyable as it allowed me to delve into my own thought processes, identifying areas for growth and enhancing my understanding of creating a user-centric design.