Loading video...

Video Failed to Load

Go Home

skip the design system software. build directly from a design spec using Figma MCP and Intent.

31,518 views • 7 months ago •via X (Twitter)

11 Comments

Luke Wroblewski's profile picture
Luke Wroblewski7 months ago

Here's the Figma < > Intent workflow in detail: * Seed the project manually with Astro + Tailwind init commands (or your preferred stack) * Connect Figma MCP to pull design data directly into Intent's context * Copy Figma frame links for design system colors, typography, grid specs, and page content * First prompt: extract custom colors from Figma and add them to Tailwind config. * Second prompt: build the landing page from Figma comp content * Third prompt: extract header/footer into reusable components, then build remaining 7-8 pages in parallel using Intent's multi-agent delegation * Queue tasks so the coordinator could dispatch multiple implementer agents simultaneously across non-overlapping files * Run a verification pass where the agent compared output against the Figma comp to catch mismatches * Dispatch the UI Designer specialist for a polish pass to fix issues the verifier flagged End result: a multi-page website that was ~95% faithful to the Figma comp in roughly 45 minutes. Designer then iterated on the last 5% using Intent.

Luke Wroblewski's profile picture
Luke Wroblewski7 months ago

video walkthrough for those who want more details on this setup and workflow:

Geoff Alday's profile picture
Geoff Alday7 months ago

Man, what a world we're living in now!

Luke Wroblewski's profile picture
Luke Wroblewski7 months ago

only gonna get wilder.

Luke Wroblewski's profile picture
Luke Wroblewski7 months ago

added Figma quick install to Intent to make this even easier.

Harsh's profile picture
Harsh7 months ago

man how many things do I have to learn now smh

Kyle Cooney's profile picture
Kyle Cooney7 months ago

I’m still not sure why Figma is necessary. Figma Config is going to be interesting this year.

Chicago Camps's profile picture
Chicago Camps7 months ago

Just skip Figma and save the subscription fee. Figma isn’t needed to get this work done.

Tonkur's profile picture
Tonkur7 months ago

I dont understand sir u created system and used it to build layot without software to create them ? So u skip figma and build html components? How do u build em for apps? U do it in rnative?

Dane Troup's profile picture
Dane Troup7 months ago

I’m designing in browser with local storage for synthetic data and full interactive simulation. Can use APIs if they’re ready. Allows me to experiment with production parity frontend code. Calling it “prototyping” but it’s very close to the real thing. Just no platform overhead

Morgan Izquierdo's profile picture
Morgan Izquierdo7 months ago

Great to have your take on the moment

Related Videos