Summary

Have you ever experienced a situation where you were preparing dinner for your family, and suddenly realised that a few of the ingredients were not sufficient to make one of the dishes? This is a common challenge faced by many restaurants and cafes as well.
This dilemma was the inspiration behind the creation of KitchenDash, a user-centric inventory management app designed to help cafe and restaurant owners seamlessly manage their ingredients and ensure they never run out of essential items, reduce waste and enhance their ability to provide consistent service to their customers.

Role:
Product Designer
Tools:
Figma, Illustrator, Photoshop, ProtoPie
Duration:
07/2023

Problem

Inefficient inventory management systems in restaurants and cafes lead to increased costs, waste, and operational inefficiencies.

Goal

•   Create an intuitive, user-friendly, and efficient inventory management app.
•   Empower cafe and restaurant owners to easily track, control, and optimise their ingredient inventory.
•   Provide real-time visibility into inventory levels.
•   Offer actionable insights and data-driven decision-making support.
•   Include cost-saving features to enhance operational efficiency.
•   Ultimately, improve customer satisfaction and streamline inventory management.

Solutions

Research

Interview

The interview was conducted offline through face-to-face interactions. I reached out to individuals I know who own a restaurant or work as kitchen managers, asking them the questions I had prepared and recording their responses.

Insights

1. Users would love to be able to access the ingredients from various entries.
2. Users value a feature that predicts ingredient usage based on historical data.
3. Users want a notification system to alert them when ingredients are running low or nearing expiration.
4. Users desire a streamlined process for adding receipts and updating inventory.

Opportunities

1. Over the menu section, users can check the receipt of a specific dish and view the ingredient, or add it to the cart.
2. Pop-up notification cards can be applied to the ingredients section to alert users.
3. canning the bar code of an ingredient pack can automatically fill in the information of the ingredient.

User Journey

By listing all the steps that users will take, understanding their emotions at each stage, and recognising the achievements when users complete a task, I can understand users' demand, identify key touchpoints then design a solution for their painpoints.

Persona

Ideation

Storyboard

This storyboard is a valuable tool for conveying information, generating empathy, and setting the stage for a presentation or discussion about addressing the problems faced by restaurant and cafe owners.

Paper Wireframes
User Flow

While envisioning how users would engage with the application, I couldn't help but recall an insight from the interview: users desire multiple entry points to complete their tasks. As a result, I developed two user journeys that start from different entry points - Ingredients and Menu/Recipe.

User flow - Ingredients
User flow - Menu/Recipe

While various users may initiate a task from different entry points, they will always have the option to navigate to another entry point once they complete their initial task.

This creates a loop that ensures users have a seamless experience managing their inventory and menu/recipe throughout the entire product's core function, decrease drop-off rate.

Prototype

Users can upload their menu recipes to the menu section, including all the ingredients required for each dish.

This data serves a dual purpose:
1. It provides users with insights into their top sales during
  specific periods
2. Enables users to predict ingredient usage

To assist users in recording their ingredients with minimal effort, we integrated a barcode scanner into the app. This feature enables users to utilise their mobile camera to scan the barcode or QR code on a product package, providing easy access to all the useful ingredient information from the database.

When ingredients are in shortage, a notification will be triggered. Tapping the alert icon will expand a card displaying the shortage ingredients. Within this card, users can manage their next actions to respond accordingly.

The strategy of incorporating "Ingredient details" as a core function has seamlessly connected Menu and Cart, providing users with flexibility to interact with ingredients across different tasks like inventory updates, menu customisation, and cart management, fulfilling their accessibility needs.

Usability Testing

Usability testing was conducted both online with Useberry and offline with separate groups of 5 participants each. The offline participants consisted of individuals whom I had interviewed previously. The 5 online participants were specifically targeted individuals working in the food industry with job titles such as manager or business owner.

The primary objective of this testing was to evaluate the effectiveness of the 'add ingredients' function and the shortage notification feature.

Iteration

1. One-Hand Operation
Challenge
The user may frequently find themselves selecting ingredients from new arrivals or the fridge with one hand, while using the other hand to hold the phone and scan the code to fill out information.
Taking the left-hand side as an example, from the Thumb Zone heat map, users may find it challenging to reach the top-section touch points (such as search, switch views, or notifications) with their thumb.
Solution
My solution to this challenge is to design a Thumb-Friendly Floating Action Button (FAB) that consistently floats in the bottom section of the screen, strategically positioned within the natural Thumb Zone.
Prototype
2. Ingredient User Flow Optimisation
Challenge

When I repeatedly checked the user flow, I found that although I often emphasised that the relationship between ingredients and the menu is interconnected, the previous design plan did not completely achieve this design goal.

There is a disconnection between the ingredients and the menu.

Users can create new ingredients by adding a new recipe to the menu, which involves adding new ingredients. However, In my previous design, users had no option to create a new menu while managing their ingredient inventory.

How can I make it possible through my design?

Solution
To establish a seamless loop connection between ingredients and recipes, I introduced a new function - the ability to add selected ingredients to a recipe or create a new recipe with those selections.

With this enhancement, users can now create a new recipe while managing their ingredient inventory, as well as add new ingredients when creating a new Menu/Recipe.
Prototype
3. Minimise users' effort when fill in ingredients
Update the UI to align with the aforementioned iteration, ensuring it fits the visual style and adheres to one-hand operation accessibility.

To achieve the goal of minimising users' effort, introduce a popup window that allows users to scan the code for automatic information filling. With robust database support, users will hardly need to input any information manually.

Next Step

1. Update the rest of the UI from the Iterations
Update and polish the UI for the rest of the function pages like Ingredient, cart and home page to meet the requirement of One-hand Operation.
2. FUVisualising and modelling functionalities
Visualising and modelling the data obtained from stock forecasting and inventory forecasting functions. Ensuring the components are easy to operate and understand, as well as scalable for various digital platforms.
2. FUVisualising and modelling functionalities
While developing prototypes for other functions, continue advancing the development of the Design System for KitchenDash.

What I learned from this Case study

1. User flow is the key to the success of a product
A logically structured and user-friendly user flow significantly influences product design. When facing creative blocks (which are perfectly normal), revisiting the user flow can be immensely helpful. The Designer may uncover aspects that brilliantly address user pain points and others that require refinement by running through the flow repeatedly in your mind.

This process often sparks new ideas and innovations. It's a dynamic way to rejuvenate creativity, allowing for discovering fresh solutions and improvements while maintaining a user-centric focus.
2. Designing with Empathy, thinking about accessibility and usability
In the bustling activity of a lively kitchen, the necessity for one-hand operation emerged from the diverse range of multitasking scenarios.

By prioritising users' real-world experiences, enhancing usability and accessibility can make users feel central to the product design process. Consequently, the drop-off rate decreased, and the task completion rate increased, ultimately securing a broader and more loyal audience base.