Тёмный

10 tips to work 10x faster in Figma 

Carola Pescio Canale
Подписаться 25 тыс.
Просмотров 407 тыс.
50% 1

I put together a short list of my favorite tips and shortcuts to speed up your workflow in Figma :) Let me know which one's your favorite!
==LINKS==
- Figma's video tutorial on autolayout: • Figma Tutorial: Auto L...
- My own figma template: www.figma.com/community/file/...
==FOLLOW ME==
Twitter: aloracpc
Instagram: designwithcarola
Tiktok: @designwithcarola
==TIMESTAMPS==
0:00 - Intro
1:40 - Tip #1 Duplicate
3:21 - Tip #2 Resize
5:14 - Tip #3 Resize Frames
6:20 - Tip #4 Copy Style
7:56 - Tip #5 Big nudge
9:59 - Tip #6 Hold layer position
12:38 - Tip #7 Layer up/down
13:37 - Tip #8 Rename/Bulk Rename
14:15 - Tip #9 Autolayout
16:22 - Tip #10 Templates
18:19 - What's your favorite?
==MY VIDEO GEAR==
Camera (Canon M50): amzn.to/359yW93
Lens (Sigma 18-35 f/1.8): amzn.to/34aNl5O
Mic (Blue Yeti USB): amzn.to/3m3G9P1
Key light: amzn.to/37lzkUW
Ring light: amzn.to/2T4CFiv
LED strip light: amzn.to/2Hb7dgk
Elgato Stream deck: amzn.to/2T63RO1
USB-C hub: amzn.to/37he6r6
Dummy battery adapter: amzn.to/37jWYB6

Опубликовано:

 

