Figma: From Beginner to Pro
By: Salman Khan
Tags: Figma Plugin, Figma, Design Tools, Figma Tutorial, Figmatips

Hey, so you’ve decided to give figma a try or maybe you’re already started using it but are confused. Don’t worry, this is the perfect guide for beginners which helps you getting started with figma easily.

What is Figma?

There are many out there who still don’t know what is figma. So for those I did some research and found out this definition.

Figma is an interface design application that runs in the browser — but it’s actually much more than that. I would go so far as to say it’s probably the best application for team-based collaborative design projects Source

If you are still confused, watch this video.

Sounds Interesting

So, if the definition, or video sounds interesting to you, you’re going to love this article.

Please make sure you read the full article and follow all the steps to the get the best out of it.

Is It Free?

Yup, and Nope!

See Figma is almost free for everyone, like you get all the basic features (like prototyping, unlimited files in drafts, unlimited viewers and commenters, and unlimited cloud storage) and some advanced features like (30-day version history, 1 team project) for free.

But If you move one step further, you’ll have to pay $12 per editor/month to access some of the premium features like (Unlimited projects, Unlimited version history, Custom file/user permissions, Invite-only private projects, Shareable team libraries).

Which One Is Best For Me?

It’s very simple, first start with the free plan. Then switch to the premium one if needed.

Haha! It’s not that simple. See, as long as you are working alone on your personal projects or even on clients work (without collaboration), the free plan is perfect. But if your work includes a lot of collaboration, then the free plan is not enough.

You can compare all plans and their features here.

You can get the paid plan of figma for free, but this is only valid for students and educators. You can apply for this discount here.

Getting Started

So now that you have figured out whether figma is good for you or not. Please make sure you try out figma yourself before making any decision.

Getting started with figma is pretty simple, create an account on figma and you are good to go. Learning figma is also not very difficult, you get pretty much all the tools you already used. Figma also made a YouTube playlist especially for beginners, you can view the playlist here.

The Practice

Now that you’ve know what is figma, how it works and have tried yourself. It’s time to get our hands dirty and start using it for our main work.

I recommend you to recreate some your previous work in Figma to get a better understanding of the software.

Figma also has some really cool and advanced features, like Auto Layout and Components (more on that later) which really makes your work a whole lot better. Plus, all of our work is stored in the cloud so we don’t have to worry about managing our files.

Plugins

Figma has a cool community tab where you can find great plugins which enhances your workflow. There are a lot of great plugins out there you can install directly on your account.

As I mentioned before, everything is happening on cloud so you don’t have to download anything and it syncs across all your devices.

You can browse the plugins from the community section.

Community

Figma has a great feature which really makes it stand out from it’s competitors. It’s the Community Tab.

You can find and use thousands of files uploaded by designers from all around the world. Ranging from Icons and UI Kits to Illustrations, you can find everything on the Community Tab.

Self-promotion 😊: I also upload my design files every month on Figma Community, you can access my page here.

Advanced Features

After knowing this much about figma, you’re ready to move on to some advanced things.

Autolayout

Let’s start with autolayout, Auto layout is a property you can add to frames and components. It lets you create designs that grow to fill or shrink to fit, and reflow as their contents change.

Some Resources For Getting Started with Autolayout:

Guide to Autolayout in Figma An amazing guide by figma itself made for beginners. The YouTube Video An amazing video by Jesse Showalter, one of my favorite YouTubers explaining Autolayout in a very simple way.

Components

Components are elements you can reuse across your designs. They help to create and manage consistent designs across projects. You can create components from any layers or objects you’ve designed. These could be a whole range of things like buttons, icons, layouts, and more.

Some Resources For Getting Started with Components:

Guide to Components in Figma An amazing guide by figma itself made for beginners. The YouTube Playlist I’ve created this playlist on YouTube which contains all the videos you need to getting started with components.

Other Features

There are some other cool features I really want you to know about.

Styles — We can use styles to define the color, text and any effects applied to objects; or to define the structure and appearance of layout grids. We can create styles for paints and colors, text and more. You can find more about styles here. Smart Animate — It’s one of the best prototyping features of Figma. You can select Smart Animate from the list of transitions, when building a prototype. You can find out more about Smart Animate here. More Features — The truth is Figma has tons of amazing here. So instead of making this article really long, what I did is I created a playlist on YouTube which contains all of it’s features explained in briefly and up to the point by Figma itself. You can access that playlist here.

FigJam

Figma also recently launched FigJam. It’s an online whiteboard where you can brainstorm, and ideate together with your teams. FigJam and Figma live side-by-side, so all design work, from ideation to execution, can be found in one place. It has some amazing features like emojis, and stamping which makes it really fun to use.

You can learn more about figjam here.

Resources and Closing Note

Thanks for reading this article till the end. It means a lot to me and I really wanna thank you from the bottom of my heart. I hope you find this article helpful.

Resources

Figma has it’s own YouTube Channel where you find amazing videos created by their team members. Some of them are really long and informative.

There are other youtuber’s who create amazing tutorials around figma. Some of my favorite are Jesse Showalter, Design Xtream, Carola Pescio Canale, and Pablo Stanley.

Thanks ❤

Once again, thanks a lot for sticking with me till the end. I am writing an another article related to Figma which I am going to upload soon. So make sure you follow me if you don’t want to miss that.

Thanks, Bye Bye!