Загрузка видео...

Не удалось загрузить видео

На главную

My workflow now: - Design the first path in Figma - Hook up Claude Code to Figma MCP - Prompt: "Build this with Tailwind + Shadcn" - Then generate design system docs + demo page Side note: So many cool products being built, but I'm irrationally happy about a...

designertom's profile picture

Tommy Geoco 🇺🇸

18,408 subscribers

59,278 просмотров • 8 месяцев назад •via X (Twitter)

Наука и технологии
LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 0

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

Похожие видео

Weekend learning - tried Cursor + Figma MCP that can turn design component in Figma into Tailwind and shadcn~30sec. still early stage, but so many fun! thx for sharing this Graham Lipsman 🙌
0:36

Weekend learning - tried Cursor + Figma MCP that can turn design component in Figma into Tailwind and shadcn~30sec. still early stage, but so many fun! thx for sharing this Graham Lipsman 🙌

Lichin Lin

18,392 просмотров • 1 год назад

This is how a top designer uses Figma MCP + Cursor to build an AI design system Designers working on design systems should copy this AI workflow to free up precious engineering bandwidth 👀 Watch the full video on Sneak Peek: Elad Mizrahi shows how monday.com design team uses Figma MCP + Cursor to build their design system 👇
2:57

This is how a top designer uses Figma MCP + Cursor to build an AI design system Designers working on design systems should copy this AI workflow to free up precious engineering bandwidth 👀 Watch the full video on Sneak Peek: Elad Mizrahi shows how monday.com design team uses Figma MCP + Cursor to build their design system 👇

Jayneil Dalal

89,213 просмотров • 4 месяцев назад

Claude Code + Figma MCP Is The Greatest AI Design System I've Ever Used!:
0:33

Claude Code + Figma MCP Is The Greatest AI Design System I've Ever Used!:

WorldofAI

51,959 просмотров • 3 месяцев назад

After testing every AI toolchain for a year, this is the only workflow I'm endorsing: Figma → Claude Code (Sonnet 4.5) Here's how I'm building Lorelight: 1. Design the happy path in Figma 2. Feed it to Claude Code via Figma MCP 3. Get a strong foundation in 15 minutes 4. Spend the next 50+ hours iterating (still design work) The design/dev loop that used to be isolated is finally closing. I even built a complete design system in within minutes. Custom components, living documentation, accessibility rules all from the Figma designs. If you're measuring the effectiveness of these tools by whether they can "one-shot" a design, you're consuming too many AI hype commercials. Log off. Then go actually build something with your hands. With AI. With your taste. Stop trying to "one-shot" good shit. And go make stuff with the new tools. For designers who want to ship real products, this is the stack that's getting it done.
2:00

After testing every AI toolchain for a year, this is the only workflow I'm endorsing: Figma → Claude Code (Sonnet 4.5) Here's how I'm building Lorelight: 1. Design the happy path in Figma 2. Feed it to Claude Code via Figma MCP 3. Get a strong foundation in 15 minutes 4. Spend the next 50+ hours iterating (still design work) The design/dev loop that used to be isolated is finally closing. I even built a complete design system in within minutes. Custom components, living documentation, accessibility rules all from the Figma designs. If you're measuring the effectiveness of these tools by whether they can "one-shot" a design, you're consuming too many AI hype commercials. Log off. Then go actually build something with your hands. With AI. With your taste. Stop trying to "one-shot" good shit. And go make stuff with the new tools. For designers who want to ship real products, this is the stack that's getting it done.

Tommy Geoco

22,905 просмотров • 8 месяцев назад

Figma just gave AI agents the canvas. Claude Code can now design directly in Figma via MCP + Skills👇
0:32

Figma just gave AI agents the canvas. Claude Code can now design directly in Figma via MCP + Skills👇

Min Choi

49,268 просмотров • 2 месяцев назад

Just updated talk to figma mcp open source Anthropic Claude Code can now talk to figma I can ask claude to review my design and annotate directly in design file Link below
1:02

Just updated talk to figma mcp open source Anthropic Claude Code can now talk to figma I can ask claude to review my design and annotate directly in design file Link below

Sonny

32,549 просмотров • 3 месяцев назад

