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

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

На главную

Breaking down code layers

figma's profile picture

Figma

555,726 subscribers

47,223 просмотров • 1 год назад •via X (Twitter)

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

Anya Rossi• Live Now

Private livecam show

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

Фото профиля RIIC ≛
RIIC ≛1 год назад

I've been waiting for this for so long!

Фото профиля Coastal Themes
Coastal Themes1 год назад

There are so many interesting UX solutions here well done @figma team! Fantastic tutorial, maybe it's time we expand our Figma Sites tutorials too :)

Фото профиля Gamecooker
Gamecooker1 год назад

Nice work

Фото профиля Lorenzo Cabra
Lorenzo Cabra1 год назад

Fire ⚡️

Фото профиля Beavers Brothers
Beavers Brothers1 год назад

Very useful!

Фото профиля Himanshu Kumar
Himanshu Kumar1 год назад

Isn't abstraction the elegant opposite of breaking down?

Фото профиля Jordy
Jordy1 год назад

Loving this update! Keep up the good work. Love to use Sites already

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

Code layers (coming soon) demo with Niko → #Config2025
8:36

Code layers (coming soon) demo with Niko → #Config2025

Figma

14,425,472 просмотров • 1 год назад

Live from Config: Meet Code Layers, bringing the full power of code directly onto the Figma canvas
8:35

Live from Config: Meet Code Layers, bringing the full power of code directly onto the Figma canvas

Figma

92,675 просмотров • 28 дней назад

Introducing code layers in Figma Sites Add interactions and animations with code crafted by you or with help from Figma’s AI
0:31

Introducing code layers in Figma Sites Add interactions and animations with code crafted by you or with help from Figma’s AI

Figma

169,255 просмотров • 1 год назад

Copy code-backed screens → paste as design layers, now with variables → Copy your Make onto the canvas as design layers → Generate a design through the Figma MCP server → Capture your webpage as editable layers with the Chrome extension
4:05

Copy code-backed screens → paste as design layers, now with variables → Copy your Make onto the canvas as design layers → Generate a design through the Figma MCP server → Capture your webpage as editable layers with the Chrome extension

Figma

38,561 просмотров • 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

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

Guess the number of layers
1:04

Guess the number of layers

Figma

108,385 просмотров • 1 год назад

Share layers, not screenshots from Figma Make
0:35

Share layers, not screenshots from Figma Make

Figma

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

Tired: code or canvas Wired: code AND canvas Introducing Claude Code to Figma
3:19

Tired: code or canvas Wired: code AND canvas Introducing Claude Code to Figma

Figma

3,070,173 просмотров • 5 месяцев назад

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

No more slots gone wild → Set minimum and maximum layers → Only allow preferred instances → Display an empty slot by default → Set fill as default
0:41

No more slots gone wild → Set minimum and maximum layers → Only allow preferred instances → Display an empty slot by default → Set fill as default

Figma

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

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 лет назад

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

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

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

Releasing a few quality of life Figma Draw updates today → New brush & texture updates (gradients, eyedropper, and noise controls) → Dedicated text on a path tool (or drag on an empty canvas to create text on a circle) → Separate text and vector into independent layers Plus, we pulled a few features over from Design to make it easier to access → New layers panel icons → Auto layout directly in Draw
0:43

Releasing a few quality of life Figma Draw updates today → New brush & texture updates (gradients, eyedropper, and noise controls) → Dedicated text on a path tool (or drag on an empty canvas to create text on a circle) → Separate text and vector into independent layers Plus, we pulled a few features over from Design to make it easier to access → New layers panel icons → Auto layout directly in Draw

Figma

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

> 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

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

The Dev Mode MCP Server is now available in beta. Access Dev Mode data directly in your agentic coding workflow → VS Code with Copilot → Cursor → Windsurf → Claude Code
0:29

The Dev Mode MCP Server is now available in beta. Access Dev Mode data directly in your agentic coding workflow → VS Code with Copilot → Cursor → Windsurf → Claude Code

Figma

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

Mermaid code to FigJam diagram pipeline
1:46

Mermaid code to FigJam diagram pipeline

Figma

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

Try running plugin API code in the JavaScript console and see what happens
3:35

Try running plugin API code in the JavaScript console and see what happens

Figma

28,611 просмотров • 1 год назад

Introducing Codex to Figma: Roundtrip between code and canvas through the Figma MCP server
0:36

Introducing Codex to Figma: Roundtrip between code and canvas through the Figma MCP server

Figma

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

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