9 плагінів Figma, які полегшать життя будь-якого дизайнера
З невеликим запізненням публікую добірку плагінів, без яких ви більше не зможете уявити свою роботу в Figma. Принаймні я точно! Підготував для вас не тільки статтю, а й відео, тому для тих, хто любить подивитися - милості прошу до мене в ютубчик :)
Це моя перша стаття на vc.ru, тому трохи розповім про себе:
Мене звуть Олексій, я UX/UI дизайнер зі стажем понад 4 роки. Зараз трохи більше року працюю у супер ламповій студії інтерфейсів UXART. До цього тихо та мирно фрілансил:)
Назва статті говорить сама за себе. Приємного читання!
1. Brandfetch
Ви знаєте ситуацію, коли замовник надає список сайтів-партнерів, а логотипи доводиться шукати самостійно? Цей плагін позбавить нас від рутинного «гуглежа» та копання в «коді сторінки», щоб дістати Logo.png або Logo.svg
Достатньо просто ввести домен сайту, щоб у документ підвантажилися потрібні логотипи.
Мінуси особисто для мене
- Працює не з усіма сайтами;
- Не вміє показувати сайти з пошукової видачі, як це роблять Google Документи (приклад у відео).
2. Chart та Charts
Погодьтеся, що не завжди хочеться малювати графіки та діаграми на етапі проектування. Що лукавити, не завжди хочеться або час не завжди дозволяє розробляти їх і на дизайні. Тому доводиться «красти» їх з інших проектів або взагалі вставляти «нагуглені» скріншоти.
Плагіни Chart та Charts генерують відмінні діаграми за заданими значеннями
3. Figmoji
Перспективний, але поки що марний для мене плагін. Періодично в роботі я використовую емоджі: десь блок повідомлень із смайликам, десь вони взагалі є основою фірмового стилю.
У пошуку смайликів допомагає emojipedia. Сподівався, що плагін замінить цей ресурс, але розробники не додали найпопулярніший набір від Apple. Просто взяли та не додали. Благо, незабаром обіцяють виправити свій недогляд :)
Ну а поки що задовольняємося «класним» набором від Твіттера.
4. Figmotion
Любите презентувати клієнту мікроанімашки, приклади анімації та загалом роботу сайту? Цей плагін дозволить «не ходити» в інші додатки та працювати прямо у Фігмі. Здорово ж?
5. Iconify
Нарешті можна зручно додавати іконки.
Раніше я використав flaticon та власні набори іконок на окремому артборді та вони кочували від одного проекту до іншого. Проблема цього в його обмеженості — іконки є не всім випадків життя.
З цим плагіном можна забути про дефіцит та довгий пошук іконок. Всі вони векторні, класні та на будь-який смак та колір. Я задоволений
6. Map Maker
Назва плагіна говорить сама за себе. Тепер нам не доведеться заходити до браузера, щоб згенерувати карту.
У цьому плагіні є і Google Maps і Mapbox і різні налаштування:
- Зміна масштабу;
- Встановлення/видалення мітки;
- Вибір типу картки (супутник, гібрид, схема).
Загалом, все, що потрібно для зручної генерації карт.
До речі, напишіть вашу думку з приводу того, що у аналогічного Mapsicle за відсутності гугла у 8 разів більше завантажень. Я не розумію.
7. QR code generator
Знову плагін, назва якого говорить сама за себе. З цим плагіном (як і з багатьма іншими) більше не потрібно використовувати сторонні послуги.
QR code generator "у прямому ефірі" генерує будь-яку фразу у вигляді QR коду.
8. Table Generator
Плагін, який навряд чи допоможе на дизайні, тому що дизайн таблиць є окремим видом мистецтва, але точно заощадить час на проектуванні.
Відкрили плагін → Задали параметри → Бінго!
Особливо тішить те, що якщо не задати значення осередкам, вони відразу з'являються з текстовим шаром. Лайк!
9. Unsplash
«Вишенька на торті» у нашій добірці. За цей плагін я любив скетч і ненавидів фігму.
За допомогою нього ми можемо «оживити» макет значно швидше. Тепер не доведеться відкривати браузер, заходити на сайт, авторизуватись, копіювати/завантажувати.
Все це замінюють 2 кліки - відкрити плагін → Сгенерувати картинку. Так само просто, як 2х2.
Діліться в коментарях, якими плагінами користуєтеся ви, які можете порадити на додаток до цієї збірки.
Усім – світ, а за зручними інтерфейсами – у UXART.
Figmotion – найпримітивніші можливості анімування. Приниплу та іншим інструментам це конкурент.
Brandfetch - пропонує логотипи тільки великих компаній (типу дрібббла і беханса, що ще потрібно дизайнерам те), які нікому особливо не потрібні. Маіл.ру взагалі не дав. Яндекс якийсь лівий.
Є цікавий плагін Polyglot. Для перекладу текстів різними мовами. Теж поки що косично працює.
Content Reel вставляє заготовки текстів у вигляді імен, адрес, телефонів та іншого. Гарна штука. Незабаром мають додати фотки людей.
Майже всі замилування плагінами притягнуті за вуха. Вони всі сирі, косячі та з примітивним функціоналом. Поява плагінів – це круто, згоден. Сам користуюся Фігмою та задоволений. Але очевидно, що над цими плагінами ще працюватимуть і працюватимуть.
Дякую за відповідь, Олександре!
Теж спочатку зацікавив Content Reel, але для мене він марний, бо 90% наших замовників — російськомовні.
Сирі, косячі — можливо. Але точно не все і не завжди так буде. Щодня додають нові, а старі допилюються.
Для бета версії дуже непоганий результат за кількістю плагінів в цілому і якості окремих екземплярів.
7 плагінів у Фігмі для генерації фігур, візерунків та шумів
Ми зробили добірку 7 плагінів у Фігмі, які ми вважаємо корисними для креативної та швидкої роботи. Ці плагіни допоможуть вам створювати різноманітні графічні ефекти, генерувати унікальні артворки, працювати з шумами, текстурами, візерунками, хвилями, кривими та іншими елементами дизайну.
Плагін для Figma: Noise & Texture
Відкриває нашу вибірку плагінів у Фігмі – Noise & Texture. Він дозволяє динамічно генерувати безшовні шуми, текстури, візерунки, градієнти та багато іншого. Ви можете вибрати шар та додати до нього шум або текстуру. Ви також можете змінювати налаштування та спостерігати, як ваші шари оновлюються в реальному часі. Плагін підтримує різні типи шумів, такі як перлин, симплекс, вороний та інші. Також можна налаштувати параметри кольору, розміру, змішування, гладкості, фактора та інші.
склад: Алгоритм, який використовує фрагментні шейдери для генерації різних ефектів шуму, таких як перлин, симплекс, вороний, мармур та інші.
Складність: Легкий. Інтуїтивно зрозумілий інтерфейс легко розібратися змінюючи параметри.
Умови: Плагін безкоштовний. Дозволено використовувати в особистих чи комерційних цілях.
Плагін у Figma: To Path
Цей плагін для Figma дозволяє копіювати фігури або текст уздовж будь-якого шляху, як-от коло або крива.Ви можете редагувати вихідну фігуру або текст, а також бачити всі зміни, поки плагін відкритий. Також у процесі використання плагіна ви можете в реальному часі коригувати кривизну шляху. Цей плагін Фігма ідеальний для точного вирівнювання елементів уздовж складних траєкторій. Він підходить для створення унікальних шрифтів, логотипів та декоративних елементів. To Path – незамінний інструмент надасть оригінальності вашим проектам.
Автор: last night
склад: Алгоритм, який обчислює оптимальну відстань та кут між клонами, а також застосовує необхідні перетворення, щоб вони відповідали шляху.
Складність: Легкий. Інтуїтивно зрозумілий інтерфейс легко розібратися змінюючи параметри.
Умови: Плагін безкоштовний. Дозволено використовувати в особистих чи комерційних цілях.
Плагін у Фігма: Wave & Сurve
Це простий, але досить функціональний плагін для Figma. Він дозволяє легко створювати різноманітні хвилі та цікаві візерунки. Функціонал дозволяє вибрати один із чотирьох режимів кривих: з двома контрольними точками (кубічна крива), з однією контрольною точкою (квадратична крива), дугова крива або квадратна крива. Також можна вибрати напрямок хвиль і налаштувати різні параметри: висота, ширина, відступ та дистанція. Його до речі можна добре поєднувати з плагіном To Path.
Автор: Andreslav Kozlov
склад: Алгоритм, який генерує хвилі та криві за допомогою математичних формул
Складність: Легкий. Інтуїтивно зрозумілий інтерфейс легко розібратися змінюючи параметри.
Умови: Плагін безкоштовний. Дозволено використовувати в особистих чи комерційних цілях.
Плагін у Фігмі: Generator
Generator – це один із найпотужніших плагінів у Фігмі. Цей плагін дозволяє за допомогою вузлів (англ. node) дозволяє генерувати дизайн та візуалізувати дані. За допомогою цього плагіна ви можете швидко створювати різноманітні візерунки, графіки, анімації та інші види цифрової творчості прямо на полотні Figma. Ви можете налаштувати різні параметри, такі як колір, форма, розмір, поворот, шум та багато іншого, щоб досягти дивовижних результатів. Також можна з'єднувати змінні Figma в потужні графіки з чітким оглядом потоку даних. Всі створені об'єкти є елементами Figma, що повністю редагуються, які можна використовувати у своїх проектах або експортувати в інші формати.»
склад: Робочий простір з 117 вузлів, включаючи 8 вузлів Flow, 15 вузлів Data, 8 вузлів Sets, 35 вузлів Shapes, 12 вузлів Colors, 17 вузлів Numbers, 22 вузла Text.
Складність: Складний. Потребує розуміння та вивчення нід (вузлів).
Умови: Плагін безкоштовний. Дозволено використовувати в особистих чи комерційних цілях. Основні функції Generator доступні безкоштовно. Функції Pro доступні виключно передплатникам за 25 $ на місяць.
Плагін для Фігми: Ruri – Artwork Generator
Цей плагін для Figma, який дозволяє вам одним кліком генерувати необмежену кількість редагованих артворків. Можете використовувати визначені форми або власні, а також налаштовувати кожен аспект форми - розмір, співвідношення, положення, колір, режим накладання і багато іншого. Цей плагін допоможе вам відкривати нові творчі напрямки та розширювати вашу візуальну бібліотеку бренду. Потужний інструмент для генеративного дизайну.
склад: Алгоритм, який випадково застосовує різні параметри до кожної фігури, такі як розмір, співвідношення, положення, колір, режим накладання та інші
Складність: Середній. Інтуїтивно зрозумілий інтерфейс, але потребує розуміння налаштувань плагіна.
Умови: Плагін безкоштовний. Дозволено використовувати в особистих чи комерційних цілях.
Плагін для Figma: Pattern Creator
Цей плагін для Figma дозволяє створювати випадкові візерунки з вибраних кадрів. Достатньо вибрати мінімум два кадри і вказати ширину та висоту матриці, в якій вони будуть розташовані. Також можна зробити так, щоб кадри поверталися випадковим чином. Після натискання кнопки “Create” ви отримаєте новий кадр з візерунком з кадрів.
Автор: Viachas Kul
склад: Алгоритм, який випадково розподіляє і повертає ваші фрейми всередині матриці, створюючи різноманітні комбінації.
Складність: Легкий. Інтуїтивно зрозумілий інтерфейс легко розібратися змінюючи параметри.
Умови: Плагін безкоштовний. Дозволено використовувати в особистих чи комерційних цілях.
Плагін у Figma: Blobs
Цей плагін для Figma дозволяє створювати органічні форми у вигляді бульбашок або краплі за допомогою однієї кнопки. Кожна форма, що генерується, унікальна та відрізняється від попередньої.
Автор: Dylan Feltus
склад: Алгоритм, який випадково генерує форми бульбашок.
Складність: Легкий. Інтуїтивно зрозумілий інтерфейс легко розібратися змінюючи параметри.
Умови: Плагін безкоштовний. Дозволено використовувати в особистих чи комерційних цілях.
