Edible
Ethnic Produce Market
About
Edible is an app created to address users' challenges when searching for ethnic produce in their local area. The app helps users locate these ingredients and serves as an educational resource, offering information on unfamiliar produce, suggesting suitable substitutes, and providing cooking tips and recipes for these unique ingredients.
Roles
I assumed the following roles in designing this app:
User Experience (UX) Designer
Interaction (IxD) Designer
User Interface (UI) Designer
Visual Designer
UX Researcher
Overview
Deliverables
Interaction Design:
Competitive analysis
User surveys and one-on-one interviews
Personas
User journeys and task flows
Site map
Low-fidelity wireframes
High-fidelity mockups and prototypes
Design system and UI kit
Usability tests and findings
Project Specifications
Duration: 6 weeks
Tools
Figma
Miro
Problem
For individuals living away from their home regions, the challenge of finding specific ethnic ingredients for beloved homemade dishes is considerable. These ingredients are frequently unavailable or go by different names, causing confusion and frustration during the search. In the USA, the recognition and availability of ethnic produce face hurdles due to diverse naming conventions and constrained distribution networks. Variations in naming practices for ethnic fruits, vegetables, and herbs confuse consumers unfamiliar with these terms. Additionally, complex supply chains, especially for imported items with specific storage and transportation requirements, hinder the accessibility and affordability of ethnic produce, limiting its reach to a broader audience.
Solution
I also gain valuable insights into my users' shopping behaviors, such as how often they shop for ethnic produce, their preferred stores, and their budget considerations. Surveys provide comprehensive insights for refining my app, ensuring it meets the unique needs of those seeking ethnic produce.
Empathized
Survey
To gain valuable insights into the world of ethnic produce, I conducted interviews with five randomly selected individuals who are primarily responsible for cooking in their households. My goal was to understand their experiences in sourcing ethnic ingredients and how they successfully incorporate them into their meals.
Here are some of the survey questions I asked:
How often do you cook with ethnic produce?
What happens when you can't find the ethnic produce you want?
Where do you buy a majority of your ethnic produce?
How often do you shop for ethnic produce?
Which of the following best describes how you use your smartphone or computer to find ethnic produce?
Which describes you the best when it comes to cooking?
Interviews
In order to gain valuable insights into the world of ethnic produce, I conducted interviews with five randomly selected individuals who are primarily responsible for cooking in their households. My goal was to understand their experiences in sourcing ethnic ingredients and how they successfully incorporate them into their meals.
Here are some of the interview questions I asked:
Please tell me when you are tired of cooking ethnic food and when it doesn’t turn out as you hoped
Where do you shop when looking for ethnic produce?
Do you have specific stores you go to? Why? For what?
Do you cook? Shop? or Do Both ?
Do you care more about the taste vs. the look when you do replace your ingredients?
What made you decide to get ethical produce?
Define
Affinity Mapping
To enhance my understanding of the interview insights, I developed an affinity diagram, which effectively organized and distilled the core findings. This diagram allowed me to identify and categorize prevalent patterns into four distinct groups.
User Persona
Using the insights from my affinity diagram, I developed a user persona for the Edible app.
How Might We
"How might we cater to both seasoned cooks and individuals seeking to enhance their knowledge of cooking with ethnic produce, based on the key issues identified through research?"
Ideate
User Flows
This maps out a user who wants to learn a new recipe and needs to find ingredients at the local store to make it.
App Navigation
Based on the user flow, task flows and feature roadmap, I designed the simple app map that’s functional and easy to navigate
Prototype and Usability Test
Sketches and Paper Prototype
This maps out a user who wants to learn a new recipe and needs to find ingredients at the local store to make it.
Wireframes
I made wireframe versions of my screens to further refine my design decision.
UI Kit
The UI kit features a sophisticated color palette: Murrey and Oxford Blue contribute a sense of luxury and depth, while vibrant Saffron and Coquelicot inject energy and liveliness. Cal Poly Green adds a natural touch, resonating with the themes of sustainability and academia. The palette is balanced with neutrals—pure White, tranquil Night, serene Ash Gray, and the softness of Snow—ensuring a clean and modern aesthetic that harmonizes with the user-friendly Open Sans font and intuitive icons for a cohesive user interface experience.
Color Palette
The color palette of vibrant Saffron and Coquelicot, tranquil Cal Poly Green and Ash Gray, along with the rich Murrey and Oxford Blue, complemented by the simplicity of White and Night, eloquently reflects the essence of an app for finding ethnic produce locally. Much like the colors, this app represents a vibrant marketplace of diverse cultures, a connection to nature and sustainability, and the deep heritage of ethnic cuisines. The balance of bright and deep hues mirrors the app's blend of rich cultural experiences and user-friendly functionality, symbolizing a celebration of global culinary diversity and the unification of our global community.
Font
Open Sans, with its clear, modern, and versatile design, aligns perfectly with an app aimed at finding ethnic produce locally. Its readability enhances user navigation, making the app straightforward and accessible. The contemporary and friendly style of the font reflects the app's modern approach to connecting users with a diverse range of ethnic foods. Additionally, Open Sans's widespread use and international appeal mirror the global nature of the app, catering to a varied and inclusive user base. In essence, the characteristics of Open Sans complement the app's goal of providing an efficient, engaging, and user-friendly experience in accessing global culinary diversity.
Icons
These icons suggest that the app offers a comprehensive suite of features that support not just the discovery of ethnic produce but also educational content and personalization to enhance the user experience. The icons are designed to be intuitive, ensuring users can easily navigate the app.
Hi-Fidelity Prototype
Testing
These icons suggest that the app offers a comprehensive suite of features that support not just the discovery of ethnic produce but also educational content and personalization to enhance the user experience. The icons are designed to be intuitive, ensuring users can easily navigate the app. I created a prototype in Figma and conducted two rounds of testing with ten users. I gave the users four tasks.
Use the search bar to look for galangal
Please take a photo of the unidentified herb to learn more about it.
Find your way to the closest grocery store to buy some Thai Bail.
Learn how to make Lao Papaya Salad and determine if it needs Thai Chili.
Main pain points that were discovered during the tests and addressed in the iteration:
Pain Points: When I asked users to search for galangal, the user went to the home screen to use the search bar. Users were confused when they couldn’t find it on the home screen.
Resolved: I added the search bar to the home screen to address this issue.
Pain Points: When I asked users to search for galangal, the user went to the home screen to use the search bar. Users were confused when they couldn’t find it on the home screen.
Resolved: I added the search bar to the home screen to address this issue.
Conclusion and Takeaways
Embarking on my first UX/UI project, "Edible," was an enlightening experience that taught me valuable lessons. The most significant realization was how the final outcome of a project can differ from the original concept. With Edible, centered on vegetables, I initially chose a vibrant green color scheme, aiming to create an app that was not only functional but also resonated with users' emotions, curiosity, or nostalgic connections to ethnic produce.
User interviews were pivotal in this journey. My initial aim was to understand their experiences with ethnic produce, but it became clear that their shopping and cooking habits greatly influenced their purchasing decisions. Understanding these habits was crucial for the app's design and functionality. Exploring their unique shopping and cooking styles allowed me to customize the Edible app to better serve their needs, thereby enhancing their user experience.
