Post

My training as a designer is built on cycles: idea, refinement, execution, refinement. Tools looks like Paper 🗘 #Prototype 🗘 Browser. The speed was on paper, in #Figma or Miro: cheap, fast, safe to fail. The slow part came later, in the code editor and the browser. Thinking faster. Building slower.

Lately I’ve felt a tug the other way. So today I worked only in the browser, anchored by research and requirements docs. I prototyped in #Claude with real data and real browser behaviour, ignored brand and visual design, and focused on modelling data and refining interactions.

Once the content and interactions worked, I passed them back to Figma purely for styling. Claude drew the coded prototypes onto #Figma artboards almost instantly **with tokens, styles and components intact**. The speed and quality of that handover totally blew me away. Minutes not days.

Prototyping in code has, of course, existed forever. But as a designer, I found it hard to access in a way that was good enough, fast enough, and cheap enough. Browser first, then Figma, then back to the browser with both kept in sync has been a personal revolution for me.

(Can't share links yet but will happily once the work has matured)

The bigger promise is the impact on the #DesignSystem. Held in code, it can finally be the real source of truth instead of a stale Figma library. Figma stays a place to explore and style, while code holds the system truth. For product teams that could close a gap we have lived with for years.

As a designer, coding with LLMs gives me the speed I used to only find with paper and pencil. Everything my training taught me says that’s the "wrong way round". I tried it anyway, and I'm rethinking my assumptions about speed, quality and what a design system can finally become.