Skip to main content
UI Coach Logo
Back to challenges
Hard

Diet-Compatible Food Finder

Design a menu search experience that helps diners evaluate dishes against allergies and dietary preferences.

Mobile, Responsive web

The brief

Understand the problem

Background

Diet labels are often inconsistent, and a dish that appears suitable may involve shared equipment or an unlisted ingredient. Diners need evidence and a way to ask the restaurant rather than a false safety guarantee.

User context

Chloe avoids dairy and has a severe peanut allergy. She needs dinner options nearby and wants to distinguish preference matches from restaurant-confirmed allergy procedures.

Product problem

The product must make ingredient and cross-contact uncertainty visible while keeping search practical.

Objective

Create a food search and verification flow that separates dietary preference filtering from allergy risk decisions.

What to design

Define the experience

Required experience

  • Set dietary preferences and allergy severity
  • Search dishes with evidence-based filters
  • Inspect ingredients and preparation notes
  • Contact the restaurant with a structured question

Screens and states

  • Diet profile
  • Dish results
  • Dish evidence detail
  • Restaurant confirmation request

Core user flow

Follow the critical path

  1. 01

    Chloe records dairy avoidance and a severe peanut allergy

  2. 02

    Results distinguish preference matches from restaurant-confirmed controls

  3. 03

    She opens a dish with incomplete cross-contact information

  4. 04

    She sends a concise question and waits for confirmation

Product rules

Requirements and constraints

Requirements

  • Separate preference filters from medical allergy settings
  • Show who supplied each ingredient or preparation claim and when
  • Preserve uncertainty instead of marking a dish safe
  • Offer direct restaurant confirmation and emergency guidance

Constraints

  • User-generated tags cannot override restaurant evidence
  • Menus and kitchen processes change
  • The interface cannot provide medical clearance

Reality check

States worth considering

No dish meets all criteria
The restaurant has not responded
A recipe changes after saving
Translation obscures an ingredient

Finish line

What to deliver

  • Four responsive screens showing a confirmed and an uncertain dish

Optional direction

Visual resources

Use these as a starting constraint if you want one. They are not part of the required solution.

Color palette
#79674F
#EDE6D2
#090C0F
#B7B7B7
#A7A7A7
Font pairing
CinzelFauna One

Cinzel & Fauna One

Clear interface writing gives people the confidence to understand what changed and decide what to do next.

Icons
Illustrations