6 Figma plugins every designer should know about

779b2ff17e19ae9d3dab7d0e9fccf9a7

How to make working in Figma even more convenient and efficient with the help of free add-ons? Pavlo Yarets, an expert at the Academy of design professions Pentaschool, tells the story.

The Pentaschool Academy continues the cycle of articles about the Figma editor. Previously, we got acquainted with the program and reviewed its interface.

In this material, we will talk about what plugins are and how they can be useful in work. And at the end – a nice bonus for those who want to master Figma at a level.

Plugin is an external module that can be connected to the program to expand its functionality. To search for a plugin, just open the project and click on the button Resources in the top panel.

Figma

To install a plugin, select the desired application in the search and click on the button Run. After that, you can use the plugin in all your projects.

If you don’t know which add-on you want to install, you can explore the directory in the Community section and go from there to the plugin description pages.

You can view the list of installed applications in the project menu.

Figma plugins

Note the small icon in the lower right corner next to the plug-in icon itself – it shows whether the add-on is universal for Figma Jam (the schematic editor) and the Figma editor itself (the icon that looks like an infinity symbol) or if it’s just for Figma (pen icon):

Plugins in the Figma Store

The number of plugins for Figma is constantly growing. Let’s consider those that will be useful to the designer to solve various tasks.

Unsplash

Ansplash plugin Screencast:

Access the resources of one of the most popular free streams directly from the Figma interface.

How it works:

Launch the plugin, enter a query in the search, select the desired image from the output. After clicking on the image, wait for it to be uploaded to the editor.

Unsplash Figma

Material Design Icons

Material Design IconsAn application that allows you to search for the desired icon from the Material set directly in Figma (all icon plugins work in the same way).

WARNING! This plugin is paid, but also has free functionality. If you work with the module constantly, it makes sense to pay it. And if you use it for solo projects, I recommend a life hack:

1. In Community, find the Material icon set and keep it open in a separate window.

2. Find the desired icon using the plugin.

3. Next, look for it in the icon file and copy it into the working document.

How it works:

Enter the desired icon in the search or select from the list. Click on it and wait for the image to appear in the document. Icons are immediately placed inside 24×24 px frames, which is especially convenient when developing mobile applications.

Fishtext in Ukrainian

Fishtext in Ukrainian

Screencast with description:

Description:

Plugin for generating Lorem Ipsum texts in Cyrillic. Creates abstract text (“fish”) for layouts. This helps you understand how text blocks will look with styles applied to them. Adobe products have been able to automatically generate texts for a long time, but Figma has this possibility recently thanks to this addition. If you need text in English, use the Lorem Ipsum plugin.

How it works:

  1. You install the plugin, run it.

  2. Select a text layer, a layer group, or an artboard that contains text layers.qrMujt7eIdBl jFq2L5dGxMl9L58z9L6i4cNuHafv6HMMhVWxjl5BZeUjQ0Vqk15BgZ4UwJuFm4jz3

  3. Check the line “Fill text layer” and indicate what exactly you want to generate (sentence, paragraph or heading). Next, select the amount of text and click the “Generate” button. After that, the plugin generates abstract text content.

Image Editor

Image EditorConvenient settings for photo effects. If you own Photoshop, you will perceive such plugins as child’s toys, but do not rush to conclusions – this module extends the features of Figma for editing raster images.

Vector Maps

Vector Maps FigmaScreencast with an example of work:

If you have had to spend hours searching for vector maps with region boundaries (for example, for infographics), then this plugin will be a real find for you.

How it works:

Select a region and click Add to add it to the list of regions. Then click on the button Get as layer and you get a frame with the necessary vector borders of the countries. The only downside of the plugin is that it hangs a lot during the generation process.

Map

Vector maps

Pixel Perfect

Pixel PerfectA plugin that will appeal to all supporters of the Pixel Perfect Precision approach (the standard in HTML layout, according to which the page must correspond to the design layout with an error of no more than 1-2 pixels). Helps to round fractional values ​​of objects and text fields.

How it works:

Select the desired objects and round their values ​​to the nearest integer with one button.

Pixel Perfect in Figma

Working with plugins is just one of the many possibilities open to Figma users. You can learn more about the functionality of the editor, learn to create prototypes of sites and programs from 0, collect a portfolio and get all the knowledge and skills necessary for work at the Figma course from the Pentaschool Academy of Design Professions.

Until September 30, a discount of 3,000 rubles is valid using the promo code “Community”

To learn more about the course and submit an application for training, click on the button below!

Read more

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *

© 2022 ZoNa365.ru - Theme by WPEnjoy · Powered by WordPress