A designer who can ship code is one of the most valuable hires in tech today. Here's my new episode with Felix Lee (CEO of ADPList) where he showed me how to use Claude Code and Figma MCP to go from: ✅ Figma → Code: Design to website in 15 min ✅ Code → Figma: App back to editable design Felix also demoed a few apps he's designed and built in Claude Code, including a 3D globe website and a landing page analyzer. Some takeaways from Felix: 1. Stop pasting screenshots into Claude Code. Instead, use Figma MCP to pull in all your assets, icons, and images automatically. 2. You can use the same MCP to convert code back into editable Figma layers to explore more variations. 3. An underrated way to build: Use FigJam to plan a flowchart of your app first, then paste the link into Claude Code with the MCP. 📌 Watch now: Thanks to our sponsors: Replit ⠕: Plan, design, and build with AI agents Linear: The AI agent platform for modern teams
0:48

A designer who can ship code is one of the most valuable hires in tech today. Here's my new episode with Felix Lee (CEO of ADPList) where he showed me how to use Claude Code and Figma MCP to go from: ✅ Figma → Code: Design to website in 15 min ✅ Code → Figma: App back to editable design Felix also demoed a few apps he's designed and built in Claude Code, including a 3D globe website and a landing page analyzer. Some takeaways from Felix: 1. Stop pasting screenshots into Claude Code. Instead, use Figma MCP to pull in all your assets, icons, and images automatically. 2. You can use the same MCP to convert code back into editable Figma layers to explore more variations. 3. An underrated way to build: Use FigJam to plan a flowchart of your app first, then paste the link into Claude Code with the MCP. 📌 Watch now: Thanks to our sponsors: Replit ⠕: Plan, design, and build with AI agents Linear: The AI agent platform for modern teams

Peter Yang

77,115 просмотров • 2 месяцев назад

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

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

Luke Wroblewski

31,352 просмотров • 3 месяцев назад

You can now push what you’re building in Claude Code directly into Figma. With the latest updates to the Figma MCP server, build a working prototype in code, then send it to a Figma canvas to explore multiple versions.
0:30

You can now push what you’re building in Claude Code directly into Figma. With the latest updates to the Figma MCP server, build a working prototype in code, then send it to a Figma canvas to explore multiple versions.

Claude

4,307,179 просмотров • 3 месяцев назад

Design System with AI Part 1: Talked about my agents, setting up the foundation: design tokens in Figma and exporting Local Variables to Claude with rules.
15:47

Design System with AI Part 1: Talked about my agents, setting up the foundation: design tokens in Figma and exporting Local Variables to Claude with rules.

Druids

19,324 просмотров • 1 месяц назад

Spent the day testing Claude Opus 4.7. Last month I built a design director agent for OpenClaw and now it cooks. 15 minutes in, Paper Design MCP + Claude Code had made me a rough draft. In under an hour, a Framer worthy site. My workflow: 1. Feed my agent references so it can extract design systems and lock in on my taste 2. Claude Code calls Paper Design MCP to generate the visual system (just keep the Paper app open) 3. Paper exports the assets and Claude Code then preps the build docs 4. Agent loops back, critiques, iterates Got no clue why anyone is paying $10K for a website anymore. It’s easy now.
4:19

Spent the day testing Claude Opus 4.7. Last month I built a design director agent for OpenClaw and now it cooks. 15 minutes in, Paper Design MCP + Claude Code had made me a rough draft. In under an hour, a Framer worthy site. My workflow: 1. Feed my agent references so it can extract design systems and lock in on my taste 2. Claude Code calls Paper Design MCP to generate the visual system (just keep the Paper app open) 3. Paper exports the assets and Claude Code then preps the build docs 4. Agent loops back, critiques, iterates Got no clue why anyone is paying $10K for a website anymore. It’s easy now.

klöss

14,508 просмотров • 1 месяц назад

At this point, I have become lazy af. Figma connected to Cursor via my MCP and Opus 4.6 is designing a dashboard using Shadcn design system which is in the team library. So you chat in cursor, get designs in figma. Everything is designed according to your design system. Is this the dream of a designer?
0:59

At this point, I have become lazy af. Figma connected to Cursor via my MCP and Opus 4.6 is designing a dashboard using Shadcn design system which is in the team library. So you chat in cursor, get designs in figma. Everything is designed according to your design system. Is this the dream of a designer?

AK

91,829 просмотров • 4 месяцев назад

This is how a top designer uses Figma variable modes to manage a design system for 50+ sports brands Designers should copy this workflow to scale their Figma design systems 👀 Watch the full video on Sneak Peek: Cornelius Hegeman shows how the Jump design team built a Figma design system to manage 50+ brands 👇
3:22

