Advanced Figma Tips & Tricks 2024: Discovering Little Hidden Gems

preview_player
Показать описание

Want to stay up to date on new developments, tips and tricks? Make sure to follow me!
And don't forget to subscribe right here on Youtube for more!

As usual, Figma did not fail to impress and come out with some fantastic new features and hidden gems hiding in plain sight. So here are my top Tips & Tricks to make life with Figma even more fun!

00:22 - Open Dev Mode Directly in VS Code
00:37 - Shift+D to Toggle Dev Mode
00:46 - Toggle Auto Layout ‘Auto’ with Cmd + X
01:13 - Variable Scoping in Bulk
01:30 - Quickly Create Variables with Shift + Enter
01:47 - Alias Variables
02:01 - Styles to Variables Converter quickly convert styles to variables
02:50 - Boolean Variables Magic with Modes
03:39 - Variant and Props Playground
04:00 - Press R to Reset Prototypes
04:09 - Shift + Space for In-File Preview
04:16 - Applying Min and Max to Parent Frames
04:36 - Hold and Slide to Lock All Layers
04:47 - Alt + L to Collapse All, Enter to Select Children
05:01 - Multiple Grids within a Single Grid Style
05:19 - Prototyping Flow Links for Overview
05:39 - Presentations with Scrollable Prototypes
06:06 - Set Rules for Slot Components with Preferred Values
06:25 - Cmd + Y to Clean Up
06:37 - Copy as PNG Without Exporting
07:03 - Use % for Line-Height
07:32 - Variables or Styles Cheatsheet
08:20 - More Tips and Tricks
Рекомендации по теме
Комментарии
Автор

This women has the most amazing tutorial voice I've ever heard, and speaks with such clarity that you would think it was AI

MrConway
Автор

The crazy thing is, I could watch and especially listen to your tutorials all day. And your progression is impressive!
One point about Auto Layout and "Space between" I have to activate the menu first and then use "cmd x". Otherwise I cut out my object, right? I use the "double-click"

mischugo
Автор

Thanks for sharing all the tips and tricks. Some of them I knew before, but some were new to me.

md.shakil
Автор

The boolean mode trick has phenomenal implications on responsive layouts if the modes are freed up for width. Really great tip.

platinumdynamite
Автор

Hello, I have a question -> Is there a trick or workaround for wrapped text? Text-over-flow? Example. I have a card with an image and a text block to the right of it. The text in the text block is clearly higher than the image. I would like the text to flow into a new “row” from the bottom edge of the image. This then runs across the entire width.
I hope you understand what I mean

mischugo
Автор

Great quick-fire tips for advanced users. And the voice is seductive 😆

OneHundy
Автор

0:58 is not necessary CMD+X, just click in the auto layout box and press X, it does the same.

diogofigueiraa
Автор

doesn't work for windows, commnd + y/x (ctrl can't do it🥺)

darialysak
Автор

can't find component details in view

alfagomy
Автор

ok, panic mode, I knew only about half of them

saroman_valar
Автор

Thanks! This is very help. Saved me so much research time!

kyu