A Mobile App for Food Service Workers
This project turns a Google doc spanning over 150 food items and delivery/expiration dates into a functioning mobile app.
Client:
Val's Vegan Kitchen
Category:
Mobile Design, UI/UX Design
My Role:
UI/UX Designer · Team of 4
For this project, the entire class had to ask ourselves: how do we transform our professor's vegan restaurant into a mobile interface?
Our COGS 187A professor runs his own vegan restaurant with his wife outside of lecturing Cognitive Science courses at UCSD. Called Val's Vegan Kitchen, they were inspired by their daughter Valentina (Val)'s commitment to veganism. Since my professor and his wife made the great shift to veganism, they created their restaurant to deliver the meat, cheese and egg-like experiences of the vegan products without the fakeness that sometimes accompanies them.
This project was decided by our professor, as a deliverable to be worked on throughout the whole Spring Quarter of 2025. Every team in the class built their own interpretation of a mobile app that would allow for Val's Vegan Kitchen to track inventories, update items, and keep the restaurant running smoothly.
The food industry is hectic. I can speak from experience (3 years taking orders, handcrafting drinks, and dealing with 90° summer day rush hours). 🍹
Imagine handling infinite inventory, sorting new deliveries, tracking expiration dates, and assembling nonstop orders yourselves…. just to find out you've already cooked your last patty.
My professor sought out a mobile interface that both employees and managers can use to track all their restaurant needs, in one screen.
Our Research
We were given an Excel spreadsheet containing all of my professor's restaurant inventory. It spanned 150+ items, unorganized by category or date…..
Our first duty was to categorize these items by information hierarchy to make this jumble a bit more claritive.
The Design Process
After categorizing this giant catalog into its food categories, we drafted a menu.
Think, if I were a customer, how would I approach and order from this restaurant?
This led to drafting UI sketches, user flows, and eventually our first low-fidelity prototype in Figma.
The Good, The Bad, and Ugly
The Solution
User Testing Issue #1: A 2-button system to increase or decrease quantity is not efficient and tiresome.
How we fixed this:
Made two different iterations of the interface to adjust quantities. The right is a 4-button system allowing to adjust by 10 as well as 1.
The left is the same 2-button system, but a separate pop-out number pad allows to manually input quantity.
User Testing Issue #2: When enacting real-life scenarios in the restaurant industry, users brought to attention the issue of expired items and trying to track them.
How we fixed this:
A quick overview of expiring items with color-coded dots beside the item name, with red symbolizing “1-2 days about to expire”, orange 3-4 days, and green five or more, and black for already expired items.
It would be calculated using an algorithm that counts from the day it is added or updated to the day the user sets for freshness when creating an item.
The Results
A happy professor and wife.
Having gone through 15+ usability tests and user interviews with peers and classmates, we finalized our app to the best it could. A vibrant, welcoming interface that takes the heavy load off the food service workers themselves.
Reflection
What I learned from this project:
This was my first project done using Figma and delving into UI/UX since pivoting my career trajectory. I've dabbled in graphic design throughout my life, using Canva, Picsart, and Photoshop at times. I was fascinated that Figma has similarities to all those tools, yet is so much more complicated at the same time.
What I'd change moving forward:
I'm happy with the layout, aesthetic, and practicality of our app's features. I'd like to flesh out the prototype more, so it isn't limited to Figma's basic prototyping capabilities. I'm curious about implementing the keypad feature in more screens/locations and having it pop out and in more easily.
Related Projects
