Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

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

31,518 Aufrufe • vor 7 Monaten •via X (Twitter)

11 Kommentare

Profilbild von Luke Wroblewski
Luke Wroblewskivor 7 Monaten

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.

Profilbild von Luke Wroblewski
Luke Wroblewskivor 7 Monaten

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

Profilbild von Geoff Alday
Geoff Aldayvor 7 Monaten

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

Profilbild von Luke Wroblewski
Luke Wroblewskivor 7 Monaten

only gonna get wilder.

Profilbild von Luke Wroblewski
Luke Wroblewskivor 7 Monaten

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

Profilbild von Harsh
Harshvor 7 Monaten

man how many things do I have to learn now smh

Profilbild von Kyle Cooney
Kyle Cooneyvor 7 Monaten

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

Profilbild von Chicago Camps
Chicago Campsvor 7 Monaten

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

Profilbild von Tonkur
Tonkurvor 7 Monaten

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?

Profilbild von Dane Troup
Dane Troupvor 7 Monaten

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

Profilbild von Morgan Izquierdo
Morgan Izquierdovor 7 Monaten

Great to have your take on the moment

Ähnliche Videos