Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

Create an AI-Powered Prototype in Figma Make Full process from Design to Code

designcoursecom's profile picture

Gary Simon

48,181 subscribers

44,986 görüntüleme • 7 ay önce •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

Orijinal gönderinin yorumları burada görünecek

Benzer Videolar

Date of birth scrolling prototype in Figma (From design to prototype)
13:14

Date of birth scrolling prototype in Figma (From design to prototype)

Your Designer

52,179 görüntüleme • 2 yıl önce

This is how the Intercom design team uses AI to prototype directly in code Designers using AI tools should copy this AI workflow to ship faster 👀 Watch the full video on Sneak Peek: Domingo Widen shows how Intercom design team uses Figma Code Connect + Claude to design directly in code 👇
3:28

This is how the Intercom design team uses AI to prototype directly in code Designers using AI tools should copy this AI workflow to ship faster 👀 Watch the full video on Sneak Peek: Domingo Widen shows how Intercom design team uses Figma Code Connect + Claude to design directly in code 👇

Jayneil Dalal

54,117 görüntüleme • 4 ay önce

Designers, stop manually prototyping your Figma designs, instead turn your design into realistic prototypes with Figma Make. Here’s my step-by-step process: prepare your Figma design, select the screens and send it to Figma Make, enter a prompt to generate a prototype using the reference design, and in seconds you’ll get a realistic UI prototype that stays true to your original design. Bookmark it for later 💜
0:24

Designers, stop manually prototyping your Figma designs, instead turn your design into realistic prototypes with Figma Make. Here’s my step-by-step process: prepare your Figma design, select the screens and send it to Figma Make, enter a prompt to generate a prototype using the reference design, and in seconds you’ll get a realistic UI prototype that stays true to your original design. Bookmark it for later 💜

Abraham John 🦄🦓

29,851 görüntüleme • 4 ay önce

> Send code from Claude > Explore on the canvas > Prototype with AI > Work through feedback > Roundtrip back to code All in Figma
0:29

> Send code from Claude > Explore on the canvas > Prototype with AI > Work through feedback > Roundtrip back to code All in Figma

Figma

356,501 görüntüleme • 4 ay önce

This design manager vibe coded a Figma plugin with Claude Code in 40 mins to save $2000 per project Every designer should take an inspiration from this and leverage AI to automate boring parts of their design work 👀 Watch the full interview on Sneak Peek: Hammed shows how the Jump design team uses Claude to create custom Figma plugins 👇
1:33

This design manager vibe coded a Figma plugin with Claude Code in 40 mins to save $2000 per project Every designer should take an inspiration from this and leverage AI to automate boring parts of their design work 👀 Watch the full interview on Sneak Peek: Hammed shows how the Jump design team uses Claude to create custom Figma plugins 👇

Jayneil Dalal

65,907 görüntüleme • 8 ay önce

Here is a complete guide to the vibe coding process we're using to redesign Google AI Studio ✨ Below is practical advice you can apply to your own projects: - Create a vibe coded prototype that feels polished - Migrate from Figma to code - Adding animations Full episode 👇
0:50

Here is a complete guide to the vibe coding process we're using to redesign Google AI Studio ✨ Below is practical advice you can apply to your own projects: - Create a vibe coded prototype that feels polished - Migrate from Figma to code - Adding animations Full episode 👇

Ammaar Reshi

167,251 görüntüleme • 9 ay önce

Website for an AI-powered fin-tech startup. Copy, Design, Development. Deliverables: Figma, Framer
0:23

Website for an AI-powered fin-tech startup. Copy, Design, Development. Deliverables: Figma, Framer

Namya @ Supafast

19,520 görüntüleme • 2 yıl önce

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

396,584 görüntüleme • 1 ay önce

Don’t name your layers. Let Figma AI do that AND → Make your first draft with Make Design → Find the exact visual you’re looking for (or something similar) with Visual/Asset Search → Turn your designs into a working prototype with Make Prototype #Config2024
0:58

Don’t name your layers. Let Figma AI do that AND → Make your first draft with Make Design → Find the exact visual you’re looking for (or something similar) with Visual/Asset Search → Turn your designs into a working prototype with Make Prototype #Config2024

Figma

812,614 görüntüleme • 2 yıl önce

Designers, do you know that you can now turn your Figma design into an interactive prototype 10x faster without prototyping manually. Figma Make is a new AI-powered prompt-to-app tool that transforms designs and ideas into clickable prototypes in minutes. It’s made for designers, builders, and non-technical founders who want to move fast. Bookmark it for later 💜
1:17

