Ask a founding product designer what their deliverable is and you'll still mostly hear "designs" — Figma files, prototypes, specs. Ask what their team actually builds from, and the answer is changing fast: repositories full of markdown instructions, design tokens, and working component code, much of it executed by AI coding agents that never open Figma.
That gap — between what designers hand off and what teams build from — is where products drift, states get missed, and interaction quality quietly dies. Closing it requires a stack that runs from canvas to code to prose.
Layer 1 — Figma: the thinking surface, not the contract
Figma remains where visual systems get shaped: tokens, type scales, spatial logic, the feel of the product. But its role shifted from "the specification" to "the source of intent."
Structured properly — variables, auto-layout, component properties, tokens that round-trip into CSS — a Figma file becomes machine-readable input. Structured lazily, it becomes a liability: an artifact that looks authoritative and communicates almost nothing an agent can act on.
In practice: name things the way the team and the codebase name them. Save decisions as tokens, not local overrides. Build components so their logic — not just their appearance — is easy to read.
Layer 2 — Claude Code: where design becomes behavior
The second layer is the one most designers haven't crossed into: iterating on real components, in real code, with an AI pair. The cost of this has collapsed to nearly zero — a designer who can describe a component's states, edge cases, and transitions in clear language can have a working version in minutes.
This is not "designers should become engineers." It's narrower: the interactions that define modern products — streaming responses, confidence states, progressive disclosure, recovery flows — only reveal their quality in motion. A designer who can build and feel the interaction iterates ten times while the mockup-bound designer schedules a review meeting.
In practice: describe the component in plain language, get a working version, use it with realistic data, fix what feels wrong, repeat. Ship the loop, not the meeting.
Go deeper: the designer's advantage in this loop is judgment, not code
The value a designer adds when pairing with a coding agent isn't technical skill — it's knowing what to build next and why, recognizing when the generated component misses the user's mental model, and catching the contextual states — loading, error, empty, ambiguous — that agents skip unless told. Agents handle the happy path well; they invent nothing they weren't told about. The designer is the one who knows what wasn't said.
Layer 3 — Markdown: the design system's missing layer
Coding agents do what their instructions say. If the instructions describe only the happy path, the product ships only the happy path.
The founding designer's toolkit now includes markdown files — skills, conventions, instruction documents — that put design judgment in writing so every agent and every developer builds from the same understanding: how the product speaks, what the user's vernacular is, which states every component must handle, what must always be reversible.
Example
what an instruction file actually looks like
# Component: AI Confidence Badge
- Appears on every AI-generated value.
- Three states: sourced (link the source), inferred (show the
assumption), guess (require user confirmation).
- Never label a value "sourced" without a working link.
- Never auto-commit a "guess" state.
- Voice: plain, first person. "I pulled this from the March invoice."Six lines. Every agent and developer now builds this component the same way — with the user's mental model and the product's non-negotiables intact. A style guide tells a human what the button looks like. An instruction file tells an agent why the button exists, who clicks it in what state of mind, and what must never happen after they do.
Go deeper: why writing became a first-class design skill
Classic design systems standardized the visible: color, type, spacing, components. Instruction files standardize the judgment: intent, tone, behavioral rules, edge-case handling. A designer who writes precisely multiplies themselves across every agent-assisted build in the company. A designer who can't is limited to the surfaces they personally touch — and will watch agents ship a product that is technically compliant with the mockups and wrong about everything that mattered.
The stack is the argument
Figma for intent. Claude Code for behavior. Markdown for judgment. Each layer covers what the previous one can't express, and together they change the deliverable from "pictures of the product" to "the product's operating instructions."
For anyone hiring a founding product designer, this is the portfolio question that matters now: not "show me your screens" but "show me how what you made survived contact with the people — and the machines — that built it."