Project case study
Savory
A recipe is only the beginning of a grocery trip. Savory explores the steps between that recipe and a usable basket: matching ingredients, considering preferences and deciding how to shop.
My role: Product concept and prototype development with AI assistance.
Watch the interactive walkthroughHow it works
Start with a recipe
Recipe text provides the ingredients for a basket.
Client-side JavaScript parses the text before passing recognized ingredient keys into the matching flow.
Match the ingredients
The prototype finds candidates in its built-in catalog.
The matching function uses local catalog data. Availability and prices in this demonstration are illustrative rather than live store information.
Adjust the basket
Preferences and substitutions change the proposed list.
Local profile and cart state drive filtering and totals. Keyword handlers power the chat-like controls; this prototype does not call an AI model.
Preview the handoff
Pickup and delivery screens complete the concept.
JavaScript displays simulated confirmation states and persists the session in localStorage. No order, payment or delivery request is sent.
Make the handoff from recipe to basket visible.
The prototype accepts recipe text, matches ingredients against a built-in catalog and lets the user inspect substitutions and budget choices. It includes shopping-mode and checkout-preview screens so the entire product idea can be explored before live commerce integrations exist.
- Focus
- Single-file HTML, CSS, JavaScript and localStorage
- Status
- Client-side prototype; mock catalog and checkout
How it works
JavaScript parses recipe text, matches ingredient keys against a built-in catalog and updates cart totals from local state. Keyword handlers power the chat-like controls, and localStorage retains the prototype session.
A decision that mattered
I kept the flow demonstrable with local data. That makes the concept easy to inspect, but it also means the interface must not be mistaken for a live grocery service. Its chat-like controls use keyword handling, and its confirmations are simulated.
Status
This version is a client-side prototype with a mock catalog and simulated checkout. It does not place orders or call a live AI service.