Getting started with Figma: A beginner's guide

Figma is a really amazing design and prototyping tool that has exploded in popularity. If you are thinking about making the switch to it, or if you're looking to figure out how to use it, this tutorial is for you!

/// Timestamps

00:00 - Introduction
00:25 - What we are going to be building
02:06 - What is Figma?
03:03 - Starting a new project
03:33 - basic interface
04:12 - creating a frame (workspace/artboard)
05:45 - creating basic shapes
06:45 - color basics
08:16 - the text tool
12:30 - layer basics
14:07 - Zooming in and out and moving around the frame
16:57 - selecting, aligning, and locking items
20:22 - duplicating items
22:50 - stroke basics
23:47 - moving things perfectly straight
24:47 - more layer controls
26:59 - round corners
28:46 - grouping items, equal distribution, layer organization
31:45 - placing images
35:29 - the scale tool
37:15 - eye dropper and more on colors
38:04 - making the layout look better with everything we learned
--

Come hang out with other dev's in my Discord Community

---

Keep up to date with everything I'm up to

---

Help support my channel

---


---

I'm on some other places on the internet too!

If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.


---

And whatever you do, don't forget to keep on making your corner of the internet just a little bit more awesome!

[tilakmadichettitheappdeveloper]

Hey Kevin, I seriously think all of us in the community are quantum entangled becoz u know exactly what we want an when we want.

Thanks a LOT

[ionutcornea]

Me yesterday: "Hmmm, should I switch from Adobe XD to Figma? "

Kevin Powell 1 day later: "Getting started with Figma tutorial video, is live on YT"

[PaulSebastianM]

To select anything without having to click outside a frame to start, hold Alt and drag. That also shows total selection size and margins! Cmd also works similar except it selects each item you're touching individually, not just the groups. And it doesn't show margins. Also you can hold Alt and hover on items to see dimensions.

[sanghvian]

Literally downloaded Figma 2 days back. Kevin : "Gotta do it now". Thanks a lot man! Really looking forward to more of these in the future

[amber]

Canva and Figma have been life-changing for me. Canva I only use for template inspiration as some of them push me out of my comfort zone (in a good way) and Figma is where I replicate and personalise it.

I'd highly recommend Canva for beginners if you need inspiration as it's hard to think like a designer and to be bold with your designs. Most beginners (like me) are pretty nervous with scaling, colours and fonts, so Canva's templates and examples help with that and kick you up the ass where it's needed.

[crayolamanic]

So, I am in a design bootcamp right now and I have to say, whenever I don't really grasp a concept they present I can always count on your videos to speak to me in a language that demystifies the technobabble and clarifies what I'm trying to learn. I don't understand why things have to be over-worded/explained in such complex terms when your videos make it abundantly clear that just using the same language you speak in will do a better job conveying the material. Also, you make it super easy to follow what you're saying - EVEN when you switch topics quickly (which is pretty infrequent) it's still easy to track. I am just really thankful for your channel. Material is consistently presented in a down to earth, charming, "my friend is teaching me this" way that is so, so helpful and engaging. Thank you. <3

[pkn]

Great video.
To add something to the mix, I find very useful to use the mouswheel to zoom in/out or along a specific axis.
[Cmd/Ctrl + Mousewheel] Zoom in and out.
[mousewheel] Move along the vertical axis
[Shift + mousewheel] Move along the horizontal axis

[srijan]

Make it a series. Please. I so much want to enter designing. No one better to teach than you

[lewis]

This has been the best Figma tutorial for beginners. It actually shows you how to create something with the tools.

Other tutorials show you the tools but not what to do with them.

[hughclarke]

Kevin, you are a true gift, I truly appreciate your lessons. No joke man. Thank you.

[travezripley]

Thank you Uncle Kevin! I’ve been using xd and have been curious about FIGMA. You have been such a great help on our paths to glory!

[bibekdhkl]

Thank you so much Kevin, I had heard about you since my 2019 but didn't watch any video but now I did, and I say I truly underestimated your teaching skills. Kudos to you, I had wasted 3 years of my life, and am finally starting out. Thank you so much for putting out this video for free :)

[qjrenzt]

I just got a Sr Front End Dev job in which we have no in-house design team. I finally get to design! .. shit, how do you use Figma? But of course, Kevin has a tutorial for this! And he actually shows you how to start from actual 0 as opposed to copying a template first! Love it!

[alexahong]

you are by far the best teacher in figma ever. Thank you!

[ccc]

I can't thank you enough for this tutorial! I have been taking a course on Udemy on web design and while the course itself is good, it doesn't teach how to use Figma in a clear, step by step method like this video. You have saved me much frustration. Thanks again!

[federicobau]

Advice for the zoom and scrolling through the View(Windows): I use only keyboard and mouse wheel for any scroll direction.

Scroll Up and Down ( Y axis) : mouse wheel up, mouse wheel down (dah..)
Scroll Left and Right (X axis): Shift button + mouse wheel up / down
Zoom in and Zoom out (Z axis): Ctrl + mouse wheel up / down

[RodrigoDAgostino]

It's great to see you're supporting Figma, Kev! <3 It's an amazing tool that definitely deserves a deep dive in it :) It's a pity most people just go straight to Xd just because it's an Adobe product.

[ezimmer]

Hi Kevin, I'm Brazilian (I'm learning English) and I started now in the area of ​​Graphic Design, I searched for many videos to learn about Figma and yours is helping me a lot, thank you very much.

[wigzela]

First time trying out Figma and so much confidence gained from just one tutorial, this was amazing and you're an amazing teacher! Really enjoyed this one, looking forward to more Figma tips and tricks. Thank you very much Kevin Powell :)

[mufenliao]

hey Kevin. Thanks for the tutorials. I've been learning Figma for months but could only do basics and feeling hard to explore further. Your videos are the light in the dark. Very clear and informative, especially the pixel of the screen are clear to see all the tools you clicked on. So appreciated for the great jobs!