Skip to content
Course / Foundation

Agentic Design Fundamentals

The foundation course for the whole curriculum. It covers what actually changed when capable coding agents, MCP, and design-as-code formats arrived together, the designer-agent loop that replaces tool-centric production, how to brief and harness an agent so its first draft is worth critiquing, and where the approach still fails. The material follows Part I of The Agentic Designer and the school's published briefing, harness, and critique articles, with worked examples drawn from real runs rather than demos.

Modules
6 modules
Total time
≈4h 45m
Last updated
2026-06-02
Your progress
0/6 modules completed
Start with Module 1
Audience and outcomes / 01

By the end of this course you can…

Product designers, design leads, and design-minded builders who have used chat assistants but have not yet run an agent against a real project — or who have run one and could not get repeatable quality from it.

01

Explain the agentic design paradigm in plain terms to a design team, including what stays human.

02

Run the designer-agent loop — brief, plan, review gate, generate, critique, revise, ship — on a bounded design task.

03

Write briefs that carry intent, constraints, and review criteria instead of restating the design system.

04

Set up a design harness — instruction files, path-scoped rules, tokens, and skills — that makes agent output consistent across sessions.

05

Choose a starting agent platform and design-as-code stack with a clear-eyed view of trade-offs.

06

Apply critique loops, visual QA, and quality gates that catch agent failure modes before stakeholders do.

Curriculum / 02

Modules

Every module has a full slide deck with speaker notes and a narration script.

01

The Agentic Design Paradigm

What actually changed when capable coding agents, MCP, and design-as-code formats arrived at the same time, what an agent is and is not, where the new designer-agent loop differs from the tool-centric loop, and what stays firmly human.

02

The Designer–Agent Loop

The loop from Module 1 slowed down to working speed: what each step looks like in a real session, how to treat the agent as a junior design partner rather than a vending machine, and where the loop most often breaks.

03

Briefing and Design Intent

The brief is where design intent becomes executable. This module covers the anatomy of a design brief, the difference between vague and specific prompts in measurable terms, and how research packets feed briefs that an agent can actually act on.

04

The Design Harness

Briefs carry task-specific intent; the harness carries everything durable. This module covers the instruction hierarchy, project instruction files, path-scoped rules, skills, and design tokens as agent instructions — the layer that makes output consistent across sessions and people.

05

Design-as-Code and the Tool Landscape

Why diffable design files are the foundation the rest of the workflow stands on, what the current agent platforms and connected canvases actually offer, and how to pick a starting stack without betting the team on a moving target.

06

Critique, Quality Gates, and Limits

The closing module: how to critique agent output so it improves, which checks can be made executable, the failure modes that keep recurring, and an honest account of what agents are still bad at — finishing with a ship checklist and where to go next in the curriculum.

Related material / 03

The sources behind this course.

The course teaches the practice; the books and articles carry the depth, sources, and worked runs it draws on.

The Agentic Designer

The operating model for product designers, design leads, and builders who need to understand what changes when agents join design work.

Claude Code for Designers

A practical guide for designers who want to work directly with coding agents without turning it into a programming manual.

Brief an Agent Like a Design Partner

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, real plan-mode guidance for Claude Code, Codex CLI, OpenCode, and Gemini CLI, and the templates to reuse the same day.

Read article

Vague Prompt vs Specific Design Prompt

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.

Read article

Visual QA With Agents

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.

Read article

Build a Design Harness Before You Prompt

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.

Read article

Design Tokens Are Agent Instructions

A practical guide to turning color, type, spacing, radius, and component decisions into token files that agents can read, use, and verify.

Read article

Design Critique Loops With Agents

A practical workflow for turning agent critique from vague opinion into structured findings, evidence, severity, revision passes, and human design decisions.

Read article

Choosing Your Agent Platform: Claude Code, Codex CLI, OpenCode, and Gemini CLI for Design Work

An honest comparison of the four mainstream CLI agents for design-to-code work — config support, skills, MCP, sandboxing, pricing, and churn risk — plus a decision framework, a traced case study, and the portability argument that makes the choice smaller and more reversible than vendors want it to be. Every volatile fact is date-stamped: last verified June 2026.

Read article