EYEBROW — one line, positioning
[HEADLINE — the thesis. ~8 words. States what the process does that a bare agent does not]
[SUBHEAD — 2 lines. Who it is for, and the concrete promise.]
No social proof, no counts — none exist and inventing them is forbidden.
[HERO VISUAL — candidate: the seven steps as a live
diagram, OR the artifact trail rendering itself. Structural question for review:
does the hero carry an image at all?]
[PROBLEM — 1 short paragraph + 3 bullets]
[Paragraph: what goes wrong without a process]
The seven steps
[Step 0 — target mode. Spans full width: it is a precondition, not a step]
1 Intake
[one line]2 Fidelity
[one line]3 Wireframe
[one line]4 Direction gate
[one line + GATE marker]5 System + build
[one line]6 Motion
[one line]7 Review loop
[one line + GATE marker]Two of the seven are gates. The design must make gates read differently
from steps — that is the idea the section exists to communicate.
What you get, every run
00-brief.md
01-fidelity.md
02-wireframe.html + .png
03-directions/{a,b,c}.html + .png
03-direction-decision.md
04-design-system/tokens.json
04-design-system/components.md
04-design-system/assets-manifest.md
05-implementation.md
06-motion-spec.md
07-uat-report.md
STATUS.md
[Explanation: the trail is the point. A non-technical stakeholder
reads STATUS.md; everyone else reads the artifact for their step.]
[SCREENSHOT — STATUS.md rendered]
This page was made by the process
[SCREENSHOT — 02-wireframe.png]
[SCREENSHOT — three directions side by side]
[SCREENSHOT — 07 radar / scorecard]
Real screenshots from this run, embedded as data URIs. If a screenshot
is unavailable, an honest labeled placeholder ships instead — never a drawn substitute.
Install
Harness A
[placeholder command — real URL in D4]
Harness B
[placeholder command — real URL in D4]
STATE: placeholder. Must be visibly marked as such on the live page
until D4 replaces it — shipping a command that does not work is worse than none.
[Who it is for — 2 columns: students / practitioners]
[Students]
[Practitioners]