The method is the exhibit

01The shape of the run

One orchestrator session (the director) wrote a design constitution and ten art-directed briefs, then spawned ten parallel Fable 5 builders, each owning one folder, one brief, and full autonomy inside it. No templates, no shared components, no two sites allowed to share a signature trick.

The briefs were designed against a map of prior art (Nick's fable-25 set of 36 sites): half of ours push past his strongest axes (fluid instead of raymarch tricks, behaving flocks instead of static particles, type driven by time instead of the cursor, a story you play instead of a terminal you type at, physics you drag instead of a chart you scroll), and half claim territory that set never touched (zero JavaScript, generative identity, a truthfully computed sky, physics as layout, text-mode 3D).

Each brief carried: concept, palette, typefaces, signature technique, the one thing the site must prove, and one named banned crutch, the default move that builder was forbidden to lean on. Denying the crutch is what forces invention.

02The floor (the design constitution)

Non-negotiable for every site. A builder cannot trade these away:

• Real copy only. Every sentence written for that fictional brand. No lorem, no headlines that fit any business.
• Distinctive type. Two distinctive faces minimum, or one variable font exploited across its range.
• Custom easing. Hand-picked cubic-beziers everywhere; compositor-friendly animation; never transition: all.
• Composed, not merely unbroken, at 390px and 1440px.
• Accessible. Landmarks, alt text, focus states, honest contrast, and prefers-reduced-motion respected with a composed still experience.
• Zero console errors. Hard gate, both viewports, verified by harness JSON.
• No widows on display text. Balance it, pin the tail, or rewrite the line.
• Banned AI tells. Uniform border radii, identical hovers, three identical cards, gradient placeholders, dead buttons, purple-to-blue gradients, the cream-coral-sage wellness kit, the dark-void-cyan-grid look.
• One signature moment per site: the thing a viewer screenshots.
• A /guide route in the site's own visual language: brief, techniques with real code, asset provenance, and what every critique pass caught.

03The harness (pixels or it did not happen)

Code review cannot see a widow, a muddy button, or a flock that reads as static. Before any site code existed, the run had a verified screenshot harness: a ~40-line Playwright script that renders a URL at any viewport and scroll position, captures the pixels, and prints the console errors as JSON.

node tools/shot.mjs http://localhost:4179/inkstone/ out.png 1440x900 4000 [scrollY]
→ {"out":"out.png","docHeight":6162,"errors":[]}

Builders were required to look at their own screenshots with vision and critique the rendered pixels, not their code. Several builders went further and wrote their own instruments: a contrast auditor, a story-state driver, an astronomy checker with invariants, a 17-check interaction harness. The harness closes the loop between what the code says and what a human would actually see.

04The critique protocol (three hostile passes, evidenced)

1. Render real pixels at desktop and mobile, plus every designed scroll depth.
2. Critique like a hostile design director: rhythm, contrast, alignment, widows, dead zones, muddy hierarchy, anything that smells like an AI default. And the site's own make-or-break question (does the flock read as a murmuration? does the pile read as weight?).
3. Fix everything found. Not the top three. Everything.
4. Add one deliberate complexity upgrade so iteration never converges on bland safety: a texture, a micro-interaction, an easter egg, a subplot, a fourth envelope.
5. Leave evidence: shots on disk plus a findings log per pass. A pass with no artifacts did not happen.

Across the ten sites this produced 34 evidenced critique rounds and caught, among much else: an inverted lunar-illumination sign error (full moons drawing dark), a pointer-capture bug that killed dragging on synthetic pointers, a figcaption that reordered its own sentence, a physics funnel orbiting out of frame, and a self-description that was written before the work it described (rewritten; the log must trail the work, never lead it).

05The director gate (nothing signs itself)

A builder's own "it passed" never counts. The director reviewed every site's final shots cold, audited the evidence (claimed passes counted against findings logs on disk, claimed zero errors re-verified with fresh harness runs, claimed determinism re-checked), and sent back specific findings until the site was signable. Two examples from this run: an almanac whose sidebar table disagreed with its scrubbed masthead by one epoch, and a hero deck claiming ten thousand birds under a live counter reading 46,656. Both were the same class of defect: a site about truthful computation must not undercut its own instrument.

Then the director ranked all ten and sent the bottom two back for directed rebuild passes (a one-shot visual overture and material warmth for the sequencer foundry; a three-second-legible hero and a scatter-to-carve assembly moment for the glyph cathedral). The set does not ship until the floor rises.

06Assets (procedural first, generation logged)

Eight of ten sites are fully procedural: GLSL, canvas, SVG, CSS. Two sites carry AI-generated photography (four period evidence photographs for the dead letter office, four desert photographs for the retreat), generated through Fal (Nano Banana Pro), optimized to WebP at role-appropriate sizes, and disclosed in each site's guide. Every generation is logged in an assets ledger: pipe, model, prompt, purpose, site, cost. Total media spend: $0.40.

07The stack (aggressively boring on purpose)

All the complexity budget goes into the rendered pixels, none into the pipeline. Anyone can read the source of any page here; that is part of the point.

08Run it yourself: three prompts

These are the working prompts, trimmed to travel. They assume an agentic model that can write files, run a local server, and take screenshots (any Claude Code style harness). Paste, fill the brackets, go.

Build me one showcase website as a public demonstration of taste: static HTML/CSS/JS, no framework, no build step, fictional brand only.

First write the brief you will build against: concept, palette (specific hexes), two typefaces, ONE signature technique, the one thing the site must prove, and one banned crutch (the default move you would otherwise lean on; you may not use it).

The floor, non-negotiable: real copy written for the brand (no lorem, no vague headlines); custom cubic-bezier easing (never transition:all); composed at 390px and 1440px; semantic landmarks, alt text, focus states, prefers-reduced-motion respected with a composed still state; zero console errors; no widows on display text (balance, pin the tail, or rewrite); no em or en dashes; varied border radii and hover vocabularies; no three identical cards; accent color under 15% of the surface; one moment worth screenshotting.

Verification: set up a screenshot loop (Playwright: render URL at 1440x900 and 390x844 plus scroll depths, save PNG, print console errors as JSON). Then run THREE hostile critique passes: shoot real pixels, LOOK at them, critique rhythm/contrast/alignment/widows/dead zones/AI defaults, fix everything found, add one deliberate complexity upgrade, and write a findings log per pass. A pass with no artifacts did not happen. Zero console errors is a hard gate.

Ship with a /guide route in the site's own visual language: the brief, your techniques with real code excerpts, asset provenance, and what each pass caught.

Study this site: [URL]. Fetch it, screenshot it at desktop and mobile, read its structure.

Write a short analysis that separates MECHANISM from CIRCUMSTANCE: what makes it land (the interaction model, the pacing, the trick) versus what is incidental (its palette, its industry, its copy). Rank what lands hardest.

Then write a brief for a NEW site that beats it on its own mechanism without cloning it: different fictional brand, different palette and type, a signature technique that pushes the mechanism further than the original dared. Name one banned crutch: the original's most recognizable surface move; you may not reuse it.

Then build it under this floor: [paste the floor block from PROMPT A], with the same three-pass evidenced critique protocol and a /guide route documenting brief, techniques with code excerpts, and what each pass caught.

Open https://fable-10.pages.dev/guide/ and treat it as your build protocol. You are both the builder and the hostile critic it describes.

Pick ONE concept a static site can carry (a fictional brand with a real point of view). Write the brief exactly as section 01 prescribes: concept, palette, typefaces, one signature technique, one thing to prove, one banned crutch you then never touch.

Enforce the floor in section 02 line by line. Build the screenshot loop from section 03 before writing site code, and do not skip it: your code review cannot see a widow, a muddy button, or a dead zone; only rendered pixels can.

Run the three-pass protocol from section 04 with evidence on disk (shots plus a findings log per pass, one deliberate complexity upgrade per pass). Then run section 05 on yourself in a fresh context: reopen your final screenshots cold, write the send-back findings a hostile director would, and fix them before you call it done.

Ship static with a /guide route that discloses your brief, your code, your asset provenance, and what every pass caught. If any instruction here conflicts with taste, taste loses and the floor wins; that discipline is the entire trick.