artifact · 3 of 11
Direction
The one committed archetype, the signature move, and the explicit we-will-NOT list.
design/DIRECTION.md · 7,487 B · Phase 2 — Direction
Direction — Dark Tech, earned ("The Terminal")
Why this, for this brief: The audience literally lives inside Claude Code — a terminal program — so the one archetype the constitution bans by default carries, here, the one justification it accepts: the brand already lives dark, in a terminal, and the site's hero can be the product's actual medium instead of a metaphor for it. The client picked it clean at CP2 (round 1, 2026-08-14) over a data-utilitarian ledger and an editorial dossier; approval buys the look — this paragraph is the justification the constitution still requires. Execution differentiates or it dies: warm black (never navy), zero glow, and a terminal that is real, not decorative.
Signature move: The typeable terminal — homepage hero. A client-side <Terminal> the visitor can actually type into: arrow-key command history, tab-complete over 3–5 REAL commands only (/plugin marketplace add blyatiful1/ultraweb, /plugin install ultraweb@ultraweb, /ultraweb build me a website for my studio, status, help), never an invented command, never faked output — responses replay what the plugin actually does (the interview opening; status prints THIS build's real shipped receipts from design/RECEIPTS.json), with the honest caption designed into the frame ("responses paraphrase the plugin's real first turn; captioned reenactment, not a fake"). Unknown input answers honestly that this terminal only replays what actually happened. Budget/bounds: hand-rolled leaf component ≤ ~12 KB gzip (xterm.js and any terminal library are banned — 20× the budget for none of the honesty); keyboard-focusable with a visible affordance; cursor blink gated on prefers-reduced-motion; <noscript> + SSR render the full static transcript so the move never gates content (Progressive Spectacle Tiers). This is the site's ONE gesture — everything else stays disciplined so it can sing.
Type stance: Space Grotesk (display + UI; hero at display scale ≥4.5× body, tracking −0.02em tight on large) with JetBrains Mono for every command, label, timestamp, SHA, and datum (tabular-nums mandatory on data). Two faces, hard roles, no third. Self-hosted via next/font in Phase 3.
Color stance: Warm black ground oklch(0.17 0.015 50) — hue-warmed near-black, never navy, never pure #000 — warm-white foreground ≈oklch(0.93 0.01 80), hairline borders as low-alpha warm white, flat panels, zero shadows. ONE accent: terracotta oklch(0.66 0.15 45) (deliberate kinship with Claude Code's own badge color — recorded in ASSETS.md as advisory, adopted here as a decision), held to <5% of any viewport, with an AA-lifted variant for small text on dark. PASS/FAIL greens/reds may exist ONLY inside gate/receipt tables as data semantics, AA-checked. Named single-theme commitment: this site ships ONE committed dark world (per the archetype's atmospheric-dark exemplar) — no light inversion is offered; color-scheme: dark is declared; the "both themes" requirement is satisfied by this recorded, deliberate single-world decision, re-decided surface by surface in Phase 3.
Motion stance: Precise and scarce — 150–200ms micro, one ease-out family, prefers-reduced-motion honored everywhere. Terminal-flavored reveals (typing/scan) are licensed by the genuinely dev-native product but budgeted to the signature terminal ONLY; nothing else types itself. Section reveals restrained; no ambient motion, no staggered-fade-on-everything. Semantic Motion Only.
References: DARK/Netflix (Users'-Choice SOTY 2020) — Progressive Spectacle Tiers: the spectacle degrades to a complete static layer; Active Theory v4 (SOTY 2018) — Content-Derived Color as discipline for keeping chroma in content, chrome near-mono; Invert the Genre Palette as the counter-move that escapes the navy-neon template (warm black + terracotta, the way Star Atlas went light). Principles, never surfaces.
Named banned-list exception — the quoted slop (pre-committed by the client in the brief): The anti-slop pillar on /craft quotes the constitution's banned list as subject matter. Exactly these strings may appear there, as QUOTED TEXT CONTENT inside one component marked data-quoted-slop (rendered visibly as quotations), and nowhere else: "Welcome to", "Elevate your", "Unlock the power of", "Seamlessly", "Empower", "Lorem ipsum", the emoji trio ✨🚀🎉, and the literal seven characters href="#" shown as inline code. The exception covers text content only — never actual attributes, classes, hrefs, or CSS; an actual href="#" anywhere remains a defect. gate-antislop logs hits inside the marked component against this citation and fails anything outside it. The gate itself is never weakened.
We will NOT:
- Navy, blue-violet, or cool-dark grounds anywhere; glow, neon, text-shadow halos; any gradient (background or text).
- The runner-up archetypes by name: Data-Dense Utilitarian ("The Ledger") and Editorial/Magazine ("The Dossier") — their content survives as content (the report card, the dated verdicts); their aesthetics do not lead.
- Faked terminal output, invented commands, decorative dashboard/editor mockups, motion-blur cursor blink (the archetype's own redemption riders).
- A terminal library (xterm.js et al.) for the signature — the budget is the discipline.
- Glassmorphism/backdrop-blur, uniform rounded-xl+shadow, emoji as UI, second accents, ambient/decorative animation, scroll-jacking, scanline/CRT kitsch (dated fashion).
- A light theme bolted on as an inversion filter (single dark world is the recorded commitment).
- Reproducing the 2026-07-28 autonomous build's measured table anywhere on the site (client decision, interview R1: prose mention + link only, attributed and dated).
Voice (Phase 8)
Tone words (BRIEF): assured · exacting · dryly self-aware. Tension: a pitch that audits itself. Voice Matrix: Formal↔Casual 3 · Serious↔Playful 2 · Plain↔Expressive 2 · Reserved↔Bold 4 — bold claims, immediately audited, in plain sentences.
- assured — sounds like: "The site you're reading was built by the thing it's selling." / never: "We think you might like what our plugin can hopefully do."
- exacting — sounds like: "Counted, not estimated. The empty cells are empty on purpose." / never: "Packed with countless amazing features working perfectly together."
- dryly self-aware — sounds like: "This archetype is banned by default. The justification is on file." / never: "We're totally changing web design forever!!" Mechanics: person = "it" for the plugin, "you" for the reader, "the client" for this build's human; contractions yes; sentence ceiling 18 words (reading-room documents exempt); jargon IN: tokens, gates, artifacts, checkpoint, receipt, OKLCH, RSC — OUT: solution, platform, powerful, plus the whole expanded banned list; humor dry only; sentence case headlines site-wide; English only (no register decision needed). Calibration: H1 "Built by the thing it's selling" · button "Install the plugin" · error "command not found: X — this terminal only replays what actually happened." Phase 8 sweep (2026-08-14): banned-phrase grep over app/components/lib → clean (one false positive: "loops" matching "Oops"); every H1/H2 counted ≤8 words; the H1→H2 outline of each page read as its argument; six over-limit CTA labels rewritten to ≤3 words verb-first (receipts/verdicts/constitution/guide set).