Agentic Coding Is Mostly Design
When an agent does the implementation, the human's work is design, deciding and conducting, and the record of that work can live in the Figma file. One real case: a build matched 4 of 27 measured properties from a picture and 26 of 27 from the design data, yet still shipped a button 312 px wide against 129 px. One…
Agentic Coding Is Mostly Design
When an agent does the implementation, the human's work is design, deciding and conducting, and the record of that work can live in the Figma file. One real case: a build matched 4 of 27 measured properties from a picture and 26 of 27 from the design data, yet still shipped a button 312 px wide against 129 px. One card, one run.
Chapters 0:00 Opening 0:25 Key terms 0:39 What moved 1:44 The loop 2:41 The ledger 4:16 Three lenses 4:50 How to follow along 5:18 Recap 5:26 Your turn
Your turn. Paste this into Claude: Open any Figma file you have. Add a page named Ledger. Write one entry for something an AI did for you today: the date, which tool, what you asked, what changed, and whether you accepted it. Then write one thing you doubted. Then check two things yourself: the entry names the tool, not just "AI". You wrote one doubt, even if the result looked fine.
Sources: Figma help, View a file's version history: https://help.figma.com/hc/en-us/articles/360038006754-View-a-file-s-version-history . Figma MCP server guide: https://help.figma.com/hc/en-us/articles/32132100833559-Guide-to-the-Figma-MCP-server . Figma for Education: https://help.figma.com/hc/en-us/articles/360041061214-Figma-for-Education
Professor Bear · Liam, in for Bear (Kokoro am_onyx narration). An independent series by Nik Bear Brown, not affiliated with or endorsed by Figma.
Evidence: archived runs from September 2026 and archived Figma results; no live Figma session was run for this film. Drawings are labeled concepts. Written and built with Claude Code; narration is synthetic. Humans retain source ownership and release authority.
What this video covers
- 0:00 — Opening
- 0:25 — Key terms
- 0:39 — What moved
- 1:44 — The loop
- 2:41 — The ledger
- 4:16 — Three lenses
- 4:50 — How to follow along
- 5:18 — Recap
- 5:26 — Your turn
Transcript
A lightly formatted transcript of the video, with timestamps so you can jump to any section on YouTube.
Opening
[0:00] Agentic Figma with Professor Bear. Agentic coding is mostly design. When an agent writes the code, the work that is left is design. Deciding what to build, stopping the agent, and checking what it made. Hello, this is Liam in for Bear. Here's the question most people arrive with. If an agent writes the code, is the thinking done? It is not. The typing moved. The deciding did not. And an agent will build whatever you ask for quickly, whether or not it is right.
Key terms
[0:25] Four terms. Agent, a program that takes steps on its own toward a goal you set. Phase gate, a point where the agent stops and a person looks. Source of truth, the one place a decision is written down. Ledger, a dated log of who asked what and what was decided. What
What moved
[0:40] Moved? Writing code just got cheap. An agent types faster than you ever will, but it does not decide what to build, and it does not answer for what it built. That part is still a person's job. Here is a real case from a run on Bear's Figma account on September 27th. One study card built in Figma, an image, a title, two lines of text, and a button. Agents then had to rebuild it as a web page. One agent saw only a picture of the card. The other saw the same picture plus Figma's own design data, the exact sizes, colors, and fonts. Same request, same limits, one card, one run each. Then the run measured 27 properties, sizes, spacing, fonts, and colors. From the picture alone, the agent matched four. With the design data, it matched 26. Look at the one it missed. In Figma, the button is 129 pixels wide. The agent with the data built it 312 wide, stretched across the whole card. Keep the limits in view, one card, one run each, one model. And the agents read saved copies of Figma's data, not Figma itself. This is a finding about this card, not a law.
The loop
[1:45] The loop. So, here is the whole idea as a loop. Five gates, frame, plan, draft, audit, ship. At every gate, the agent stops and a person looks. This is a model of the work, not a recording of a session. Frame, you write the intent, the limits, and what would prove you wrong. Plan, the agent writes its plan before it builds anything and you correct it. Draft, the agent builds on a copy, so your original stays safe. Audit, a different checker examines the result, not the one that built it. Then you judge what no checker can, whether it is right for the people using it. Our run did the audit this way. The builders could not render their own pages, so neither could see the stretched button. A separate script laid each page over Figma's render and marked every pixel that differed. Most of the differences in the data build sat in the button row. Ship, the agent merges nothing on its own. You decide and you write down what happened. And revise is the arrow back from audit to draft. In Bear's experience, most of the work happens on
The ledger
[2:41] That arrow. The ledger, keep that work in the Figma file on a page called ledger. One entry per decision with eight fields, date, gate, actor, what you asked, what changed, what you decided, the doubt that was caught, and a link to the evidence. Here's one entry rebuilt afterward from archive notes of the run we just saw, not written in Figma at the time. Date, September 27th. Gate, audit. Actor, a measuring script. The doubt it caught, a button 312 wide, not 129. Why inside the Figma file? Bear's reason. A note should not get separated from the thing it is a note of. In an archived test, a review note written on the study card came back with that layer when the next agent read it, and Figma's server told the agent not to ignore it. Now the limits as limits. A note on a frame reached the next agent. A note on a component set did not in
Both tests. A component's description did come through, so put notes on frames or in descriptions. Figma saves checkpoints of your file on its own about every 30 minutes, according to its documentation. A person can also save a named version with a reason. But when the agent's tool was asked to save one, it answered, "Not a supported API." One more limit, as far as we can tell, the agent works through your own sign-in. So, the file's history credits you, not the agent. That is why the entry has an actor field. You write down which agent did the work. Two things we are not claiming. First, that Figma logs what the agent did on its own. As far as we found, it does not. Second, that hidden notes stored on a layer work. We have not tested them. Also, Figma is not Git. Its history is a log of the file, not a signed account of who did what.
Three lenses
[4:17] Three lenses. Lens one, direct. You decide what the agent may touch. In our run, the builders could read, write, and edit files and nothing else. No web, no shell. That limit was one line of a command, and it had a price. They could not look at their own pages. Lens two, doubt. Check every claim, the agents, the tools, and ours. Both agents in the run reported success. Only a measurement showed that one of them had stretched the button. Lens three, decide. A checker can tell you the button is the wrong width. It cannot tell you whether the button should exist or who it might confuse. Those decisions stay with a person.
How to follow along
[4:51] How to follow along. Here is the path so far, the premise. Before the agent touches anything, the agent works in you gate across the boundary between design and code and skepticism and the human. These are the parts planned so far, and the list will grow. Each film works the same way. Watch the idea, run the gate yourself, write one ledger entry. A Figma education account is a good place to start, and some features depend on your plan, so check yours before you rely on one.
Recap
[5:18] Let's recap with Claude Typing moved, the deciding did not. Five gates, one arrow back. The file keeps the log. Check every claim, including ours.
Your turn
[5:27] Open any Figma file you have. Add a page named ledger. Write one entry for something an AI did for you today, the date, which tool, what you asked, what changed, and whether you accepted it. Then write one thing you doubted. Agentic coding is mostly design at Nick Bear Brown.
