Learn Figma in 30 Minutes

In this Figma beginner tutorial, learn the user interface of Figma; the tools you need to know to start designing and prototyping UI/UX designs. Follow along and design a website with a login/signup form interaction.

Everything you need in one video! Enjoy this Figma 2022 crash course video!

Sign up for Figma:

0:00​ Intro
0:28 Figma UI
1:43 Milanote
2:25 Figma UI
4:49 Navigate Figma
6:12 Frames
7:25 Layout Grids
8:08 Creating a login form
15:48 Constraints
16:57 Components
18:40 Continue designing a website
20:54 Auto Layout
24:58 Prototyping 101
26:57 Advanced Prototyping
29:43 Outro
-

Become a Member (Access to Completed Project Files):

Sign up for Webflow:

My Desk Setup for Design & YouTube:

Learn UI/UX Design and Prototyping using Adobe XD:
-

Visit my website:

Find me on Instagram:
-

Disclaimer: This video and description may contain affiliate links. By using any of my affiliate links, I receive a very small commission at no extra cost to you. Thank you for supporting the channel!

Music: Epidemic Sound
Learn Figma in 30 Minutes
#Figma #FigmaTutorial #CalerEdwards

[SponkADonk]

Don't often comment but this was really, REALLY helpful for my very first introduction to anything like this before. Thanks so much!

[nysunra]

This was so fast I had to slow it down and watch it again … a little overwhelming and rushed but slowed down and with pauses it’s very informative. Thank you .

[rishabhrules]

Hey! finally Caler you started uploading figma tutorials super happy about that, Please continue this series & please please make more videos on Figma auto layout.

[dariogrijalba]

Thank you so so much for your tutorial! You made it so simple, so clear and easy to follow! I really appreciate your great job!

[BenStickland-vhvd]

Brilliant intro - great 30 mins, worth your time if, like me, you're a newbie

[nefertitimontoya]

I have pretty extensive adobe practice but I'm learning figma now and there were several times where I audibly said WOW during the tutorial!!! Very well done, thanks so much :)

[tonywyatt]

Excellent tutorial for beginners of Figma. Now need to apply my Adobe mindset to the new terminology of frames, prototypes etc..Thanks.

[TyomaTorbin]

Best no BS, staight forward 30 minutes absolutely useful information about how to use the tool. Learned a lot very fast! Thanks m8!

[Javrien]

used this to make a dashboard in my internship, very good site!

[MalikDixon]

It is about time that you did something in Figma. More Please.

[ToluFunnel]

Wow. This was so filled with information. A good use of my time

[sauravbanerjee]

As a beginner this was the best starting & introduction video for me. Please continue this series. As I have just completed the chapter 1. Can't wait for the chapter 2. even though this video was just 30 minutes. it doesn't felt like it very slow or fast at any moment. Awesome Video.

[markomiladinovic]

Thanks for the great course! I am new to Figma and this video was very instructive and useful!

[robinclason]

This has been SO helpful and FUN! My one concern is you jump from the "BUILDING YOUR DREAM HOME" TO "TOUR YOUR DREAM HOME" etc etc without explanation... Im worried Im missing a step! Also Im not sure how you ordered the "MacBook Pro 16" button below the others for visibility etc. Anyway, Im on min 17 so hopefully I can complete it and it wont matter haha. Thank you for creating this! Love the aesthetic

[preveshnaidu]

This was short and super awesome! great video

[hamcker-farsi]

That was really useful, thanks. I just learned it in 20 mins.

[indigo]

thank you so much
made my day for sure

[lisapaul]

From a new logo to switching to Figma! Woohoo 🥳

[kissiejrmusic]

This rules. Thank you. Best tutorial I've seen in ages.

[clemtw]

Thank you so much for this tutorial.

A quick question I have about the animation is, for the START section, the background image is seemed as a full image. But during the image insertion, we actually set it within a cropped space. Does this mean we have to make a slight change to that cropped space to a full width in order for the START section to look the way it is? Thanks.