Planning a workshop or vehicle shelter starts with ordinary language but quickly becomes structured: use case, footprint, height, roof, openings, material, anchoring, budget, and unresolved site constraints. A normal chat can suggest an answer, but the reasoning often disappears into prose and the page on screen drifts out of sync.

BuildBrief Studio makes WebMCP the product interface between those two modes. The visual worksheet and six imperative Website Tools share one validated configuration. An agent can discover catalog options, compare two or three candidates, apply a partial recommendation, read the result back, review constraints, and create a preliminary brief. Write tools update the visible UI before returning and leave exact field-level receipts. If the person changes a value afterward, the revision advances and the old brief is visibly marked stale.

The demo is deliberately safe and easy to judge: no login, no personal information, no external API, and no production system. Every dollar value comes from a bundled synthetic catalog and a deterministic formula. Strict schemas and runtime validation reject extra fields and incompatible choices. Read-only annotations match behavior. Permit, access, anchoring, snow-load, and site conditions remain explicit human work rather than being hand-waved by automation.

The result is a small but complete example of what WebMCP enables: not an agent operating beside a website, but a person and agent collaborating through one observable decision surface.

How WebMCP is used

  • search_catalog discovers relevant structures from natural-language needs.
  • get_build_state grounds the agent in the person’s latest visible choices.
  • compare_builds evaluates two or three validated alternatives in one call.
  • apply_build performs a partial visible update and returns exact before/after changes.
  • check_constraints separates catalog fit from human verification.
  • create_build_brief renders a deterministic handoff artifact on the page.

All tools are registered imperatively from the top-level page through document.modelContext.registerTool. They use strict JSON Schema, truthful read/write annotations, concise structured output, and an AbortSignal lifecycle.

Quick judge path

Open the live demo in ChatGPT’s in-app browser, wait for “6 Website Tools ready,” and send the demo prompt shown on the page. Verify that the agent searches, compares against the $15,000 illustrative budget, applies an enclosed 20 × 24 workshop with a roll-up door, surfaces human checks, and creates the visible project brief. No credentials are required.

Built With

Share this project:

Updates