This is how a top designer uses Figma variable modes to manage a design system for 50+ sports brands Designers should copy this workflow to scale their Figma design systems 👀 Watch the full video on Sneak Peek: Cornelius Hegeman shows how the Jump design team built a Figma design system to manage 50+ brands 👇

Jayneil Dalal

29,057 просмотров • 3 месяцев назад

This Figma trick builds your design system docs in seconds
0:20

This Figma trick builds your design system docs in seconds

Jan Mraz

43,887 просмотров • 3 месяцев назад

This Figma plugin will save you 90% of the time needed to build a design system in Figma!
0:23

This Figma plugin will save you 90% of the time needed to build a design system in Figma!

Jan Mraz

24,110 просмотров • 1 год назад

figma "god mode" just leaked.. this week i tried the future of autonomous design: claude connected directly to the figma api with full edit access.. yes it can design in figma what does it mean? you prompt, it designs. it’s like having a team of designers inside figma working with you and 10x ing your capacity ​why is this different? ​official figma ai/mcp only "reads" files to help devs. this tool (unofficial MCP) "writes" in figma to replace manual labor. hours of grinding turned into seconds of waiting ​imagine this: - ​prompt to design: generate a new screen based on your design or not - prompt to flow: generate end to end user journeys - iteration: create multiple variations in one click - design system: it can use your components to create new screens - ​zero click management: auto layout, component creation, deduplication handled by prompt - ​universal control: if you can do it in figma, it can do it for you ​the impact ​if figma officially releases this, almost every existing plugin becomes obsolete overnight it feels like figma on steroids. i’m still processing whether i feel empowered or replaced ​full tutorial in this article from Mark A. Cianfrani. handle with care: ai will have access to everything in figma »
0:48

figma "god mode" just leaked.. this week i tried the future of autonomous design: claude connected directly to the figma api with full edit access.. yes it can design in figma what does it mean? you prompt, it designs. it’s like having a team of designers inside figma working with you and 10x ing your capacity ​why is this different? ​official figma ai/mcp only "reads" files to help devs. this tool (unofficial MCP) "writes" in figma to replace manual labor. hours of grinding turned into seconds of waiting ​imagine this: - ​prompt to design: generate a new screen based on your design or not - prompt to flow: generate end to end user journeys - iteration: create multiple variations in one click - design system: it can use your components to create new screens - ​zero click management: auto layout, component creation, deduplication handled by prompt - ​universal control: if you can do it in figma, it can do it for you ​the impact ​if figma officially releases this, almost every existing plugin becomes obsolete overnight it feels like figma on steroids. i’m still processing whether i feel empowered or replaced ​full tutorial in this article from Mark A. Cianfrani. handle with care: ai will have access to everything in figma »

Aurelien

78,856 просмотров • 4 месяцев назад

Turn design into code with Claude Code + Figma. Through MCP, Claude sees your mockup at the data level—component hierarchies, design tokens, auto-layout rules—and translates it into production-ready code.
0:33

Turn design into code with Claude Code + Figma. Through MCP, Claude sees your mockup at the data level—component hierarchies, design tokens, auto-layout rules—and translates it into production-ready code.

Claude

2,594,044 просмотров • 8 месяцев назад

To add onto my point. This website took ca 2 hours to design + build out with claude - and it has infinitely more opportunity (with my lacking knowledge) for growth and improvement. Built using shadcn + agentation + a bit of messing around in figma.
0:23

To add onto my point. This website took ca 2 hours to design + build out with claude - and it has infinitely more opportunity (with my lacking knowledge) for growth and improvement. Built using shadcn + agentation + a bit of messing around in figma.

kosta4a

23,323 просмотров • 2 месяцев назад

Watch this magic! Pasted a Figma design link into Claude. Asked for 3 new variations from QuiverAI. Got 3 fully editable vectors back in Figma 😱 Never left Claude once. I used the new Quiver MCP + Figma MCP.
1:01

Watch this magic! Pasted a Figma design link into Claude. Asked for 3 new variations from QuiverAI. Got 3 fully editable vectors back in Figma 😱 Never left Claude once. I used the new Quiver MCP + Figma MCP.

DANN©

66,422 просмотров • 6 дней назад

Figma Make, now on your local code In limited beta starting today, you can visually edit and ship changes by connecting Make to your codebase At Figma, we use our products to design in every way: design layers, prototypes, and now, production code
0:30

Figma Make, now on your local code In limited beta starting today, you can visually edit and ship changes by connecting Make to your codebase At Figma, we use our products to design in every way: design layers, prototypes, and now, production code

Figma

392,030 просмотров • 18 дней назад