Each article is a standalone lesson with examples, prompts, project structures, and review workflows that designers can adapt to real work.
Start with briefing, prompting, visual QA, harnesses, multi-agent workflows, token systems, and the new long-form guides on critique, implementation, prototyping, audits, and research packets.
Showing 38 of 38 articles.
A practical workflow for turning a loose design request into a reviewable agent brief — with a traced run on this site's own field-notes page, and plan-mode guidance for Claude Code, Codex CLI, OpenCode, and Antigravity CLI.
A prompt teardown with the receipts: the same pricing-page request run twice — once vague, once specific — with the generated code, audit output, iteration counts, the residual failure neither prompt fixed, and the rewrite patterns that made the difference.
A long-form workflow for using agents to inspect screenshots, compare implementation against intent, run accessibility checks, and produce fix-ready review notes — traced against a real review of this site's own article page.
A practical tutorial for turning design-system rules, project instructions, skills, examples, and QA checks into a reusable harness that keeps agent-generated UI from drifting into generic output — including a file-by-file walkthrough of the harness behind this site.
A practical decision guide for splitting design work across agents — with a small, real orchestration trace, the briefs and merge log it produced, sourced cost numbers, and clear examples of when a single agent is the better choice.
A practical guide to turning color, type, spacing, radius, and component decisions into token files that agents can read, use, and verify.
A practical workflow for turning agent critique from vague opinion into structured findings, evidence, severity, revision passes, and human design decisions.
A deep workflow for using screenshots as implementation evidence while preserving hierarchy, spacing, states, accessibility, and design-system intent.
A designer-friendly operating model for using agents to explore quickly without accidentally shipping rough prototypes as fragile production code.
A deep workflow for finding design-system drift across tokens, components, screenshots, copy, interaction states, and product meaning.
A practical editorial system for turning tool changes, reader questions, screenshots, examples, and experiments into durable agentic-design curriculum.
How CLAUDE.md, AGENTS.md, path-scoped rules, skills, and auto memory fit together into one instruction hierarchy, with current cross-tool behavior, a four-configuration trace of the same prompt, and copyable starting files.
When a design procedure deserves to become a SKILL.md, what goes inside one, and how to build, trigger, trust, and share it — with a real skill built for this site's own editorial pipeline, including the part that went wrong.
What changes when design decisions live as token JSON and design surfaces live as text files: a worked token-to-CSS case study with a real one-line diff, an honest look at the .pen and .op formats, and a same-day workflow for making design changes reviewable.
An honest comparison of four terminal agents for design-to-code work — Claude Code, Codex CLI, OpenCode, and Antigravity CLI — plus the IDE and cloud surfaces that are not the same product. Volatile facts were re-read on 9 October 2026. Gemini CLI is no longer the individual peer.
A practical guide to design canvases an agent can read and write directly — Paper's HTML/CSS canvas and pen.dev's repo-resident .pen files — including MCP setup, a worked landing-section round trip, and where Figma still wins. Prices and platforms re-read 9 October 2026.
A plain-language guide to the Model Context Protocol for designers: what it is, which design servers are worth connecting, how to configure them on Claude Code, Codex CLI, OpenCode, and Antigravity CLI, and the permission hygiene that keeps a write tool behind a prompt. Re-read 9 October 2026.
A sober map of the open-source design tooling that assembled itself around agent CLIs in 2026 — what Huashu Design, Open Design, and OpenPencil actually contain, how they relate to each other and to Claude Design, a worked comparison of two of them on the same brief, and an evidence-based checklist for adopting community design tooling without getting burned by hype, churn, or unreviewed code.
Design systems decay between redesigns, not during them. This article traces a real accent-token change across CSS variables, components, and prose documentation, shows the review gate that caught a deliberately introduced error, and lays out the standing maintenance loop an agent can run — plus the deprecation, breaking-change, and taste decisions that stay human.
What stands between a designed section and a shipped page: the export step, the gates that make it shippable, and a case study from 1 June 2026 that records what each gate caught. Tool status was re-read on 9 October 2026. The case study was not re-run.
Programmatic video has become an agent output: a 30-second feature clip can be authored as code, reviewed like any other artifact, and rendered to MP4 from the terminal. This article compares Remotion and Hyperframes honestly — authoring model, render paths, agent integration, and licensing — and traces a real product feature clip from prompt to MP4, including the gate that caught the failures.
How to actually run a team of design agents once you have decided to split the work — decomposition patterns, what agent teams, subagents, worktrees, and concurrent canvases support today, a five-surface orchestration run executed for this article, and the complexity tax with the run's own numbers.
Four real agentic design workflows traced from their own repositories — an editorial site, a multi-agent book pipeline, a book-to-video pipeline, and the design system underneath the site — with the timelines git can prove, the configs that did the steering, the failures the gates caught, and the patterns that repeat across all four.
A field note and an opinion: our read on the next year of agentic design — design and code converging into one reviewed loop, design systems turning into machine-readable contracts, real-time human-plus-agent work still mostly a promise, and platform churn as the argument for portable harnesses.
Five prompts we keep reusing for design work with agents, quoted verbatim from the deep articles where they were first published and traced: what each one does, the line that does the work, and where it fails. Not a benchmark — a teardown of the prompts that earned a permanent place in our library.
A field note for designers who have never opened Claude Code: install it, log in, write one specific brief, and walk out of the session with a real hero.html you can open in a browser. The walkthrough was executed for this article — including the things the first pass got wrong — and every command carries a verify-before-running caveat because onboarding steps move fast.
How to choose an agent plan for design work, plus the US list prices that were still on the vendors' own pages on 9 October 2026. Figures that could not be re-read that day are left out on purpose.
How to turn Claude Code and Antigravity CLI hooks into design QA gates that block ship when token drift or accessibility checks fail — so taste and compliance are enforced by the runtime, not remembered in a prompt.
A practical method for turning brand taste into fail-closed eval criteria — anti-slop rules, measurable checks, and critique rubrics agents can run before a human ever opens the diff.
A practical workflow for treating Figma and the codebase as one review surface: write-to-canvas, Make into local code, Code Connect mappings, MCP skills, and a handoff that dissolves into structured review instead of a ticket dump.
How to turn visual QA from a hopeful glance into fail-closed gates: Playwright captures, calibrated LLM judges, parity scores, and CI checks that stop design-agent output from shipping on vibes.
Stop treating accessibility as a cleanup sprint. Wire WCAG-oriented checks, axe/MCP evidence, and human assistive-technology review into the same generate → fix → recapture loop agents already use for visual QA — including what automation cannot prove under EAA-era expectations.
A practical governance kit for design studios and campus programs: when to disclose agent assistance, how to keep critique logs that assign accountability, and why verification rituals matter more than generation speed when work carries a human signature.
A field note on keeping design-agent spend under control: where critique fleets burn tokens, how to budget capture and judge lanes, and a lightweight cost review ritual that does not require a finance degree.
Design teams will not standardize on one coding agent. This field note covers the shared literacy across Claude Code, Cursor, Codex, and Antigravity CLI: instruction files, skills, MCP, permissions, and verification habits that travel when the binary changes.
A head of design does not answer agents with a tool list. First drafts got cheap. Judgement did not. This is the operating model: which capability may run, what stays human in each practice, and the one page a CEO can use.
If agents raise the volume and critique hours stay flat, the quality bar falls in silence. The head of design's job is the constraint: review capacity, the system as the instruction set, a research line that refuses synthetic users, and a page with a signature.
The design function you already fund can produce more than it can judge. You do not need the tools. You need three decisions: the judgement budget, the systems an agent may touch, and the human who answers when the work ships.