§1 · install
Install in sixty seconds.
Two real paths into a Claude Code session. The marketplace is recommended; the clone is equivalent.
/plugin marketplace add blyatiful1/ultraweb
/plugin install ultraweb@ultrawebConfirm the install in the dialog, then run /reload-plugins — or restart. Update later with /plugin marketplace update ultraweb.
git clone https://github.com/ blyatiful1/ ultraweb .git ~/ .claude/ skills/ ultraweb
Auto-loads as ultraweb@skills-dir next session. Update with git pull; remove by deleting the directory.
/plugin → lists ultraweb
/ultraweb → available as a command§2 · first build
From one prompt to green gates.
The interface is one line. Everything after it is the pipeline’s problem.
/ultraweb build me a website for a Berlin specialty coffee roastery with an online shopThat’s it — the README’s own example. Every phase writes its decisions to design/*.md, so later phases and later sessions stay coherent.
The twelve phases
- 01Understand — the prompt becomes design/BRIEF.md
- 02Direction — one archetype, one signature move
- 03Foundation — the design system, then tokens
- 04Structure — sitemap and per-section blueprints
- 05Scaffold — the Next.js app, stack verified
- 06Build — section by section from SITEMAP
- 07Backend — only what the brief demands
- 08Voice — every string rewritten to spec
- 09Motion — choreography, reduced-motion honored
- 10Findability — metadata, OG images, JSON-LD
- 11Gates — seven gates, fix until green
- 12Ship — env audit, build, handoff
The artifact contract
Coherence is written down: five files, written once, read downstream.
| file | written by | read by |
|---|---|---|
| design/BRIEF.md | brief | direction, sitemap, wireframe, copywriting, and every Tier 6 backend skill |
| design/DIRECTION.md | direction | color, typography, layout-grid, depth, shape-language, imagery, motion-language, theme-worlds, wireframe |
| design/SYSTEM.md | foundation phase | tokens, and every Tier 3 component + Tier 4 motion skill |
| design/SITEMAP.md | sitemap + wireframe | scaffold, app-structure, hero, feature-sections, routing, analytics |
| design/QA.md | every gate | ship |
/ultraweb build me a website for a Berlin specialty coffee roastery with an online shopDescribe the site. The pipeline decides the rest.
§3 · what it costs
Priced in tokens, honestly.
A full /ultraweb run is a twelve-phase studio pipeline, not one generation call. It is priced accordingly — plan for it.
Full /ultraweb build
/ultraweb <prompt>
- what runs
- all twelve phases, gates looping until green
- token cost
- far above a typical prompt
- you ask
/ultrawebplus one prompt- when
- a new site, or a full redesign
Iterate
for changesultraweb:iterate
- what runs
- only the gates the change touches
- token cost
- scoped to the change
- you ask
- plain language — “make the hero bolder”
- when
- everything after
Keeping it down
- 01Build once, then iterate — reserve full runs for new sites and full redesigns.
- 02Ask for changes in plain language; only the gates the change touches re-run.
- 03Model routing keeps the bill honest — sweeps on Sonnet 5, judgment on the lead / Opus 5 tier.
“cheaper per call is not cheap overall.”
§4 · questions
Questions, answered plainly.
Do I need Playwright MCP?
Only for the empirical gates. gate-responsive, gate-visual, and the pixel-qa subagent screenshot real pages through it. Without it those gates degrade to honest “unverified” reports — never fake passes. Everything else runs as normal.
Which model runs what?
By judgment density, not prestige. Brief, direction, foundation, structure, and voice stay on the lead model. Specialist critiques — design-judge, stack-doctor — run on Opus 5. Mechanical sweeps — breakpoint screenshots, build and lint runs, computed contrast, Lighthouse — run on Sonnet 5. Verdicts flow up, never sideways.
Can it work on an existing site?
Two ways. A site this pipeline built takes plain language — “make the hero bolder” — and ultraweb:iterate scopes the edit. Any other site goes through ultraweb:retrofit, which produces a scored gap report before a line changes.
How do I update it?
Marketplace installs: /plugin marketplace update ultraweb. Manual installs: git pull inside ~/.claude/skills/ultraweb, then /reload-plugins or a restart. Removal is deleting the directory.
What does a full build cost?
Tokens — far more than a typical prompt, and it runs longer. Twelve phases, accumulated design/*.md context, and multi-round screenshot gates are the price of the discipline. Iterating on an existing site costs a fraction: only the touched gates re-run.
What happens when a gate fails?
The pipeline loops fix → re-gate until the report is green. Gates are never weakened to pass, screenshots never faked, and done is not reported over a red gate. A gate failing twice on the same issue forces a root-cause fix, not a third patch.
§5 · the ask
The ask, once.
Copy the command; the next build is yours.
/plugin marketplace add blyatiful1/ultraweb
/plugin install ultraweb@ultraweb