YUSU Bakery & Café
Case Study | 2024-25 | UI/UX Design, UX Research
About
The YUSU Bakery App aims to enhance user experience by providing real-time updates on item availability, allowing customers to pre-order products, and ensuring allergen transparency. Designed with simplicity in mind, the app features a clean interface and an efficient experience for busy customers looking for quick ordering.
Problem Statement
Local bakery customers often face frustration due to unavailable items and the inability to check stock in advance, leading to wasted trips. Those with allergies or dietary restrictions struggle to find suitable options. A solution is needed to enhance convenience, personalization, and transparency while ensuring a simple, intuitive ordering experience.
User Pain Points
-
Lack of real-time updates - No way to check item availability in advance, leading to uncertainty before visiting bakery.
-
Wait times - Busy customers struggle with lines in-person and inefficient online ordering process.
-
Unclear allergen & nutritional information - Individuals with allergies or dietary restrictions struggle to find safe options without asking staff.
-
Lack of customization options - Customers have no easy way to request personalized orders
Primary Goals
-
Provide real-time updates on bakery item availability.
-
Enable fast and simple online ordering with minimal steps.
-
Offer nutritional information and allergen alerts with the providing of other alternatives.
-
Streamline the ordering process to reduce extra steps and improve customer satisfaction.
How Might We...
-
How might we ensure customers are informed about sold-out items in real time?
-
How might we improve bakery experience through mobile ordering?
-
How might we address the needs of health-conscious consumers and those with allergies?
-
How might we create an efficient user journey that enhances convenience and speed?
User Flow
Mobile Ordering Process
Browsing
Cake Customization
Information Architecture
Low-Mid Fidelity Wireframes
High Fidelity Wireframes
Full Wireframes
The home screen contains category buttons and a separate section for the most popular items based on sales and user favorites. The "Pastries" category offers two layout options to accommodate different user preferences. The grid view that shows images and price only, while the list view adds brief descriptions to allow users to make more informed decisions. The filter button sorts by dietary preferences, such as gluten-free or vegan options. Lastly, the individual item screen provides essential details, with allergen information clearly displayed, with an option to expand and see the full ingredient list.
In the "Cakes" category, it can be seen that a gluten-free symbol is labeled if applicable, clearly identifiable for those with dietary restrictions. On the individual item screen, an expanded customization section allows the users to personalize number of tiers, size, filling, and cream flavor.
The checkout process consists of three steps: pick-up date & time, payment, and payment confirmation. In Your Cart, the user can review their selected items, adjust quantities, or remove products. Next, they can either choose ASAP or schedule ahead by selecting pick-up date and time. Once confirmed, the Payment screen consists of possible payment methods with an optional tip selection. The final step is the confirmation screen with an option to review their order history/summary or continue shopping.
Branding