28 май 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 793   
@zerosandones7547
@zerosandones7547 3 года назад
Figma Tips Move: V ctrl = command alt = option 1. Duplicate - alt + drag - ctrl + D - if you keep pressing ctrl + D it will duplicate at the same distance as your first duplicate 2. Resize - alt + drag at the side for it(the selected item) to grow from the center - alt + shift to maintain proportion - press k (don't hold) to scale - if "k" is already active, hold alt to maintain proportion 3. Resize Frames - hold ctrl so the frame will not use the constraints 4. Copy Text Style - ctrl + alt + c (on the text with the text style you want to copy) then ctrl + alt + v (on the text that you want to be the same style as the copied text) 5. Big Nudge (nudge - move an element a little) - shift + arrow key(the desired direction) - change nudge number: - hamburger menu - preferences - nudge amount - 8 pixel nudge (you'll always be within the grid) [if you work on an 8 pixel grid] 6. Hold Position - Click element and hold spacebar - this makes the element be placed on top instead of being put to a group (if the element is initially outside) - if the element is initially inside - it will be placed in a group but will be sent to back (sort of) 7. Layer Up/Down (how to move things up and down) - ctrl + [ (move down one layer) - ctrl + ] (move up one layer) 8. Rename (layer) - ctrl + R - can rename multiple layers if multiple layers are selected 9. Auto Layout - you can think of it as grouping elements that are related - to add auto layout to an element: shift + A - the selected element will be placed inside a new frame [changing child element order in an auto layout frame] - select child element + press an arrow key to move its position to the desired direction - we can also drag the child element to reposition it - aligning elements - select frame (with auto layout) - use arrow keys to align the elements to the left, center, or right [text resizing / word wrap] - go to text panel - type details (in the meatball menu) - change "Resizing" to grow vertically - then specify a fixed width for the text element [adding an external element in the auto layout frame] - drag the element - if element is bigger than the frame: - hold ctrl key while dragging the element (a blue line will indicate where the object will be placed in the frame) - to prevent the frame from growing wider - go to auto layout panel - change the resizing behavior to "fixed width" [Auto layout frames can also be turned to components(components are frames)] (so we can copy/duplicate it) - select auto layout (final) frame then do alt + ctrl + K to make that frame as a component [Placing an auto layout frame in a new regular frame] (for scrolling purposes) - select the auto layout frame - ctrl + alt + G 10. Templates - create/use templates if you're designing something similar most of the time
@sivanya09
@sivanya09 Год назад
Awesome bro thank you so much
@pookiepats
@pookiepats Год назад
my man
@ob5804
@ob5804 8 месяцев назад
Thank You!)
@roberttumaini5348
@roberttumaini5348 3 года назад
The "K" thing just changed my life. I just realized if I was spending 20 times longer resizing each component.
@JoaoPaulo-vt8kz
@JoaoPaulo-vt8kz 3 года назад
I used to export in png and bring it beck so I could do it. But it was a really dirty way. The "K" thing definitively change my live as well.
@dhritimansen3111
@dhritimansen3111 3 года назад
hahahaha i swear
@kiranpatel4742
@kiranpatel4742 3 года назад
Yeah this actually saved me so much time that i waste resizing things
@TonyAdigwe
@TonyAdigwe 3 года назад
It literally just changed my life
@rdznm88
@rdznm88 2 года назад
does it work on windows ?
@adamgerber7824
@adamgerber7824 3 года назад
you look like a Pixar character. In a really good way. Like warm and good energy
@sasquelle
@sasquelle 3 года назад
i thought i was the only one who realised
@25maxman
@25maxman 3 года назад
I have never seen this channel and this was the first thing I noticed. Wild.
@PixieSpright
@PixieSpright 3 года назад
Totally.
@michaeloni8546
@michaeloni8546 3 года назад
Thank God I'm not alone 😹
@rodolforanchez8957
@rodolforanchez8957 3 года назад
She looks like Yennefer from the Witcher
@lucas.campora
@lucas.campora 3 года назад
Another tip: If you want to select the deepest element of a group, just hover the element and press cmd + click, and voilà! (This prevents you from perma double click group+group+group+...)
@shabbirabdulhussein8748
@shabbirabdulhussein8748 2 года назад
This is what I was looking for! Was surprisingly hard to find, thank you Lucas!
@astro_roman
@astro_roman 2 года назад
My life has split to before and after... You just saved me days of double clicking. THANK YOU!
@yenespace406
@yenespace406 2 года назад
thank you !
@motiv8world273
@motiv8world273 2 года назад
I would have subscribed to your channel for this
@klesus
@klesus 2 года назад
Expanding on this: cmd/ctrl + click selects the most deeply nested detail that you're hovering on. Cmd/ctrl + RIGHT click brings up a context menu with all layers that the mouse hovers over. It also allows you to select locked items from the canvas rather than the layers panel.
@frankvasquez4827
@frankvasquez4827 3 года назад
The space bar trick! Daaaaamnn, I've spent hours rearranging layers into the frames after moving them to create cool animations, and I didn't know this powerful trick. Awesome, you have a new follower from now on 😍
@KrystalElizabeth
@KrystalElizabeth 2 года назад
The "K" scale tool blew my mind. That would have saved me so much time on one of my assignments. Also, the holding "Command" while resizing a frame to disregard constraints was also super helpful. I would always have to add constraints to everything before moving which was a pain. Thanks so much for this!
@polarbear8188
@polarbear8188 2 года назад
but dont forget about decimal size if you are resizing multiple layer
@DesignerUp
@DesignerUp 3 года назад
Love watching you @Carola! This is one of the most entertaining, fun and useful videos I've seen in a while. Sharing with our design students and they are loving it! Hope to see more. 💜
@chaowang2019
@chaowang2019 3 года назад
thank you for the tuts. the 'K' and the 'space bar' just saved my life.
@tokunboomonubi4329
@tokunboomonubi4329 3 года назад
Your excitement is contagious :D
@sketchfields
@sketchfields 2 года назад
prove it :D
@jebwatson
@jebwatson 2 года назад
Copy style actually kind of blows my mind. I've gone years without that and I'm just so pleased to have it in my toolbox now.
@preshitrastogii
@preshitrastogii 3 года назад
that hold layer position tip! thank you soo much!
@emilyworkman
@emilyworkman 3 года назад
Girl, I've been looking for that resize advice for weeks!!!
@VectorRecite
@VectorRecite 3 года назад
That hold layer position and Zoom options are life savers 🔥🙏🏻 Thanks for those awesome tips 🎉🤩
@katherinegaspare1569
@katherinegaspare1569 3 года назад
favorite tip: the one with the spacebar, that will change my life
@odanabunaga2505
@odanabunaga2505 3 года назад
doesn't work on iMac :(
@kohila9723
@kohila9723 2 года назад
Figma ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE--gAW7H1q2n8.html
@Brian-ey4xt
@Brian-ey4xt 2 года назад
I recently (2 weeks ago) switched over to Figma from Sketch. I have found that autolayout is pretty powerful and something I want 95+% of the time I'm doing anything. The resizing sections of this video were helpful, thanks! Much of the other stuff is similar/identical to other tools, but still good to know. It's also good to know where the arrow sensitivity adjustment is. Again thanks!
@ricksegalCanada
@ricksegalCanada 2 года назад
Dropbox should immediately lock Carola into a ten-year contract. This is precisely the energy and passion every company needs. Outstanding.
@thaskeenmohammed9145
@thaskeenmohammed9145 3 года назад
Wow, this is great - The NUDGE is changed my life .... I was literally moving objects and text with one one pixel to match 8 grid... Thank you very much, Carola
@valen2663
@valen2663 3 года назад
Another very useful thing I would add is the swapping of elements by selecting two items and dragging one of the pink dots that show up in order to swap their positions between them. Great video, learned some eye opening stuff that I already started using today at work. Thank you!!
@strugglenjoyer
@strugglenjoyer 2 года назад
Thank you!
@chibuezeokoye3727
@chibuezeokoye3727 2 года назад
I've been looking for this k command all my life. Thanks Carola, you've earned a follower
@simon4512
@simon4512 3 года назад
The space bar thing 🥺🥺 I hate it so much when moving layers and they get grouped when I don't want them to, definitely going to change my life! Big ones to me are Shift + 0 (to see everything on the current page), Shift + 1 (to set the zoom at 100%) and Shift + 2 (to center the screen on the currently selected layer), never use them when I have a trackpad but always do when I'm with a mouse
@jms3942
@jms3942 Год назад
Shift 0 is 100%, shift 1 is to see everything. But very helpful! thanks
@surfthejungle
@surfthejungle 3 года назад
That frame expanding tip without moving around the contents. Life changing!! I love your channel and will watch more content now. I don't like web design or figma but I need to learn it to become a better freelancer and you make it really fun to learn. The figma videos on their site are so boring and with the new autolayout changes I haven't found any good tutorials and it's very different than how it was before. I bet you're a busy person but it would be awesome if you had more tutorials on these subjects. You are a great RU-vidr. 😁
@AmayuruLokugamage
@AmayuruLokugamage 3 года назад
I spent my whole day figuring out how to get rid of that constraints. You are like a lifesaver
@cxrlitosway
@cxrlitosway 2 года назад
Today is the 2nd day of teaching myself UX design. I have a graphic design background but want to transition to UX. Your video is SOO helpful, there are so many similarities with the shortcuts but you definitely taught me a lot. THANK YOU !!!!
@MahinurKhan9x
@MahinurKhan9x Год назад
Love it! Thanks Calora!
@andreachoo9446
@andreachoo9446 3 года назад
thank you so much for sharing!! that “k” tip is what i’ve needed in my life all this while
@elleryfamilia8291
@elleryfamilia8291 3 года назад
I'm brand new to figma and this video just changed my (figma) world. Thanks @Carola for putting this together. Now I need to go learn autolayout :)
@tianwang8849
@tianwang8849 2 года назад
Great video, love the energy and the happy mood! For tip 7, if you hold cmd & shift, you can move stuff directly to the bottommost or the topmost
@GoGlobalWorld
@GoGlobalWorld 2 года назад
Awesome tips! Thanks Carola!
@royaltomar9961
@royaltomar9961 3 года назад
Hold layer position changed my whole life. Thanks for this amazing video!
@jazilzaim
@jazilzaim 3 года назад
The keyboard shortcuts are the best part of Figma! Thanks for the awesome tips!
@36251571
@36251571 3 года назад
Love it! Thanks!
@CoreyStewart91
@CoreyStewart91 3 года назад
OMG the one about matching text styles
@safa90
@safa90 2 года назад
Thank you for the great tips and the template as well. Quite useful! And I love your energy, keep it up!
@jsotmont
@jsotmont 2 года назад
Love your energy, thank you for sharing this!
@TheLandoman
@TheLandoman 3 года назад
You are amazing! Thanks so much for these tricks. [hold layer position] is my new favorite move. 😀
@VectorRecite
@VectorRecite 3 года назад
Totally agree 🔥🔥
@luisfernandomontoya181
@luisfernandomontoya181 3 года назад
Hey, what a great tips and I love your energy. Regards from Colombia!
@mariahagsten4294
@mariahagsten4294 2 года назад
Great tutorial! This is such a gem. So many wow moments and I really like your cheerful presentation too. Keep up the awesome work 💪🔥
@itsbeatrizpinto
@itsbeatrizpinto Год назад
Hey, I just wanted to thank you because I've recently started working with Figma and your video really helped me🥺 I wish you all the best!
@GemmaHelyer
@GemmaHelyer 3 года назад
I love your style of videos, you're so easy to watch! also, these are some great tips! Thanks fo sharing
@toddwu4449
@toddwu4449 2 года назад
Love your vid! It's helpful ! Thank you!
@cyrilcyril5853
@cyrilcyril5853 3 года назад
The nudge amount set at 8px is a life changer! Thanks!
@daulatneupane4055
@daulatneupane4055 3 года назад
Really useful tips. Been working in figma since 2 years or so, some of these were a good find for me. That "K" was a keeper.
@user-rg9xc8qe3x
@user-rg9xc8qe3x 3 года назад
SPACE this is a miracle, that's what I've been waiting for a long time, thanks!
@lookintomyeyes2681
@lookintomyeyes2681 3 года назад
I love the energy in ur videos, :)
@noraeboesomi1527
@noraeboesomi1527 2 года назад
The frame increment without moving all the contents was my favorite tip. I always drag out all the contents, resize the frame then drag the contents back into the frame. Thank you so much for the tip.
@busayoak_
@busayoak_ Год назад
Same here! Number 2 was definitely life changing
@kethbruno
@kethbruno 2 года назад
love it! thanks for sharing this
@JohnCarter-qz5yy
@JohnCarter-qz5yy 3 года назад
Recently started learning Figma and haven't even finished the video yet, but I had to say that first tip about copying/duplicating was ALL I WAS LOOKING FOR!!! OMG!! THANK YOU! I LOVE YOU!!! :P
@eudaimonia01
@eudaimonia01 3 года назад
Omg I just love your energy
@luma.cabral
@luma.cabral 2 года назад
The space tip to put something above the frame changes my life! Your video was helpful, thanks a lot :)
@kensenberg7003
@kensenberg7003 3 года назад
Omg! You helped me know multiple things already. I just got started with Figma and I'm knowing more. You are a blessing love from Nigeria 🇳🇬 👐🏽 and guys the thing about her explanation is most of what is explaining might not be what you want be on the cause of explaining you'll definitely learn few key functions! My God. Figma is great!! And Miss Carola is awesome 😘😘
@paolacastro5610
@paolacastro5610 2 года назад
Thank you for sharing!
@PauloRicardo-bw5pi
@PauloRicardo-bw5pi 3 года назад
Congrants, Carola ! I loved the tips. Super useful.
@findelmundo5310
@findelmundo5310 3 года назад
Love it! You are the best❤️
@mehrasaph7151
@mehrasaph7151 3 года назад
I'm a junior Figma learner and it's brilliant thanks ! my fvorite tip is #7 Layer up/down
@nattapongkonglumtan5605
@nattapongkonglumtan5605 2 года назад
As an UX design beginner, all of your tips you shared is useful for me. THANKS.
@celineonwubiko3843
@celineonwubiko3843 2 года назад
I am an absolute novice in this field. Writing out the commands and keys as you clicked was really helpful. Thank you ❤️ ❤️
@rickmoranis420
@rickmoranis420 3 года назад
scale and spacebar tips are game changers. thank you for the tips!
@rmionex6435
@rmionex6435 3 года назад
I'm new to Figma (started three days ago) do this is really helpful to me! Thank you for the video! ☺️
@saroman_valar
@saroman_valar 2 года назад
thank you for the tips!
@anastassiavassiljeva5668
@anastassiavassiljeva5668 3 года назад
Thank you for your tips ❤️
@salahmouktadir839
@salahmouktadir839 2 года назад
That was really helpful! Thank you Carola
@saepuloh475
@saepuloh475 3 года назад
thanks Carol!
@funkymag
@funkymag 3 года назад
Great tips!!!
@MiguelFernando
@MiguelFernando 3 года назад
This was helpful - thanks!!
@mikemance8430
@mikemance8430 3 года назад
Great tips video - All of them are great!
@mama_tongs
@mama_tongs 3 года назад
You are so awesome!! Thank you so much for breaking this down. I adore your personality as well :)
@infinitedesigns_io
@infinitedesigns_io 2 года назад
Immediately subbed. Great tips and awesome vibes. Love it.
@Reeka7
@Reeka7 2 года назад
Super cool! Thanks :)
@allieronneberg8910
@allieronneberg8910 Год назад
Thank you so much for sharing these tips!!!
@Honeycute191
@Honeycute191 3 года назад
Yeayyy! Finally I found how to resize without mess the design 😂 thanks so much
@deatinyhart3106
@deatinyhart3106 Год назад
love watching your videos, thanks for your impact
@maracingolani4358
@maracingolani4358 3 года назад
K for resizing is the best!
@LucasSukeyosi
@LucasSukeyosi 2 года назад
Thanks for sharing, very useful!
@SammydeK
@SammydeK 3 года назад
Thank you!!! Really usefull
@nataliiavoitanovych457
@nataliiavoitanovych457 3 года назад
Thanks, Carola! that was super useful ❤️
@ihcot18
@ihcot18 2 года назад
simply awesome
@Vip_gaming9
@Vip_gaming9 3 года назад
Cool, love it.
@Shakeel714
@Shakeel714 2 года назад
Teaching with nice smiles throughout the tutorial. By the way almost all the tips you shared in this video were super useful. Thanks Carola.
@mangaladoranalli1495
@mangaladoranalli1495 Год назад
Great Tips! Thank you very much.
@thamindawonde
@thamindawonde 2 года назад
that scale tip for resizing was amazing, thank you so much!
@criselleong9470
@criselleong9470 3 года назад
"K" is so magical! Thanks for sharing!
@tamiresslelis
@tamiresslelis 3 года назад
Sooooooooooo great tips! Thank youuuuuu
@lebbadnazim7825
@lebbadnazim7825 3 года назад
Just amazing tips especially the spacebar ! thanks
@deciawong8017
@deciawong8017 2 года назад
Great tips! Thank you.🙂
@basmaesam4800
@basmaesam4800 Год назад
Great video, thank you for sharing
@jsonchicas
@jsonchicas 3 года назад
Thanks for the content :)
@Srishtisingh-tz4lj
@Srishtisingh-tz4lj 2 года назад
Really helpful. Thanks
@meteoricrahmani442
@meteoricrahmani442 3 года назад
THIS WAS AWESOME
@saurabhsharma6929
@saurabhsharma6929 3 года назад
Really helpful, thanks.
@usofmirmazloomi80
@usofmirmazloomi80 3 года назад
It was awesome. Thanks
@heitorlessa2715
@heitorlessa2715 3 года назад
#2 is such a life changer! Thank you ;)
@jeffreychiu7296
@jeffreychiu7296 2 года назад
Thank you for sharing this!! Super helpful 🙌🥰
3 года назад
This is super cute way of doing things in Figma. Thank you, I learned a bunch of new things.
@blkswan5528
@blkswan5528 3 года назад
Great tips. Thank you for sharing
@thom_cam
@thom_cam 2 года назад
LOOOOOVEEE THIS!
@renaisekim62
@renaisekim62 3 года назад
this is so insanely helpful ty!
@katherinechin8708
@katherinechin8708 3 года назад
Thank you so much this was super helpful!! :)
@keagandingshoff1633
@keagandingshoff1633 6 месяцев назад
The holding space bar to prevent objects from popping into frames / auto layouts was great to know. Thank you.
@iriyemel9837
@iriyemel9837 3 года назад
Thank you so much!
@cecibarth6455
@cecibarth6455 2 года назад
Love this Video, this was really helpful and you were so excited while you were explaining the Tipps. I love it! Hope you'll do more Videos like this.
Далее
Figma Auto Layout | Getting Started with Auto Layout
13:16
100❤️
00:19
Просмотров 26 млн
15 Figma Shortcuts You NEED To Know About
5:53
Просмотров 3,3 тыс.
How to Master Figma and Design 10X FASTER!
12:10
Просмотров 29 тыс.
14 Advanced Tips to Design FASTER in Figma
17:48
Просмотров 145 тыс.
Figma Advanced Tutorial: A 2-hour Masterclass
2:12:45
Просмотров 349 тыс.
6 UI Hacks I Wish I Knew As A Beginner
11:11
Просмотров 709 тыс.