Knowing your tools is essential, especially when working with Figma.
It will save you time, and time dear apprentice, is a precious resource. That’s why saving time is something we enjoy inside Figma’s world so here is a Quick Guide to Figma Tools.
Frame Tool
The Frame Tool will define the space you’ll use to create your product inside the canvas. It can be the size you want, and you can nest frames inside. Click on the Frame Tool or simply use the shortcut F or A.
Shape Tools
Once you have your frame defined, next thing you’ll find is the Shape Tools. You can access it by clicking on the toolbar. You will use these shapes to create basically everything about your project with the basic shapes available that include – Rectangle, Line, Arrow, Ellipse Polygon, and Star. Here are the shortcuts to some of them:
In the Properties Panel you can start playing with the shapes you draw in your canvas by changing the color, resizing, or editing images. Let’s decompose some of them.
Resize
Take one of the shapes or layers and select it. Once you do this, you can drag the corner and change the size. Holding Shift will allow you to maintain the aspect ratio if you want to resize the whole scale of the shape or layer. You can also go directly to the Properties Panel and change the Width (W) and Height (H) values to what you need.
Adding Color
From the Properties Panel, go to the option Fill. There are several things you can do from here, including changing the opacity value, directly selecting the color you want with the Eyedropper Tool, or being even more specific and adding the HEX code to get the color you want.
Editing images
If you import an image just go again to the option Fill and the dropdown will show you that it is possible to change the image settings - Exposure, Contrast, Saturation, Temperature, Tint, Highlights, and shadows.
These are the basic features you need to know. There are more tools and options but we will explore those later on.
For now, have fun using Figma.
