Code is the new design canvas • Kyle Fox

The days of designers handing pictures to developers and hoping for the best are over.

A grandmother using a tablet to design, symbolizing the democratization of design tools

I’ve been thinking a lot about how teams design and code products, and in particular the role AI plays in that process.

The industry’s attention seems to be focused on figuring out how to turn Figma designs into working code. There’s Figma MCP, Figma Code Connect, and you can even buy Figma files optimized for generating code for shadcn components.

It works surprisingly well. Like, amazingly well.

But it’s not perfect, and when it occasionally makes mistakes you simply instruct Claude: “Right-align the Save button as shown in Figma.”

Slick!

But what happens if you simply decide to change the design after seeing it implemented? You tell Claude: “Actually, left-align the Save button.”

This is different from telling Claude to fix a mistake. This is designing in Claude. And however superficial this example seems, I think it’s a hint of what the (near) future of product design will look like — and that future doesn’t involve creating pictures of products.

The future will be designers telling Claude: “try adding a curved line chart to the top of the dashboard using our soft blue color scheme. Clicking a point on the chart should open a modal with details.”

Claude will then implement this design in actual code, allowing the designer to interact with a true representation of what the product feels like, rather than stitch together pictures and hope developers capture all the interactive nuances they envision. And if the design feels off, it’s as simple as telling Claude: “instead of displaying a modal, slide in a sheet from the right edge of the screen.” No Figma artifacts to update. No waiting for a developer to implement the modal, only later to change the request and wait on implementation again.

(What happens if the designer decides the first approach felt best after all? The developer will probably be grumpy undoing and redoing work, not to mention the turnaround time waiting on implementation and communication between developer & designer).

Designers are probably recoiling in their Herman Miller Aerons at the thought of AI ripping the tools from their hands. “AI will never be able to replace the value of meticulously iterating & perfecting designs by hand.”

This is where programmers were 18 months ago.

Eliminating Figma removes a step in the translation process. It removes the need to create an artifact that only serves as a way to explore and communicate ideas.

Designers will be able to direct Claude to code actual prototypes according to their vision, rather than have a developer tell Claude how to implement a picture of that vision.

There will still be a place for other tools: pen & paper, diagramming tools, even things like Figma. These are great aids to help designers think through and explore the truly novel aspects of their product.

But the idea of building out high-fidelity, pixel-perfect designs of your entire product in Figma will become an antiquated notion. And the only people doing it will be hobbyists doing it for the love of it, just like the only people left pulling wrenches on car engines are weekend hot-rodders.