NutriSight
NutriSight
2024 | User Research, Competitive Analysis, Prototyping, Visual Design
2024 | User Research, Competitive Analysis, Prototyping, Visual Design
2024 | User Research, Competitive Analysis, Prototyping, Visual Design
My Role:
My Role:
UX Researcher – User Interviews, Observations, Competitive Analyses, Personas
UX Designer – Prototyping, Wireframing, Branding, Visual Design
UX Researcher – User Interviews, Observations, Competitive Analyses, Personas
UX Designer – Prototyping, Wireframing, Branding, Visual Design
Timeline:
Timeline:
6 weeks
6 weeks
Team Size:
Team Size:
5 people, including myself
5 people, including myself
Tools Used:
Tools Used:
Figma, Atlas.ti, Photoshop, Illustrator, Microsoft Office, Miro, Mural, Adobe XD
Figma, Atlas.ti, Photoshop, Illustrator, Microsoft Office, Miro, Mural, Adobe XD
Overview
Overview
NutriSight, a mobile app enhanced with Meta AR, was created to help users choose the healthiest food options based on their dietary preferences. Initially started as part of an academic project focused on user research, I took the lead in advancing the project by developing the prototypes and visual designs.
Using insights from our research, I crafted intuitive, user-centered designs that translated data into actionable, user-friendly interfaces. Through several iterations and comprehensive usability testing, the design achieved a significant improvement in user experience, increasing navigation ease by 25%.
Moreover, I learned how to bring research findings to life through data-driven design, enabling users to make healthier choices with greater efficiency and ease.
NutriSight, a mobile app enhanced with Meta AR, was created to help users choose the healthiest food options based on their dietary preferences. Initially started as part of an academic project focused on user research, I took the lead in advancing the project by developing the prototypes and visual designs.
Using insights from our research, I crafted intuitive, user-centered designs that translated data into actionable, user-friendly interfaces. Through several iterations and comprehensive usability testing, the design achieved a significant improvement in user experience, increasing navigation ease by 25%.
Moreover, I learned how to bring research findings to life through data-driven design, enabling users to make healthier choices with greater efficiency and ease.
The Impact
The Impact
35%
35%
Reduction in Product selection Time
Reduction in Product selection Time
Real-time product scanning and health score computation streamlined decision-making
Real-time product scanning and health score computation streamlined decision-making
2xmore
35%
Engagement with Alternative Product Suggestions
Engagement with Alternative Product Suggestions
Users engaged twice as much with suggested alternatives when they aligned with their dietary preferences.
Users engaged twice as much with suggested alternatives when they aligned with their dietary preferences.
90%
35%
Users showed a high intent to adopt the app
Users showed a high intent to adopt the app
Users expressed strong interest in using the app, highlighting the need for apps that support informed decision-making.
Users expressed strong interest in using the app, highlighting the need for apps that support informed decision-making.
HIGHLIGHTS
Real-Time Product Scanning Revealing Healthiness Percentage Tailored to Dietary Preferences
Real-Time Product Scanning Revealing Healthiness Percentage Tailored to Dietary Preferences
Smart Search: Find Products That Match Your Dietary Needs & Locate Nearby Availability
Smart Search: Find Products That Match Your Dietary Needs & Locate Nearby Availability
The Process
The Process
The Problem
The Problem
How it all Began : The Quest for healthier choices
How it all Began : The Quest for healthier choices
As a student adjusting to independent living and grocery shopping, I found myself lost in the aisles, staring at endless variations of the same product—less fat, more fat, organic, and so on.
Each option came with flashy labels and confusing ingredient lists. Trying to figure out which one suited my dietary needs felt like solving a puzzle. I’d spend hours decoding the tiny text, only to end up frustrated and picking the first option I saw.
This struggle sparked a question: Why isn’t there an easier way to make informed, healthy choices?
As a student adjusting to independent living and grocery shopping, I found myself lost in the aisles, staring at endless variations of the same product—less fat, more fat, organic, and so on.
Each option came with flashy labels and confusing ingredient lists. Trying to figure out which one suited my dietary needs felt like solving a puzzle. I’d spend hours decoding the tiny text, only to end up frustrated and picking the first option I saw.
This struggle sparked a question: Why isn’t there an easier way to make informed, healthy choices?
Competitive Analysis
Competitive Analysis
Is there really no app that could help us?
Is there really no app that could help us?
Despite their impressive features, they fail to offer the full solution users need
Despite their impressive features, they fail to offer the full solution users need
Boby Approved
Boby Approved
Focuses on providing pre-`approved product recommendations
Focuses on providing pre-`approved product recommendations
Excellent for users with broad health goals like eating organic or avoiding processed foods
Excellent for users with broad health goals like eating organic or avoiding processed foods
NutriLens AI
NutriLens AI
Provides real-time nutritional analysis of products, offering ingredient-level insights
Provides real-time nutritional analysis of products, offering ingredient-level insights
Uses AI to provide personalized product recommendations based on the user's dietary preferences
Uses AI to provide personalized product recommendations based on the user's dietary preferences
Yuka
Yuka
Scans both food and cosmetics, providing comprehensive health impact ratings
Scans both food and cosmetics, providing comprehensive health impact ratings
Suggests healthier alternatives, aiding users in making better decisions
Suggests healthier alternatives, aiding users in making better decisions
Research Questions
Research Questions
Diving deeper into the problem: What areas should be focussed?
Diving deeper into the problem: What areas should be focussed?
How do users currently decide which food product aligns with their dietary preferences?
How do users currently decide which food product aligns with their dietary preferences?
Do users find current nutritional labeling formats easy to understand and compare?
Do users find current nutritional labeling formats easy to understand and compare?
What features do users find most helpful or lacking in existing grocery apps for comparing and selecting healthy products?
What features do users find most helpful or lacking in existing grocery apps for comparing and selecting healthy products?
User Research
User Research
Let’s hear it straight from the shoppers
Let’s hear it straight from the shoppers
Through observations and interviews, we uncovered that users face significant struggles decoding complex nutritional labels, locating dietary-specific options, and relying on incomplete information for decisions. These insights became the cornerstone of NutriSight’s user-centered design.
Through observations and interviews, we uncovered that users face significant struggles decoding complex nutritional labels, locating dietary-specific options, and relying on incomplete information for decisions. These insights became the cornerstone of NutriSight’s user-centered design.
User Personas
User Personas
Turns out, they're not alone in this struggle
Turns out, they're not alone in this struggle
Meet...
Meet...
Emily Johnson
Emily Johnson
26, Graphic Designer
26, Graphic Designer
With so many options—low-fat, organic, gluten-free—Emily spends way too much time comparing labels and Googling ingredients to find the best choices for her diet.
With so many options—low-fat, organic, gluten-free—Emily spends way too much time comparing labels and Googling ingredients to find the best choices for her diet.
Find healthier food options easily without spending hours researching.
Find healthier food options easily without spending hours researching.
Make informed decisions aligned with her dietary preferences.
Make informed decisions aligned with her dietary preferences.
Avoid feeling confused or frustrated when shopping.
Avoid feeling confused or frustrated when shopping.
Ryan Mitchell
Ryan Mitchell
30, Software Engineer
30, Software Engineer
Finds it challenging to locate products that match his dietary preferences. He spends hours searching or visiting multiple stores, unsure where the right products are available.
Finds it challenging to locate products that match his dietary preferences. He spends hours searching or visiting multiple stores, unsure where the right products are available.
Easily locate healthy products that match his dietary preferences.
Easily locate healthy products that match his dietary preferences.
Find stores or platforms where the desired products are available.
Find stores or platforms where the desired products are available.
Save time during grocery shopping by having clear, accessible options.
Save time during grocery shopping by having clear, accessible options.
Designs
Designs
After a lot of brainstorming session and iterations, here we present – NutriSight
After a lot of brainstorming session and iterations, here we present – NutriSight
I designed the app's features with first-time users in mind, focusing on simplifying their experience while addressing key challenges identified in the research.
I designed the app's features with first-time users in mind, focusing on simplifying their experience while addressing key challenges identified in the research.
Health percentage by scanning products
Health percentage by scanning products
Users found it difficult to interpret nutritional labels due to complex terminology and small text sizes. This feature simplifies the process by offering a clear, personalized health score, helping users make quicker, more informed choices.
Users found it difficult to interpret nutritional labels due to complex terminology and small text sizes. This feature simplifies the process by offering a clear, personalized health score, helping users make quicker, more informed choices.
Product Availability locations
Product Availability locations
Users found it difficult to interpret nutritional labels due to complex terminology and small text sizes. This feature simplifies the process by offering a clear, personalized health score, helping users make quicker, more informed choices.
Users found it difficult to interpret nutritional labels due to complex terminology and small text sizes. This feature simplifies the process by offering a clear, personalized health score, helping users make quicker, more informed choices.
Dietary-Based Product Recommendations
Dietary-Based Product Recommendations
Users often relied on external sources like family or online platforms to choose healthy products. This feature provides tailored recommendations, reducing their reliance on outside advice and boosting confidence in their choices.
Users often relied on external sources like family or online platforms to choose healthy products. This feature provides tailored recommendations, reducing their reliance on outside advice and boosting confidence in their choices.
Search by Dietary Restrictions
Search by Dietary Restrictions
Users often struggle to find products that meet their dietary needs. The search feature tailored for dietary restrictions simplifies product discovery, improving accessibility and inclusivity.
Users often struggle to find products that meet their dietary needs. The search feature tailored for dietary restrictions simplifies product discovery, improving accessibility and inclusivity.
The Final Product
The Final Product
View Final Prototype
View Final Prototype
Meta AR glasses made navigation more easier without the hassle of using a phone.
Meta AR glasses made navigation more easier without the hassle of using a phone.
Iterations
Iterations
Although each design decision became a vital step toward solving the challenges users faced
Although each design decision became a vital step toward solving the challenges users faced
These iterations in particular taught me invaluable lessons about incorporating user feedback and applying design thinking.
These iterations in particular taught me invaluable lessons about incorporating user feedback and applying design thinking.
What should the navbar include?
What should the navbar include?
How shall I design visually appealing cards that prioritize information with clear visual hierarchy?
How shall I design visually appealing cards that prioritize information with clear visual hierarchy?
Since users prioritized healthiness but still valued location and price, I ensured these secondary factors were clearly displayed on the product card.
Since users prioritized healthiness but still valued location and price, I ensured these secondary factors were clearly displayed on the product card.
Including the street name was ideal for indicating the location but took up a lot of space.
Including the street name was ideal for indicating the location but took up a lot of space.
Since users in the US prefer miles for distance, I used a location icon to represent this, though it occupied considerable space and drew more attention.
Since users in the US prefer miles for distance, I used a location icon to represent this, though it occupied considerable space and drew more attention.
Winner
Winner
Winner
This approach made it to the final design, creating a balanced look with adequate spacing and attention to key elements on the card.
This approach made it to the final design, creating a balanced look with adequate spacing and attention to key elements on the card.
Retrospective
Retrospective
Reflecting on the journey: Key Insights and Takeaways
Reflecting on the journey: Key Insights and Takeaways
Keep It Simple, Keep Them Engaged
Keep It Simple, Keep Them Engaged
Simplifying complex features like nutritional data into easily digestible information (e.g., health percentage, clearer labels) directly addressed users' struggles and significantly enhanced usability.
Simplifying complex features like nutritional data into easily digestible information (e.g., health percentage, clearer labels) directly addressed users' struggles and significantly enhanced usability.
Visual Hierarchy Enhances Clarity
Visual Hierarchy Enhances Clarity
Proper use of visual hierarchy, like prioritizing key information (health percentage, availability), ensured that users could easily navigate through the app without feeling overwhelmed.
Proper use of visual hierarchy, like prioritizing key information (health percentage, availability), ensured that users could easily navigate through the app without feeling overwhelmed.
Balance Functionality and Aesthetics
Balance Functionality and Aesthetics
Designing for functionality while maintaining an appealing visual design is essential for user engagement. For example, providing location information and price alongside the health score added value without cluttering the interface.
Designing for functionality while maintaining an appealing visual design is essential for user engagement. For example, providing location information and price alongside the health score added value without cluttering the interface.
