The Living Meals: Sharing Cultures in a Healthy Kitchen

Cultural Gastronomy • Organic Meal Flows • Farm-to-Table UX

Slide 1
BACK
NEXT

Context

Designed a specialized mobile web and application experience tailored to streamline nutritional tracking and custom meal ordering for health-conscious users.

Role

Product Designer

Timeline

6 Weeks

Core features

  • Macro-Syncing: Intuitive tracking interface designed with low-friction controls for effortless daily logging.

  • Dietary Filtering: Dynamic dietary filters and customizable ingredient transparency views tailored to health goals.

  • Adaptive Recommendations: Smart meal recommendation experience driven by real-time nutritional preferences and user targets.

Statistics and Secondary Research

Research began by analyzing quantitative platform metrics alongside qualitative insights from user interviews. This dual approach pinpointed critical journey friction, highlighting a core mismatch between complex, number-heavy dietary demands and the simple, intuitive routines health-conscious individuals actually prefer.

68%

Checkout Abandonment Rate

68%

Macro Logging Drop-off Rate

12%

Menu Customization Rate

3.5m

Avg. Time Saved per Order

3.5m

Daily Time Saved via Automation

Findings from Primary Research

Secondary research findings, targeted usability evaluations, and structured interviews with a diverse cohort of members—ranging from young food enthusiasts to elderly culinary seekers—were synthesized to meet rigorous industry standards and insights from online research. This process identified unique barriers encountered by each demographic within the digital platform.

Light Mode

Users prioritize clear, high-contrast interfaces for effortless recipe reading and intuitive meal exploration.

Quick Access

Streamlined navigation prioritized over complex filtering to simplify daily meal selections based on user preference data.

Mobile First

74% of participants rely on mobile devices to browse curated menu collections and execute orders remotely.

The Redesign

Insights derived from a comprehensive 1-week diary study and remote usability sessions directly informed a streamlined interface direction, purposefully structured to eliminate logging friction and optimize daily nutritional workflows.

The Hero

Designed to immediately capture attention, the primary view acts as a high-impact entry point. A clean visual hierarchy and dynamic interface elements establish instant clarity around recipe discovery, drawing user focus directly to core culinary value propositions.

Strategic Conversion

Disconnected web platforms often create friction through clunky navigation and complex checkout routes. To fix this, a responsive web-app model was introduced, blending native application fluidity with browser accessibility to guide users smoothly from account management to checkout.

Dynamic Engagement

Behavioral research highlighted an urgent need for responsive, high-fidelity interaction during profile and order management. In response, the interface was built with fluid layout shifts, ensuring every screen interaction actively supports individual user preferences.

Hero section

The Hero

Designed to immediately capture attention, the primary view acts as a high-impact entry point. A clean visual hierarchy and dynamic interface elements establish instant clarity around recipe discovery, drawing user focus directly to core culinary value propositions.

Strategic Conversion

Disconnected web platforms often create friction through clunky navigation and complex checkout routes. To fix this, a responsive web-app model was introduced, blending native application fluidity with browser accessibility to guide users smoothly from account management to checkout.

Dynamic Engagement

Behavioral research highlighted an urgent need for responsive, high-fidelity interaction during profile and order management. In response, the interface was built with fluid layout shifts, ensuring every screen interaction actively supports individual user preferences.

Design validation

Data-backed design validation relies on rigorous behavioral evaluation against core user cohorts. The following testing methodologies ensure performance goals successfully bridge complex culinary data with intuitive user needs.

User Interviews

Extracting qualitative insights from target users to resolve high-friction ordering barriers.

Engagement Maps

Pinpointing exact hot spots to maximize engagement across recipe and menu discovery interfaces.

Navigation Testing

Measuring path efficiency to guarantee effortless discovery of ingredient views.

Image of heatmap
Image of first click test

"The fluid browser navigation makes customizing meals and checking out feel completely seamless, just like using a native app."

-Nutrition Cohort Member

Impact Created

Continuous benchmark telemetry and post-testing analytics indicate strong behavioral improvements, pointing toward tangible gains in daily user retention and checkout completion following initial rollout.

38%

Decrease in checkout drop-offs

38%

Daily Active Trackers Growth Rate

24%

Increase in custom orders

24%

Increase in Custom Orders

45%

Growth in weekly engagement

45%

Growth in Weekly Engagement

Project Artifacts

The following deliverables document the strategic design process, approach, and iterative problem-solving applied throughout The Living Meals case study.

Strategy & Insights

Transitioning from legacy fragmentation to a responsive platform experience relies entirely on data-backed design frameworks. Prioritizing fluid browser-based navigation successfully bridges culinary complexity with seamless ordering workflows.

Component Library

Establishing a modular component library to enforce visual and navigational consistency across the entire web application interface.

Workflow Optimization

Utilizing rapid design sprints to refine core conversion pathways and eliminate friction throughout the digital user journey.

Experience Validation

Merging qualitative feedback with interaction telemetry to simplify strict dietary constraints within an app-like browser experience.

Slide 1
BACK
NEXT

Create a free website with Framer, the website builder loved by startups, designers and agencies.