Designers, do you know that you can now turn your Figma design into an interactive prototype 10x faster without prototyping manually. Figma Make is a new AI-powered prompt-to-app tool that transforms designs and ideas into clickable prototypes in minutes. It’s made for designers, builders, and non-technical founders who want to move fast. Bookmark it for later 💜

Abraham John 🦄🦓

145,429 görüntüleme • 7 ay önce

re-introducing ion design (YC W24) we turn designers into design engineers without them learning how to code ⚡ it’s an AI app builder that turns Figma into code - generate, iterate, and ship in seconds. let's make 2025 the year of the design engineer, together 🧵
2:07

re-introducing ion design (YC W24) we turn designers into design engineers without them learning how to code ⚡ it’s an AI app builder that turns Figma into code - generate, iterate, and ship in seconds. let's make 2025 the year of the design engineer, together 🧵

Samraaj Bath ⚡️

29,930 görüntüleme • 1 yıl önce

There’s no way you caught everything. Here’s what we launched at #Config2024 → UI3, a redesigned Figma → Figma AI (Make Design, Make Prototype, Visual Search, Replace Content, Rename Layers) → Figma Slides → Dev Mode updates (Ready for Dev View, Focus View, More Statuses) → Code Connect is out of beta (!!) → Auto Layout improvements → Responsive Prototyping Viewer → FigJam Pages
1:20

There’s no way you caught everything. Here’s what we launched at #Config2024 → UI3, a redesigned Figma → Figma AI (Make Design, Make Prototype, Visual Search, Replace Content, Rename Layers) → Figma Slides → Dev Mode updates (Ready for Dev View, Focus View, More Statuses) → Code Connect is out of beta (!!) → Auto Layout improvements → Responsive Prototyping Viewer → FigJam Pages

Figma

997,351 görüntüleme • 2 yıl önce

Introducing connectors, our new MCP client in Figma Make → Connect external tools to create prototypes with full context → Update your connected docs or create tasks directly from Make
0:40

Introducing connectors, our new MCP client in Figma Make → Connect external tools to create prototypes with full context → Update your connected docs or create tasks directly from Make

Figma

181,388 görüntüleme • 7 ay önce

Verification Code Prototype, Made in Figma 😵‍💫
0:24

Verification Code Prototype, Made in Figma 😵‍💫

Shater Tsavsar ⚡︎

26,312 görüntüleme • 1 yıl önce

Now that AI has enabled designers to code, is "design in code" a thing? Can we drop Figma altogether? 👇
5:08

Now that AI has enabled designers to code, is "design in code" a thing? Can we drop Figma altogether? 👇

Gary Simon

28,036 görüntüleme • 9 ay önce

I'm totally rethinking how I prototype with AI after seeing how Atlassian's design system team does it their approach to "templates" and "recipes" in Figma Make is pretty genius 👇
1:22

I'm totally rethinking how I prototype with AI after seeing how Atlassian's design system team does it their approach to "templates" and "recipes" in Figma Make is pretty genius 👇

Ridd 🤿

85,805 görüntüleme • 6 ay önce

Make Kits, rolling out today → Build and teach Make your design system → Ground your prototype in your project work with Make attachments
0:59

Make Kits, rolling out today → Build and teach Make your design system → Ground your prototype in your project work with Make attachments

Figma

134,868 görüntüleme • 3 ay önce

Code → design → code Generate design files from code, collaborate in @Figma, and implement updates all within Codex without breaking your flow.
0:20

Code → design → code Generate design files from code, collaborate in @Figma, and implement updates all within Codex without breaking your flow.

OpenAI Developers

241,331 görüntüleme • 4 ay önce

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 görüntüleme • 3 ay önce

Customize Dev Mode to how you work. Five plugins to try: Design 🤝 Dev → Atlassian Jira Code Generation → Bernardo Ferrari Figma to Code → Anima Design Systems → Tokens Studio → Figma Code Snippet Editor More in the thread.
0:20

Customize Dev Mode to how you work. Five plugins to try: Design 🤝 Dev → Atlassian Jira Code Generation → Bernardo Ferrari Figma to Code → Anima Design Systems → Tokens Studio → Figma Code Snippet Editor More in the thread.

Figma

47,489 görüntüleme • 2 yıl önce