09 / 20AI × interface

A perfect Figma frame can still meet its first real mobile viewport and develop a personality disorder.

24 September 20264 min read3 research sources

A perfect Figma frame can still meet its first real mobile viewport and develop a personality disorder.

First, design is completed.

Then development begins.

Then somebody discovers that the finished design did not account for production data, browser behaviour, component constraints, animation performance or edge cases.

01So the work moves backwards again.

So the work moves backwards again.

Agentic tooling is pushing toward a different model: continuous movement between canvas and code.

Figma now describes workflows where agents can read design-system context, produce implementation, capture running interfaces back into Figma and continue refinement there.

That is more than a productivity improvement.

02It changes where design decisions happen.

It changes where design decisions happen.

Some decisions are easier to make in a canvas: hierarchy, composition, typography and visual exploration.

Others are easier to make in a browser: responsiveness, scrolling behaviour, real data, transitions and device constraints.

A mature workflow should allow a product to move between both environments without pretending that either is the single source of truth for everything.

03This matches how complex interactive work is already built in practice.

This matches how complex interactive work is already built in practice.

A responsive component often cannot be fully judged from a static frame. An iframe integration behaves differently when the viewport collapses. A carousel needs real interaction. A navigation system has state that a screenshot cannot communicate.

In work on HZ-Archives, I have had to deal with details like mobile contribution-calendar layouts, long breadcrumbs, iframe sizing and spacing. These are examples from my practice; the specific commit history should be checked before using them as independently verified case-study evidence.

None of those problems are “just development”.

04They affect the experience.

They affect the experience.

A code-to-canvas workflow makes that relationship visible.

The design file can become a place to evaluate production reality rather than only a specification created before reality.

For agencies, a tighter loop could reduce the repeated translation of one idea across static files, code and screenshots. It does not remove the need to test the running product.

05The future team is less likely to throw a finished design over a wall.

The future team is less likely to throw a finished design over a wall.

It is more likely to operate a shared system in which design and implementation continuously inform each other.

That should result in fewer handoff documents.

But it should produce more design thinking.

SourcesResearch trail

References used for this article

  1. 01Figma, Building Frontend UIs with Codex and Figma
  2. 02Figma Dev Mode
  3. 03Figma MCP guide

If you can relate, feel free to reach out.


Share your thoughts?