4 Weeks
Illustrator
Adobe Illustrator
What is Ginger?
As young adults transition to different parts of life, like going to college, many eventually find themselves lacking the time, tools, and knowledge to cook for themselves. Ginger! is a fridge management app that helps college students develop healthier eating habits and food literacy through streamlining the grocery shopping process while allowing them to create an effective organizational system for themselves.
UX Research + UI Design
As this was a short sprint project between a classmate and I, we both split the roles equally amongst ourselves. Together, we brainstormed the problem space, synthesized data, interviewed users in the target audience, and designed the user interface and experience of our app.
01/ App Features
“What do I have?”
An overview of your fridge to quickly see the shelf-life of your ingredients. Clicking into each section, or navigating to the second tab allows you to check the shelf-life of the ingredients and the ingredient details.
“What should I buy/cook?”
The grocery list tab allows users to add ingredients to a list through through the complete list and add item touchpoint. The meal plans tab allows users to explore various recipies while also seeing what ingredients they already have or missing for that recipe. Shelf-life indicators are also present in the recipe details.
Add to Grocery List
In the meal plan view, users can add a missing or expiring ingredient to their grocery list for their next grocery run. In the Fridge view, users can delete a used up or expired ingredient, or add it to their grocery list again. Users can also star common ingredients that are used daily.
Manual vs Automatic Input
After a grocery trip, there may be many ingredients that need to be added/updated on the app. For convenience, the app has a scan receipt option to quickly list out the newly bought food and associate them to their respective storage methods (fridge, freezer, pantry). Users are also able to edit/fix the sorting of the ingredients before confirming their addition to the app.
Edge Cases
On top of the automatic input, there still exists the manual input option for single/few items that need to be added or updated. If there’s an ingredient the system doesn’t recognize, it can be input manually and requested to be added to the system.
02/ Background + Problem Space
Organization & Food Literacy
When we first identified our domain, we wanted to focus on something that would be doable with the limited resources we had. Because of that, we started by thinking about mindfulness, then habit-building, and eventually landed on eating habits. Because it’s a very relatable issue that many college students faced… so we wanted to create a product where our peers would be excited to use for themselves!
Reframing
However, with our research and findings, we felt the need to descope and reframe our problem statement to refine our solution. From the broader domain of ‘eating habits’, we then honed in on the concept of ‘food literacy’ — which we defined as the ability to be able to improvise and be flexible with both cooking and pantry organization.
03/ User Research + Synthesis
Interviewing College Students
To understand our target users, we did preliminary secondary research and interviewed 7 college students and new grads across 5 universities through snowball sampling. What we found, is that many students who have an interest in cooking and eating healthily tend to manage their fridge well, but is oftentimes forced to prioritize schoolwork over their healthier lifestyle choices. But for those who don’t know how to cook, fridge management and adaptive cooking is more of a struggle.
Affinity Diagrams and Findings
To synthesize the data we collected, we then turned to affinity diagramming and clustering.
Our findings allowed us to come up with three key insights:
1. Collaboration. Due to the lack of resources available, students often rely on their network of friends to grocery shop, borrow appliances, and learn recipes. For example, a lot of students relied on a friend who has a car for grocery trips.
2. Adaptation. We learned that food literacy is built through adaptation. Once recipes are learned, it becomes easier to build upon through improvisation.
3. Knowledge Gaps. We usually associate cooking with being able to work efficiently and master new recipes. However, there are a lot of soft skills that we should learn that we don’t really think about in the kitchen.
Different Lifestyles
From the affinity diagramming and findings of the information synthesis, we developed three personas that loosely characterized our target users of young adults in college.
04/ Design Solution Process
Kitchen Pal
KitchenPal is another fridge management app that we discovered. As we tried it out ourselves, we discovered a number of things that made it difficult to use for a beginner cook. The app itself is very customizable, but that made it more complex for beginners. On top of that, some of the visuals added more clutter than clarity, and it was clear that it was made more for frequent and skilled cooks. Even though KitchenPal sits in the same realm as Ginger, this platform focuses more on pure management rather than knowledge building — which is what we want Ginger to be more of.
Wicked Problem of Food Security
Something else that we realized along the way was that food security in of itself is a wicked problem. Because of that, it’s not something that can be tackled through one touchpoint. From this, we came up with three speculative solutions that fell under the same ecosystem:
1. Systemic Changes:Advocating for more university provided resources like food pantries, grocery shuttles, and campus groceries.
2. External Touch Points:Platform for collaborative grocery trips, temporary access to kitchen appliances, and coworking kitchen spaces.
3. Tool to Learn Food Literacy: A platform to help students build skills on how to be adaptive/flexible with their cooking and organization.
For our final design solution, we then picked the third one to focus on! As we designed our wireframes, we also kept in mind from our competitive analysis findings that the interface should be as informative and easy-to-use as it can be for cooks of all skill ranges.
Sitemap
From planning and sketching out potential functions to add, we also brainstormed some lofi wireframes into a basic sitemap to better visualize the structure of the app.
Lofi + MidFi
After the sitemap, we got to further explore the wireframes in slightly more fidelity, including different variations and color.
Type & Color
Lastly, even though this wasn’t a coded project, we recognized the challenge of feasibility. In one of our competitive analysis research sessions, one of the apps we found happened to be slow and bugged. This was one of the starting points that prompted us to revisit the framework/structure of Ginger. If we were to code it, we would most likely have to make a lot of compromises; a designer’s dream can truly be a developer’s nightmare.
All in all, this was a really fun self-directed project to do! This project truly showed me how clear communication allowed us to easily bounce ideas back and forth and consider possibilities from the broader sense down to the specific interactions.