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

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

На главную

Do more with Dev Mode. This new plugin allows you to write and generate dynamic code snippets for your design system. Code Snippet Editor →

figma's profile picture

Figma

558,778 subscribers

141,230 просмотров • 2 лет назад •via X (Twitter)

Наука и технологииОбразование
LIVE

Anya Rossi• Live Now

Private livecam show

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

Фото профиля Hannah Leopold
Hannah Leopold2 лет назад

@josejimmy8055 This is game changing! As a company wide design system team dev, having code snippets would increase my productivity by at least 50%!

Фото профиля MrCalm
MrCalm2 лет назад

Damn, this is massive!

Фото профиля Sandun Karunasingha
Sandun Karunasingha2 лет назад

WOW. This is massive. Thanks team.

Фото профиля MUHAMMED SHAFIHUL HADI
MUHAMMED SHAFIHUL HADI2 лет назад

Wow

Фото профиля Lewis Healey
Lewis Healey2 лет назад

Yes!!!

Фото профиля biscoteira do lastfm
biscoteira do lastfm2 лет назад

@hugobranco

Фото профиля Pocket Sized Baddie 🇵🇸
Pocket Sized Baddie 🇵🇸2 лет назад

Share this design file with us too pls 🫠

Фото профиля Kyle E
Kyle E2 лет назад

Ahhh yes love this, will try it out but my hope would be that when generating code for entire page it would inject the snippets created/modified for it’s underlying components? 🙏🏼

Фото профиля honkmonk
honkmonk2 лет назад

This page is down ..

Фото профиля Figma
Figma2 лет назад

Everything seems to be working on our end. Let us know if you continue to have issues.

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

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 просмотров • 2 лет назад

#Config2023 Launch 1: Dev Mode A new space in Figma for developers with features that help translate design into code, faster. Read more: Here are all the ways you can use Dev Mode 👇
0:43

#Config2023 Launch 1: Dev Mode A new space in Figma for developers with features that help translate design into code, faster. Read more: Here are all the ways you can use Dev Mode 👇

Figma

617,318 просмотров • 3 лет назад

Coming next week: New features in Dev Mode to bring design + dev closer. Annotations (!!), improvements to diffing, plugins, and the VS Code extension. What's shipping January 31 as Dev Mode moves out of free beta →
1:03

Coming next week: New features in Dev Mode to bring design + dev closer. Annotations (!!), improvements to diffing, plugins, and the VS Code extension. What's shipping January 31 as Dev Mode moves out of free beta →

Figma

789,302 просмотров • 2 лет назад

Introducing CodeRabbit Plugin for Claude Code! The CodeRabbit plugin for Claude Code creates an autonomous AI development workflow, helping you write and fix code without manual intervention. Type /coderabbit:review (or just say “review my code”) to get AI-powered fixes directly in your dev flow! Try it today, it’s free!
1:59

Introducing CodeRabbit Plugin for Claude Code! The CodeRabbit plugin for Claude Code creates an autonomous AI development workflow, helping you write and fix code without manual intervention. Type /coderabbit:review (or just say “review my code”) to get AI-powered fixes directly in your dev flow! Try it today, it’s free!

CodeRabbit

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

Published a plugin! It allows you to copy CSS variables from Figma in either design or dev mode 🧑‍💻
1:01

Published a plugin! It allows you to copy CSS variables from Figma in either design or dev mode 🧑‍💻

luis.

12,061 просмотров • 1 год назад

New in Dev Mode: → Ready for Dev View: see all designs marked ready for development in a single, organized space → Focus View: annotate and inspect with just your chosen design in focus → More Statuses: track what's ready for dev, changes made, and completed designs #Config2024
0:44

New in Dev Mode: → Ready for Dev View: see all designs marked ready for development in a single, organized space → Focus View: annotate and inspect with just your chosen design in focus → More Statuses: track what's ready for dev, changes made, and completed designs #Config2024

Figma

57,503 просмотров • 2 лет назад

New in Dev Mode: → Editable text in measurements: describe design details with more than just numbers
0:23

New in Dev Mode: → Editable text in measurements: describe design details with more than just numbers

Figma

62,841 просмотров • 1 год назад

This plugin can generate textures for your Unreal Engine scene! Comfy Textures is an Unreal Engine plugin which integrates the editor with ComfyUI. It allows you to quickly create and refine textures for your scene using generative diffusion models.
0:34

This plugin can generate textures for your Unreal Engine scene! Comfy Textures is an Unreal Engine plugin which integrates the editor with ComfyUI. It allows you to quickly create and refine textures for your scene using generative diffusion models.

Dreaming Tulpa 🥓👑

32,769 просмотров • 2 лет назад

Dev Mode: → Interactive Inspection (Dev Mode) → Annotations (MCP server) → Local Images (MCP server) → Design system rules (MCP server)
0:28

Dev Mode: → Interactive Inspection (Dev Mode) → Annotations (MCP server) → Local Images (MCP server) → Design system rules (MCP server)

Figma

98,858 просмотров • 10 месяцев назад

