Handful Is Not a Unit

Inspiration

Family recipes are often never written down. They live in someone's hands: "a handful of flour", "a pinch of salt", "cook it until it looks right". A handful is not a unit, so a card that says "1 cup" is a guess that erases the cook's own words.

Handful Is Not a Unit is a proof of concept for capturing those recipes while the cook is still cooking: an iPhone or iPad props up on the kitchen counter, mom talks through the dish, and her daughter ends up with a recipe card she can cook from later.

What it does

• Listen or type. Tap Start listening and talk, or type or paste what mom said. Both go down the same path, so the app works with no microphone at all.
• Ingredient lines appear while she talks. Each line shows the ingredient, mom's own words ("a handful of flour"), and the amount ("about 1/4 cup"). Exact amounts ("two eggs") appear as said. Rough ones are labeled as estimates until someone taps Looks right or changes them.
• It asks instead of guessing. An ingredient with no amount, or a rough word the app does not know, becomes a question. Questions nobody answers during cooking wait and come back after Finish. If mom cannot give an amount, the line can stay "as mom says", with her words and no number.
• A keepsake card. Finish ends with a recipe card: the dish name, every ingredient with mom's words and its amount, the steps in her words, and a note that the amounts are estimates. Optional photos of mom adding an ingredient and of the finished meal go on the card.
• Saved on the device. Finished recipes are listed on the home page and survive closing Safari.

How it works

One rule holds the app together: the AI reads, the app measures. Google's Gemini reads the text of what mom said and picks out ingredients, her amount words, how many of them, and the steps. It never decides how much "a handful" is. That number comes from a fixed table in the app, so the same words always give the same estimate, labeled as an estimate and shown next to her own words. If a word is not in the table, the app says the amount is unknown and asks.

Speech is turned into text by the browser's built-in speech recognition. The app does not record, save or send audio itself. Only the text of what mom said and the names of the ingredients already listed go to the app's helper and on to Gemini. Photos are shrunk on the device, stored with the recipe, and never sent to any server. There are no accounts and no server-side database.

How I built it

I am not a programmer by background. I built this with the Devpost Learn Skill Pack in Claude Code, from an empty folder: the skills interviewed me, produced scope.md, prd.md and spec.md, and then built the app in seven slices. I made the product decisions (what it does, what it must not do, what to cut) and reviewed each slice by trying it, including on a real iPhone. Claude Code wrote the code, tests and README under my direction.

Challenges

• Rough words are not measurements. The first spec only kept the rough word, which cannot express "two handfuls". Gemini now also reports how many of the rough word mom said, and the measuring table multiplies.
• A bug only a phone could show. The Photo button did nothing on iPhone because the file picker was opened after an await, and iOS Safari only allows it directly inside the tap. Laptop browsers allowed it, so checks passed there. A check on the real device found it, and the fix opens the picker in the tap itself.
• Not letting the AI guess. Keeping Gemini out of the arithmetic took a checked answer format and a rule that an unknown word becomes a question, never a number.

What I learned

Plan before building. Writing down what "working" looks like first made each slice small enough to check, and the one rule above ("the AI reads, the app measures") kept the AI's job narrow enough to trust.

What's next

Delete for saved recipes and photos, sharing a card between devices, and a bigger measuring table (fresh herbs are currently filed as spice). This is a proof of concept, and nothing in it is food-safety, allergy or nutrition guidance.

Built With

• claude-code
• gemini
• google-gemini-api
• indexeddb
• nextjs
• react
• typescript
• vercel
• vitest
• web-speech-api