CLEAR LABELS,
BETTER CHOICES!
Improving the grocery shopping experience through accessible language and smart product guidance
Summary
Grocery Store App:
At Andina grocery store many customers face daily challenges when trying to find safe, suitable products—especially those managing specific health conditions or dietary needs—without spending hours reading labels or feeling unsure about their choices.
My Role:
I spearheaded the complete UX and UI design process for Andina, leading a user-centered strategy that combined rigorous research with innovative design solutions:
✅ Ethnographic & Usability Research – I immersed myself in real-world contexts by conducting ethnographic observations across multiple grocery stores. I interviewed shoppers with diverse language backgrounds and dietary needs to uncover specific pain points, such as difficulties reading labels, finding allergen information, and choosing fresh produce confidently.
✅ User Flow & AR Interaction Design – I mapped intuitive user flows optimized for the unique demands of in-store augmented reality. This included designing seamless transitions between scanning products, translating information, and filtering dietary preferences—all while minimizing cognitive load during the busy grocery experience.
✅ High-Fidelity Prototyping & Iterative Testing – Using Figma, I developed interactive prototypes that captured the AR experience’s nuances. Through iterative rounds of usability testing, I refined micro-interactions, button placements, and feedback cues, ensuring users—especially those new to AR—could navigate the app effortlessly and confidently.
Challenges
At Andina, many customers face daily challenges when trying to find safe, suitable products—especially those managing specific health conditions or dietary needs—without spending hours reading labels or feeling unsure about their choices.
In diverse communities, many shoppers struggle to understand food packaging written in a language they don’t speak. This isn’t just inconvenient—it can be risky for those with allergies or medical conditions.
Long ingredient lists and unclear allergen information made it hard for people with health conditions or dietary restrictions to identify safe products quickly.
Shoppers—especially those new to cooking—struggled to assess the ripeness or quality of fruits and vegetables, often leading to poor choices and food waste.
Solutions
Share information on a previous project here to attract new clients. To help visitors understand the context and background of the work, provide a brief summary. Include the project's time frame and scope, as well as its goals and outcome.
Add details about why this project was created and what makes it significant. Explain how the business handled challenges and overcame obstacles to make this undertaking a success. Consider adding images or videos to showcase the project and engage viewers.
Project Goals
Break language barriers by offering real-time product translation so customers no longer rely on store employees to understand what they’re buying.
Simplify complex labels so customers with allergies or food sensitivities can easily understand product information—without having to read through long ingredient lists.
Guide produce selection with an intuitive ripeness recognition feature—so shoppers don’t have to search online to determine how fruits and vegetables should look.
Solutions
Share information on a previous project here to attract new clients. To help visitors understand the context and background of the work, provide a brief summary. Include the project's time frame and scope, as well as its goals and outcome.
Add details about why this project was created and what makes it significant. Explain how the business handled challenges and overcame obstacles to make this undertaking a success. Consider adding images or videos to showcase the project and engage viewers.
Overcoming customers’ challenges
Helps customers confidently navigate the grocery store by instantly translating product ingredients and allergen information into their preferred language, removing language barriers and enabling safer, informed choices.
Provides real-time product recommendations based on dietary restrictions as customers navigate the store. Filters (e.g., gluten-free, vegan) help them quickly find suitable options.
Assesses the ripeness of fruits and vegetables by analyzing their appearance, providing real-time recommendations on whether the produce is ready to eat or needs more time to ripen.
Solutions
Share information on a previous project here to attract new clients. To help visitors understand the context and background of the work, provide a brief summary. Include the project's time frame and scope, as well as its goals and outcome.
Add details about why this project was created and what makes it significant. Explain how the business handled challenges and overcame obstacles to make this undertaking a success. Consider adding images or videos to showcase the project and engage viewers.
Project Research
ETNOGRAPHIC FIELDWORK:
5 store visits observing real customer behavior and frustrations
Customers often waited for store employees to explain products before making a choice, slowing down their shopping experience.
Shoppers often scrutinize product labels to ensure they’re free of ingredients that could be harmful to their health.
Some shoppers feel unsure when selecting fruits and vegetables, often turning to the internet for guidance on what to choose. This uncertainty can lead to poor selections, frustration, or even food waste.
INTERVIEWS:
7 interviews with users from diverse dietary, linguistic, and occupational backgrounds.
INSIGHTS FROM EXISTING RESEARCH:
Many customers—especially those with dietary restrictions or health concerns—face real barriers when grocery shopping. Research shows that:
Design Process Highlights
PROTOTYPE & TESTING
Tested with 4 users.
First Prototype
Redesign
Key improvements included:
-
Use high contrast between the background and label cards, along with bold text, to make item names more legible.
-
Reinforce Button Feedback: Use distinct colors for Cancel, and OK.
-
Enlarge slightly and add labels to “Add to Cart.”
First Prototype
Redesign
Key improvements included:
-
Display the number of active filters on the Filter button when applied
-
Implement a bottom sheet for product details to improve usability and visual continuity in the AR
First Prototype
Redesign
Key improvements included:
-
Add instruction: “Tap a fruit to check its ripeness.”
-
Replace “Yes/No” with “Search / Cancel” for clearer intent.
-
Add brief helper text: “Good for eating in 1–2 days.”
-
Centering the bottom action buttons to place them within the thumb-friendly zone, making them easily accessible for both right- and left-handed users.
Expected Outcome
Next Steps
Reflection
One of the most pivotal moments in this project occurred when an early iteration of the app caused confusion among users due to insufficient guidance and context. Rather than viewing this as a setback, I recognized it as an opportunity to grow and refine my approach as a UX designer.
I responded by initiating a focused round of user research, observing behavior patterns, and conducting follow-up interviews to better understand pain points. This direct engagement allowed me to iterate rapidly, integrating clearer instructions, micro-interactions, and contextual cues into the interface. As a result, user engagement and interest in the app significantly improved.
This experience deepened my belief in the power of continuous iteration, user advocacy, and evidence-based design. Owning the process from discovery to delivery sharpened my ability to anticipate user needs, communicate design intent more clearly, and drive outcomes aligned with both user goals and business objectives.
Ultimately, this project strengthened my identity as a user-centered designer who values clarity, collaboration, and iteration as cornerstones of impactful digital experiences.