Case Study:
AI Recipe Ingredient Substitution

Overview

Home cooks often need to swap ingredients based on what they have on hand, dietary needs, or taste preferences. But substitutions aren’t always 1:1—some ingredients alter flavour, texture, or cooking time. We set out to make these decisions easier by building an AI-powered ingredient substitution feature for our smart cooking app integrated across Web and Mobile

Problem

Users were frequently leaving the app to Google substitutions or Chat GPT to find substitutions, breaking flow and reducing engagement. They needed quick, context-aware alternatives they could trust—without leaving the recipe.

Goal

To design an ingredient substitution feature using Recipe AI Adapt that empowers home cooks to remove or replace ingredients based on their taste, health, and dietary preferences. The feature aims to keep users in the flow of cooking by offering relevant, trustworthy alternatives—delivered contextually, right when and where they're needed.

By developing personalised AI-driven ingredient adaptations, the company would strengthen their competitive edge—especially when paired with smart cooking appliances. This differentiation not only boosts user engagement but also increases the feature’s value as a marketable offering to potential partners.

Challenges

User confidence

One of the biggest challenges was balancing technical constraints with user trust. I had to design a UI that didn’t overwhelm or interrupt the cooking flow, while still giving enough information for cooks to feel confident in their decisions.

Scale of collaboration and planning

Another challenge was to collaborate across Design, Product, Engineering, AI and Content & Discovery and align on what was feasible for the Tracer Bullet versus what could come in Milestone 1 and 2 iterations.

To build alignment, I broke the design problem down into digestible components. I used prototypes, flow diagrams, and user journey maps to communicate the design logic. These helped both technical and non-technical stakeholders see how the experience would function end-to-end.

Exploring different ingredient adapt user flows

Loading times

To deliver the best recipe outcome, our AI Recipe Adaption Service would rewrite the recipe—a process that could take over 20 seconds.

To manage user expectations and enhance perceived value, I used the labour illusion effect, where users appreciate results more when they can see the effort behind them. The loader was also designed to be adaptable, so it could scale down seamlessly if the rewrite process took less time.

AI Rewrite: Adjustable loading times

AI Rewrite: 8 sec loader

AI Rewrite: 20 sec loader

My Role

As the Lead Product Designer, I was responsible for:

  • Defining the problem space alongside the PM and Engineer leads to align on user needs and technical feasibility

  • Contributing to milestone planning (Tracer Bullet, Milestone 2, Milestone 3) to ensure UX considerations were baked into the delivery plan from the start

  • Mapping out the end-to-end user journey and identifying key touchpoints where ingredient substitution would add the most value

  • Designing and prototyping intuitive, scalable UI solutions across mobile and web platforms

  • Collaborating closely with engineering throughout each milestone to ensure the user experience was technically achievable and could scale

  • Working with our User Researcher on iterative testing of the substitution experience with internal and real users to gather feedback and validate assumptions

Approach & Process

Tracer Bullet
We approached this through a phased rollout. We started with a tracer bullet—a minimal, end-to-end build, designed to validate the technical approach and core user experience early on. Instead of using AI, this version relied on a static find-and-replace list of ingredient substitutions to simulate the experience. The goal was to build trust within the team, reduce delivery risk, and align on the direction before investing in a full-featured build.

This stripped-down implementation allowed us to test the foundational UX and engineering flow using a simplified JSON backend, ensuring that the entire system—from triggering a substitution to rendering the updated recipe—worked smoothly. It gave us a fast and effective way to validate assumptions, gather early feedback, and confidently move forward with the next phase of development

Tracer Bullet using static find-and-replace list

Milestone 2

We integrated the beta version of Fresco’s AI-powered Recipe Adaptation Service to enable real ingredient substitution and removal. Building on the tracer bullet foundation, this phase expanded both the technical functionality and the user experience.

The UI was enhanced including a loading feedback and “My Personalised Recipes”—a dedicated space where users could save, manage, and easily access their adapted recipes.

Milestone 2

Milestone 3

We conducted usability testing on Milestone 2 to gather insights and collaboratively shaped the direction for Milestone 3 based on user feedback.

This milestone explored;

  • “Undo” feature

  • Ingredient substitution taste and cooking information

  • Updating recipe title to reflect any relevant changes

  • Updating recipe step text to take into account any changes as a result of the AI Adaptation.

  • Exploration of AI tone and wording

Impact

Although the AI Ingredient Substitution feature has not yet been released, it’s expected to create meaningful impact for both home cooks and our partners. By enabling users to easily adapt recipes based on ingredient availability or preference. For our partners, this means greater engagement with their content and broader utility for their recipe catalog—ultimately helping more of their recipes get cooked, more often.

This project highlighted the power of small, focused AI tools embedded into everyday workflows. It also underscored the importance of scoping a thoughtful MVP, building trust through UX, and collaborating deeply with data and engineering teams.