Bridging the Design-Code Gap (For Real This Time)

I thought this title would feel dated in 2025, and yet, here we are.

Over the past few months, while exploring product opportunities for Chordio, I’ve spoken with dozens of design leaders. The design-to-code gap remains top of mind. In fact, the frustration is alive and well: designers build one thing, only to find it ships as something else.

A decade-old problem (still unsolved)

This isn’t a new pain point. We’ve seen waves of attempted fixes:

• Better spec tools like Zeplin, InVision’s Inspect (RIP), and Figma’s Dev Mode.
• Smarter design tools with features like reusable components, design tokens, and auto-layout, designed to embed logic deeper into visual artifacts.
• And operational fixes: mapping design system components to code counterparts, in the hope that naming conventions alone would ensure fidelity.

But the reality? These fixes haven’t scaled. Keeping design and code in sync is operationally heavy, and most organizations don’t commit the resources needed to maintain that alignment.

Why we didn’t build a solution (and why the problem might actually go away)

Given our past experience building InVision DSM, we considered tackling this again at Chordio.

But something felt different this time. One comment from Emily Campbell stuck with me. As a design leader, she said she’d be surprised if this problem still existed a few years from now. That idea resonated. We saw signs that AI might finally make this problem go away — not by managing the handoff better, but by removing the need for a handoff altogether.

Here’s why:

1. AI translates Figma to code automatically.

A great write-up from Waqar Ali at Typeform shows how they taught AI their design system and got it to build UI from Figma with remarkable accuracy.

2. The design medium is becoming code.

Tools like Bolt.new, Lovable, and Figma Make allow teams to generate production-like apps from prompts. These tools are still limited in enterprise settings because they don’t yet integrate cleanly into company tech stacks, but they prove that the medium is shifting.

3. From prototype to production, without rewriting.

Tools like Cursor and Claude Code allow teams to prototype using natural language, directly within their company’s tech stack and design system. When paired with well-configured sandbox environments, this setup gives designers access to real company code in a safe, isolated space. The prototypes they design are grounded in the actual infrastructure and can transition into production with minimal friction.

4. UI is becoming generative and embedded in workflows.

Platforms such as Vercel’s AI SDK, Airtable’s Omni, and Microsoft Power Apps are making it possible to assemble interfaces inside domain-aware tools. In many cases, the need for traditional UI design disappears altogether.

The real last mile: adoption

AI-native generation, the convergence of design and code, and natural-language tooling will solve 80–90% of fidelity issues in the next few years. The real blocker won’t be tech. It’ll be how fast teams are willing to change how they work.

Delete the bridge

If AI collapses the handoff, the goal isn’t “better specs” — it’s no specs. The artifact becomes code; the spec is the repo. If your team is still filing “handoff tickets” in 2026, that’s not a tooling gap. It’s a leadership bug.

Make it real:

• Put designers in the repo with a safe sandbox and PR rights. Weekly designer-opened PRs or it didn’t happen.
• Treat tokens and components as APIs with versioning, not files with names.
• Measure flow, not fidelity: time from prompt/prototype to merged code, % UI generated from the system, and rework rate after merge.

Bridging the gap, for real this time, means deleting the bridge.

Originally published at medium.com