Главная   /   Блог   /   Дизайн   /  

20+ инструментов и плагинов для Figma, необходимых дизайнеру

20+ инструментов и плагинов для Figma, необходимых дизайнеру

Figma (Фигма) — это отличный и довольно популярный инструмент для дизайна интерфейсов. Еще одна причина, почему Figma так популярна — это огромное комьюнити, обеспечивающее непрерывный поток отличных ресурсов, необходимых для дизайна: шаблоны, иконки, инструменты и плагины, которые делают ваш рабочий процесс быстрее и проще.

У Фигмы есть ряд преимуществ по сравнению с Adobe XD или Sketch. Во-первых, Фигма — это кроссбраузерный инструмент для разработки интерфейса, который работает на любой платформе и ОС, обеспечивая идеальную площадку для совместной работы в режиме реального времени с другими дизайнерами и членами команды.

Фигма дает возможность не только вести совместную работу, создавать интерактивные прототипы, экспортировать код, графику и полные макеты, но и с помощью плагинов Figma есть возможность еще больше расширять свои функции.

Новые инструменты постоянно загружаются в Figma Community. Чтобы сэкономить ваше время, мы подобрали самые лучшие плагины, которые помогут вам улучшить работу над дизайном того или иного интерфейса.

Чтобы установить плагин Figma, просто просмотрите широкий список доступных плагинов на странице Community, нажмите "Установить"/"Install", чтобы добавить плагин в свой аккаунт. 

1. ANIMA

анима.png

Создавайте высокоточные прототипы в Sketch, Adobe XD и Figma и экспортируйте в HTML и CSS одним кликом.


2. FRAMER

фрамер.png

Фреймворк JavaScript, с помощью которого вы можете легко импортировать файлы Figma и создавать прототипы с фильтрами и 3D-эффектами.

3. CHART

чарт.png

Создавайте полезные диаграммы, используя реальные или случайные данные, копируя и вставляя файлы из редакторов (Excel, Numbers и Google Таблиц). Диаграмма поддерживает удаленные файлы JSON (REST API), локальные файлы CSV и JSON.

4. MOTION

моушн.png

Инструмент анимации, который поможет вам воплотить ваши идеи в жизнь. Взаимодействуйте с пользовательским интерфейсом, анимируйте элементы, персонажей и многое другое.

5. OMNICHART

омничарт.png

Отличный инструмент для создания настраиваемых блок-схем (флоучарты). Каждый элемент можно настраивать отдельно, редактировать и переставлять по своему усмотрению.

6. BRAVO

браво.png

Превратите свой прототип дизайна Figma в настоящее мобильное приложение для iOS и Android. Кодировать не нужно.

7. BLUSH

блашер.png

Создавайте и настраивайте готовые иллюстрации внутри своего дизайн-проекта Figma.

8. LOTTIE FILES

лотти.png


Огромная библиотека с анимацией (более 1000 файлов). Захватите мышью элемент, перетащите его в свой проект и используйте как анимацию в формате SVG. 

9. DYNAMIC DATA

динамикдата.png

Связывайте файлы с данными (например, Excel) к открытым проектам в Figma, позволяя автоматически импортировать данные в файл Figma и подготавливать столько информации, сколько необходимо.

10. BERAKPOINTS

брейкпоинтс.png

Предварительно просматривайте макеты дизайна внутри Figma (Android, iOS / iPadOS).

11. HTML<>FIGMA

хтмлфигма.png


Легко конвертируйте проекты Figma в HTML, CSS, React Vue и другое.

12. COLOR PALETTES

колорпалет.png

Найдите код любого цвета, номер палитры и примените его к своему дизайну.

13. BANNERIFY

баннерфлай.png

Для тех, кто устал вручную кодировать баннеры, этот плагин позволяет экспортировать готовые анимированные баннеры из Figma в HTML, GIF и видео.

14. CODA

кода.png

Создавайте дизайн с данными из документов и приложений, таких как Spotify, Wikipedia, Intercom и прочее. Создайте таблицу в Coda, соедините свой дизайн с таблицей и наблюдайте, как он заполняется реальными данными.

15. FIGMOJI

фигмоджи.png

Хотите использовать смайлики в своих проектах? Сделайте свой выбор из библиотеки, и Figmoji добавит svg-файлы смайлов в ваш дизайн.

16. FIGMOTION

фигмоушн.png

Выведите свою анимацию на новый уровень. Этот инструмент построен прямо в Figma, поэтому вы сэкономите много времени, не используя отдельные программы для анимации.

17. VECTARY 3D

вектари3д.png

Вставляйте свои 2D-проекты прямо в Figma в виде 3D-макетов или других 3D-дизайнов одним щелчком мыши.

18. VIEWPORTS

вьюпортс.png

Самые популярные размеры дисплеев в одном плагине прямо в Figma. Выбирайте из множества размеров дисплея и применяйте их к фреймам.

19. RESPONSIFY

респонсифай.png

Быстро протестируйте свои проекты на устройствах разных размеров.

20. LO-FI WIREFRAME KIT

лофикит.png

Содержит более 100 полезных компонентов схемы сайта, включая кнопки, текстовые поля, вкладки, изображения и прочего, что позволяет очень быстро улучшить ваш дизайн.

21. ARTBOARD STUDIO MOCKUPS

артборждстудио.png

Получите доступ к тысячам реалистичных макетов продуктов прямо в Figma, что значительно улучшит презентацию ваших проектов.

22. AUTO LAYOUT

автолейаут.png

Применяйте популярные формы дизайна. Все выбранные объекты можно растягивать, что позволяет экономить время при изменении размера макетов.

Блог разработчика