6 плагинов Figma, о которых нужно знать каждому дизайнеру
Академия Pentaschool продолжает серию статей о Figma. Ранее мы познакомились с программой и рассмотрели ее интерфейс.
В этом материале мы поговорим о том, что такое плагины и как они могут быть полезны. И наконец — приятный бонус для тех, кто хочет изучить Figma на продвинутом уровне.
Плагин — это внешний модуль, который может быть подключен к приложению для расширения его функциональности. Чтобы найти плагин, просто откройте проект и нажмите кнопку Resources в верхней панели.
Чтобы установить плагин, выберите нужный плагин в окне поиска и нажмите кнопку Запустить. После этого вы сможете использовать плагин во всех своих проектах.
Если вы еще не знаете, какой плагин хотите установить, вы можете изучить каталог в разделе Сообщество и перейти оттуда на страницы описания плагинов.
Список установленных плагинов можно увидеть в меню проекта.
Обратите внимание на маленький значок в правом нижнем углу рядом с иконкой самого плагина — это показывает, является ли плагин универсальным для Figma Jam (редактор диаграмм) и самого редактора Figma (значок, похожий на символ бесконечности), или же он только для Figma (значок с пером):
Количество плагинов для Figma постоянно растет. Давайте рассмотрим те из них, которые пригодятся дизайнеру для решения различных задач.
Лучшие плагины для Фигма (Figma)
Unsplash
Скринкаст: https://www.loom.com/share/5f02d6292ec6466299f412df1de0e906
Получите доступ к ресурсам одного из самых популярных бесплатных журналов прямо из интерфейса Figma.
Как это работает:
Запустите плагин, введите поисковый запрос и выберите нужное изображение из выданного результата. Нажмите на изображение, чтобы загрузить его в редактор.
Material Design Icons
Расширение, позволяющее искать нужную вам иконку из Material непосредственно в Figma (все плагины иконок работают одинаково).
ПРИМЕЧАНИЕ: этот плагин является платным, но имеет бесплатную функциональность. Если вы работаете с плагином регулярно, имеет смысл заплатить за него. А если вы используете его для сольных проектов, я рекомендую tiphack:
1. в разделе Community найдите набор значков Material и сохраните его открытым в отдельном окне.
2. используйте плагин, чтобы найти нужную иконку.
3. затем найдите его в файле иконок и скопируйте в рабочий документ.
Как это работает:
Введите нужный значок в поле поиска или выберите его из списка. Нажмите на него и подождите, пока изображение появится в документе. Иконки мгновенно помещаются в рамки размером 24×24 px, что особенно полезно при создании мобильных приложений.
Fishtext in Russian
Описание:
Плагин для генерации текстов Lorem Ipsum на кириллице. Создает абстрактный текст («рыба») для макетов. Это помогает понять, как будут выглядеть блоки текста с примененными к ним стилями оформления. Продукты Adobe уже давно умеют автоматически генерировать текст, но Figma добавила эту функцию относительно недавно. Если вам нужен текст на английском языке, используйте плагин Lorem Ipsum.
Как это работает:
Урок №6. Плагины Figma | Уроки Figma с нуля «Umapalata» 2022
Вы устанавливаете плагин, запускаете его.
Выбирается текстовый слой, группа слоев или массив, содержащий текстовые слои.
Image Editor
Удобные расширенные настройки для создания фотоэффектов. Если у вас есть Photoshop, вы воспримете эти плагины как детские игрушки, но не спешите с выводами — этот модуль расширяет функции Figma для редактирования растровых изображений.
Vector Maps
Скринкаст с рабочим примером: https://www.loom.com/share/add9b736c17b49d1939bdec000d2e6eb
Если вы когда-нибудь тратили часы на поиск векторных карт с границами регионов (например, для инфографики), этот плагин станет для вас настоящей находкой.
Как это работает:
Выберите область и нажмите кнопку Добавить, чтобы добавить ее в список областей. Затем нажмите Получить как слой, и вы получите рамку с необходимыми векторными границами. Единственный недостаток плагина — он часто зависает во время генерации.
Pixel Perfect
Плагин, который понравится всем приверженцам подхода Pixel Perfect Precision (стандарт в создании HTML, согласно которому страница должна соответствовать дизайн-макету с погрешностью не более 1-2 пикселей). Он помогает округлить дробные значения объектов и текстовых полей.
Как это работает:
Выберите нужные объекты и округлите их значения до ближайшего целого числа одним нажатием кнопки.
Работа с плагинами — это лишь одна из многих возможностей, открытых для пользователей Figma. Изучить больше функций редактора, научиться создавать прототипы веб-сайтов и приложений, создать портфолио и получить все знания и навыки, необходимые для работы, вы можете на курсе Figma от Pentaschool Design Professional Academy.
До 30 сентября действует скидка 3000 рублей по промокоду «Комьюнити»
Чтобы узнать больше о курсе и зарегистрироваться на обучение, нажмите на кнопку ниже!
