top of page
iPhone X (CWM Mock up - splash page) Cas
iPhone X (CWM Mock up - Restaurant searc
iPhone X (CWM Mock up - AI Chatbot) Case
CWM Logo - No text.PNG

Chat with Menu

AI chat assistant that helps find the right restaurant for you!

Roles

Felix Gonzalez, Co-founder of Chat with Menu / CEO

Emicris Crispin Ortiz, Co-founder of Chat with Menu / CEO

Stephen Liang, UI/UX Designer

Timeline

4 Months

Tools

Figma

Problem

Finding a restaurant or finding the best middle ground for allergies or dietary habits has always been an ongoing challenge.  Challenges include dietary restrictions, allergies, and other unforeseen health issues that may impact both the diners and restaurants in how they handle a these problems.  Even a language barrier may provide an additional challenge to these niche problems already.

Solution

Create an AI assistant platform that can help diners and restaurant owners on finding the right location, dish types, and even recommend dish pairings based on a diner’s dietary challenges.

Research

Secondary Research

Chat with Menu already has done a deep dive into the niche world of allergies, dietary habits, and other issues that impact the restaurant experience.  With this research, I was able to use the existing data to hone in on how to better design the user experience for Chat with Menu.  

  • 32 million Americans are affected by food allergies (FARE.org).

  • The “Top 9” allergens account for over 90% of allergic reactions.

  • Cross-contamination in restaurant kitchens is a major concern for allergy sufferers.

  • Diners increasingly prefer full transparency on ingredients, preparation methods, and allergy protocols.

  • Language barriers make allergy disclosure challenging for non-native English speakers.

  • Dietary preferences (gluten-free, vegan, keto) are surging even beyond medical necessity.

Primary Research

This included field testing of the actual website itself, redesigning the better tools, and bringing to life the actual tool to be engaging for our modern users.

  • Users responded positively to the “Quick Preferences” feature for rapid personalization

  • Dish visuals with allergy-safe descriptions built more user trust compared to text-only menus.

  • Some users were unsure how to reset dietary preferences mid-search, showing a UX gap.

  • Restaurant owners expressed a need for low-friction onboarding with minimal tech learning.

  • Diners were more likely to pick restaurants that displayed allergy-friendly certifications

  • Visual clarity (real food photos) significantly boosted engagement and time-on-page.

Competitive Research

Of course being in a competitive industry, we looked to our peers for competitive research.  We picked 3 competitors and here were the results:

  • Spokin

    • #1 Recognition / recall - Score 4/5

    • #2 Aesthetics and minimalist design - Score 4/5

    • #3 Help and documentation - Score 4/5 

    • Overall score: 4/5

  • Find me Gluten Free

    • #1 Recognition / recall - Score 4/5

    • #2 Aesthetics and minimalist design - Score 3.5/5

    • #3 Help and documentation - Score 5/5

    • Overall score: 4.1/5

  • Allergy Eats

    • #1 Recognition / recall - Score 2/5

    • #2 Aesthetics and minimalist design - Score 2.5/5

    • #3 Help and documentation - Score 4/5

    • Overall score: 2.8/5

Analysis

Competitive Research

Findings and closing thoughts

A combination of Spokin’s clean design and helpful user flows, Find Me Gluten Free’s dietary

card system, and Allergy Eats’ tutorial-style onboarding will provide the foundation for an

optimal user experience at Chat with Menu.

Personas

Of course with previous data available, I was able to utilize user information to craft the best

website platform to aid our users. These user personas included the:

 

  • Restaurant Diner (focus: fast, clear allergy-safe restaurant discovery)

  • Restaurant Owner (focus: low-friction onboarding, reputation management)

  • Restaurant Staff/Server (focus: supporting upsell, accurate dietary communication)

 

This information was crucial to understanding what each user may need on our platform since

it’s not only just made for one type of user.

  • For the restaurant diner, we crafted user flows that emphasize speed, trust, and safety.

  • For the restaurant owner, we built tools like the Merchant Corner, a freemium platform meant to eventually evolve into a competitor to DoorDash, Uber Eats, and Grubhub.

Diner persona.PNG
Restaurant owner persona_edited.jpg

Define and Ideate

  • How might we…?

    • Help diners find safe and delicious meals faster?

    • Empower restaurant staff to recommend the right dishes confidently?

    • Reduce anxiety around dietary restrictions when dining out?

    • Build restaurant trust and transparency through allergen education?

  • By creating…

    • A smart AI-driven dietary preference filter and restaurant recommender.

    • An allergen certification badge for restaurants to highlight safety practices.

    • A user-friendly chat interface bridging language barriers.

    • A Merchant Corner portal to help restaurant owners manage allergy and dietary data easily.

User flows

We didn’t start from scratch. We leveraged the original website’s architecture but expanded it to create intuitive flows, such as:

  • “Quick Preferences” onboarding

  • Visual chat-based dish recommendation

  • Merchant platform access for restaurant owners

Design

Process

Initially, the site was very “do-it-all” and cluttered. With my lead, we re-imagined it into a clean,

mobile-first platform designed to engage modern diners and busy restaurant staff.

Style Guide and Branding

Personality

  • Friendly, Professional, Innovative

Mood board

  • Warm

  • Inviting

  • Engaging

CWM Moodboard.PNG

Color palette

  • Professional

  • Calm

  • Easy

CWM Color Palette.PNG

The whole package

  • Text

  • Color

  • Mood board

CWM Color Palette & Text.PNG

Validate

Style Guide and Branding

We established a style guide featuring:
● Primary colors: Deep blue (#05396B), light blue (#8296B5), white (#FFFFFF)
Neutral grays and blacks for balance
● Clean, minimalist fonts and UI spacing
Consistent button styles for calls-to-action (e.g., “Chat with Menu” and “Post review”)

High Fidelity Mock Up Phases

● 1st Round: Built core screens for diner flow.
● 2nd Round: Expanded to merchant tools.
● 3rd Round: Incorporated user feedback on design clarity.

The Solution
(More to come!)

We created a usable, intuitive, AI-powered restaurant discovery platform that respects dietary
restrictions, helps restaurants build reputations, and supports fast decision-making for diners

iPhone X (CWM Mock up - Preferences)_edi

Reflection

Challenges and Takeaways

It was a fast-paced project that I was proud to bring to life. However, it wasn’t without its
challenges:

  • Tight deadline, limited teammates, and I overhauled the entire design.

  • Balancing diner needs versus restaurant owner incentives.

Full project still in development but I'm super excited to see the project make an impact on those with special dietary requirements and restaurants succeed with this platform!

©2022 by Stephen Liang. All rights reserved.

bottom of page