Розповідаємо про плагіни для Figma, що автоматизують робочу рутину.
Команда Figma дуже дбайливо ставиться до свого дітища і прислухається до думки спільноти . Завдяки цьому в середині липня 2019 року було випущено бета-версія редактора з підтримкою плагінів. А вже на початку серпня презентували оновлену Figma з вбудованими плагінами. Будь-який розробник або дизайнер,що знає базовий HTML і JavaScript , міг подати заявку і взяти участь в їх розробці.
Загальні принципи:
- Модулі повинні бути простими і зрозумілими для будь-якого дизайнера.
- Якщо ви можете створити сайт, ви можете створити плагін.
- Люди повинні мати можливість створювати плагіни на популярних мовах програмування .
- Модулі не повинні завдавати шкоди продуктивності Figma.
- Figma повинна повністю підтримувати API, на які спираються плагіни.
У цій статті ми розберемо роботу декількох популярних і корисних плагінів, які суттєво спростять і автоматизують ваш процес проектування.
Де знаходяться плагіни
Відкрийте програму, авторизуйтесь під своїм Google-аккаунтом, перейдіть на головну сторінку редактора Figma. Зліва на панелі побачите пункт Plugins (він знаходиться відразу під Drafts ).
Натиснувши на Plugins , ви опинитеся на сторінці плагінів. Вони згруповані – рекомендовані, популярні і встановлені.
Також можна подивитися всі плагіни, які є на даний момент, якщо натиснути на кнопку Browse all plugins .
установка плагінів
Філософія FIgma – в простоті, тому установка плагінів проста і зрозуміла для будь-якого користувача.
Встановити плагіни можна двома способами:
- На сторінці всіх плагінів напроти потрібного натисніть на кнопку Install – він буде автоматично встановлений, стан кнопки зміниться на Installed , а плагін буде поміщений в список групи Installed .
- На окремій сторінці плагіна виберіть потрібний, перейдіть на нього і натисніть на кнопку Install для установки.
Установка плагіна відбувається миттєво. Ще одне натискання на кнопку інсталяції призводить до його деактивації.
На сторінці плагіна ви можете подивитися короткий опис і керівництво по використанню, ознайомитися з інформацією про автора і подивитися його контакти, там же знаходиться інформація з історії версій.
Огляд 15 плагінів для дизайнера
Я відібрав п’ятнадцять простих і функціональних плагінів, які будуть корисні більшості дизайнерів:
- Unsplash – для швидкого автозаповнення блоків фотографіями.
- Map Maker – додає карти.
- Charts – для візуалізації даних.
- Iconify – для іконок.
- Autoflow – візуалізує зв’язку між об’єктами.
- Content Reel – для наповнення макета сайту контентом.
- Blobs – робить симпатичні плями.
- Image tracer – вміє переводити растр в вектор.
- Figmotion – для анімації.
- Find and Replace – шукати і заміняти текст.
- Nisa Text Splitter – для роботи з таблицями та списками.
- Spellchecker – перевіряє граматику.
- Isometric – для швидкого створення ізометрії.
- Datavizer – вміє створювати графіки та гістограми.
- Icon Resizer – для швидкої зміни розмірів іконок.
Unsplash
Плагін для швидкого автозаповнення блоків фотографіями
Один з найпопулярніших і затребуваних плагінів в Figma: він в рази скорочує час роботи з контентом. Особливо корисний, коли потрібно швидко заповнити сайт і немає часу навіть на те, щоб перемикатися з вкладки на вкладку, шукати і зберігати зображення.
Давайте подивимося на його роботу. Виберіть плагін – натисніть правою кнопкою миші в будь-якому місці полотна. Виберіть пункт Plugins – Unsplash .
З’явиться вікно плагіна.
Виділіть всі картки на полотні і виберіть будь-яку тематику (у нас в прикладі портрети).
Перевага Unsplash в тому, що ви швидко зможете заповнити як завгодно велику кількість карток, слайдерів, фотографій до статей. При цьому залишається можливість детального пошуку підходящої фотографії.