Inspiration
Food labels make simple choices hard. Serving sizes differ, ingredient lists are difficult to scan, and lab results rarely tell a shopper what matters. We wanted a child, a parent, or an AI agent to compare real products and understand the tradeoffs in seconds.
What it does
Murph Food Lab searches more than two million branded foods and compares up to four exact products side by side. It normalizes nutrition to the same basis, shows a clear A-E Murph grade, calls out useful and concerning ingredients, and links exact product-level lab evidence when it exists.
The person and the agent share one visible workspace. The agent can search for foods, add exact products, read the current comparison, and open the evidence drawer. The person stays in control and sees every result the agent used.
How we used WebMCP
WebMCP is the interaction layer, not a wrapper around a chatbot. The Food Lab page registers four typed tools:
- search_food_products searches the public catalog and returns exact product references.
- compare_food_products places selected products into the visible comparison.
- get_food_comparison reads the same normalized metrics and grades shown to the person.
- show_food_evidence opens the visible evidence view for one selected product.
Each tool has bounded input, structured output, and shares the current page state. This lets an agent act through the real interface instead of using a separate hidden backend.
How we built it
We built the experience with TypeScript, React, Next.js, WebMCP, PostgreSQL, Vercel, Brandfetch, and Codex CLI. Murph reuses its public product search and exact-evidence APIs. Nutrition comparison and grading use deterministic code. WebMCP exposes those same results to compatible agents.
Challenges we ran into
The hardest part was keeping the result useful without pretending that one food is universally healthy. We kept nutrition, ingredients, and lab evidence separate. Missing lab data stays unknown instead of becoming a safety claim. We also filtered generic database rows that look like products but do not identify a real consumer product.
Accomplishments that we are proud of
- A shared human-agent comparison instead of a separate AI chat result.
- More than two million searchable food records.
- Clear A-E grades with plain-language reasons.
- Exact product-level evidence when available.
- Stable layouts across loading, empty, mobile, and four-product states.
- Brand matching without exposing the Brandfetch credential to the browser.
What we learned
WebMCP works best when tools control a useful page that already makes sense to a person. Typed tool inputs, exact product references, and shared visible state made the agent behavior easier to trust and debug.
What is next
We want to add barcode scanning, more exact lab sources, regional product catalogs, and personal comparison preferences. We also want agents to explain why two similar products received different grades without hiding the underlying label or evidence.
Built With
- brandfetch
- codex-cli
- nextjs
- postgresql
- react
- typescript
- vercel
- webmcp

Log in or sign up for Devpost to join the conversation.