Design Mode for Cursor Introducing a new way to design right where you code.
0:59

Design Mode for Cursor Introducing a new way to design right where you code.

Tom Krcha

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

More ways to animate with LottieFiles: - Auto-layout - Nested Frames - Multi-variant Components - Gradients - Handoff features like animation URLs and embed codes for Dev Mode Download the plugin and play →
1:20

More ways to animate with LottieFiles: - Auto-layout - Nested Frames - Multi-variant Components - Gradients - Handoff features like animation URLs and embed codes for Dev Mode Download the plugin and play →

Figma

124,351 просмотров • 2 лет назад

What if you could generate all your colors, typography styles, sizes, radii, and more as variables and tokens with just one click? No manual setup, in few minutes go from blank page to a solid design system foundation. With option to present everything nicely for dev doc and more. With this Figma plugin, it’s actually that simple. ✨
1:46

What if you could generate all your colors, typography styles, sizes, radii, and more as variables and tokens with just one click? No manual setup, in few minutes go from blank page to a solid design system foundation. With option to present everything nicely for dev doc and more. With this Figma plugin, it’s actually that simple. ✨

vijay verma

26,190 просмотров • 5 месяцев назад

Today we’re launching an experimental @Figma plugin that will convert your design into runnable code. Generate a Repl directly from Figma, and instantly share a static React app with your team. Then, use Replit AI to add functionality and get your code production-ready.
0:45

Today we’re launching an experimental @Figma plugin that will convert your design into runnable code. Generate a Repl directly from Figma, and instantly share a static React app with your team. Then, use Replit AI to add functionality and get your code production-ready.

Replit ⠕

524,418 просмотров • 2 лет назад

Need a little help building your islands? The Epic Developer Assistant Beta is here to lend a hand! This new AI-powered assistant helps you write Verse code for your UEFN projects, provides answers, workflow guidance, code snippets, and more. Check it out now on the Epic Developer Community:
1:00

Need a little help building your islands? The Epic Developer Assistant Beta is here to lend a hand! This new AI-powered assistant helps you write Verse code for your UEFN projects, provides answers, workflow guidance, code snippets, and more. Check it out now on the Epic Developer Community:

Fortnite Developers

118,161 просмотров • 1 год назад

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,223 просмотров • 3 месяцев назад

GitHub Copilot can review your code and generate tests for you in VS Code, and you can customize how it does this magic with targeted Custom Instructions...
0:55

GitHub Copilot can review your code and generate tests for you in VS Code, and you can customize how it does this magic with targeted Custom Instructions...

Visual Studio Code

82,442 просмотров • 1 год назад

Attachment issues (resolved) You can attach 30+ file types (docs, data, media, and code) directly in Make, so you can move beyond placeholders and design with real inputs from code to canvas.
0:31

Attachment issues (resolved) You can attach 30+ file types (docs, data, media, and code) directly in Make, so you can move beyond placeholders and design with real inputs from code to canvas.

Figma

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

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,239 просмотров • 2 лет назад

Curious about design systems but don't know where to start? Whether you're about to build your first design system or just curious about them, our new 4- part course, "Introduction to Design Systems," will provide guidance, real-world applications, and tools to help you make the most informed decisions. - Understand what a design system is - Discover what goes into a design system and explore foundational concepts - Learn which Figma features help manage design systems - Explore the importance of documentation and how to maintain, improve, and advocate for your design system. Learn more:
0:59

Curious about design systems but don't know where to start? Whether you're about to build your first design system or just curious about them, our new 4- part course, "Introduction to Design Systems," will provide guidance, real-world applications, and tools to help you make the most informed decisions. - Understand what a design system is - Discover what goes into a design system and explore foundational concepts - Learn which Figma features help manage design systems - Explore the importance of documentation and how to maintain, improve, and advocate for your design system. Learn more:

Figma

550,976 просмотров • 3 лет назад

designing my new personal site with Pencil.dev connected it to Claude Code and turned on "Swarm Mode" and watched agents design my site in real-time, with their cursors actually moving and operating the screen, not just cosmetically! instead of the agents producing a raw HTML file, they generate something called .pen which is just a json file describing all layouts, components, and design. this means that it's easier than ever to have teams collaborate on design exactly as they do on source code (designers and engineers can now speak the same language!) once you are happy with a screen, you can open a new chat and reference .pen frame and start to generate the code (in React/ Next/ Tailwind etc), and run it on your dev server, producing a live website that visually matches your design
0:31

designing my new personal site with Pencil.dev connected it to Claude Code and turned on "Swarm Mode" and watched agents design my site in real-time, with their cursors actually moving and operating the screen, not just cosmetically! instead of the agents producing a raw HTML file, they generate something called .pen which is just a json file describing all layouts, components, and design. this means that it's easier than ever to have teams collaborate on design exactly as they do on source code (designers and engineers can now speak the same language!) once you are happy with a screen, you can open a new chat and reference .pen frame and start to generate the code (in React/ Next/ Tailwind etc), and run it on your dev server, producing a live website that visually matches your design

Sandra

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