Для чего нужен плагин unsplash в фигма
Как вставить картинку в фигме за 1 клик с сайта Unsplash
В этом обзоре вы узнаете как вставить картинку в фигме с использованием специального плагина. Этот плагин вставляет фотографии с сайта unsplash.com
В чем особенности сайта unsplash? Там размещаются фотографии, которые можно использовать в любых целях: как собственных, так и коммерческих.
Установка плагина Unsplash
Чтобы установить плагин «Unsplash» перейдите на официальный сайт фигмы, где расположен плагин. Нажмите в правой, верхней области на кнопку «Install».
Также можно найти его в разделе «Community» на главной странице фигмы во вкладке «Plagins».
Как активировать плагин:
Чтобы активировать плагин Unsplash в Figma, кликните на иконку меню в левой, верхней стороне. Затем перейдите во вкладку «Plagins» и выберите надпись «Unsplash».
Как устроен плагин «Unsplash» и какие у него есть функции
После активации плагина, перед вами появится всплывающее окно. Функции у плагина следующие.
Во вкладке «Random» можно вставлять случайные фотографии из определенных разделов.
Есть следующие категории фотографий:
Если переключитесь во вкладку «Search», то можно осуществлять поиск по фото. Для этого введите запрос в окно поиска на нажмите синею кнопку справа.
Как вставлять фотографии в Figma и работать с плагином
Вставка изображения на свободную область:
1. Чтобы вставить изображение из раздела «Random» нажмите на нужную категорию.
2. Для вставки картинок из раздела «Search», введите нужный запрос на английском выберите понравившуюся картинку.
Как вставить картинку в Figma в фигуру
С помощью плагина Unsplash вы можете вставлять картинки в различные фигуры. Фигуры можете создать с помощью стандартных инструментов фигмы (Shape tools), в верхней, левой панели фигмы.
Инструкция по массовой вставке изображений
Вставим фотографии в прямоугольники. Для этого выделяю нужные прямоугольники и для примера выбираю категорию «Nature».
Вставка изобрежений в figma в прямоугольники
Аналогично можно вставлять фотографии в другие фигуры (прямоугольники, квадраты, круги, многоугольники, треугольники, звезды и т.д). Для этого выберите нужную фигуру и нажмите на изображение в плагине «Unsplash».
В этой статье вы узнали как вставить картинку в фигме легко и просто с помощью плагина «Unsplash». Изучите другие полезные плагины, которые мы разбираем в разделе плагины.
Unsplash — бесплатный фотосток [Плагин]
Итак, рассмотрим один из самых популярных плагинов для Фигмы — Unsplash.
Unsplash — это бесплатный банк изображений, лицензия которого позволяет использовать его контент для коммерческой деятельности бесплатно и без ссылки на автора. Роскошно? Да!
Какие задачи решает этот плагин
Важно помнить: плагин меняет само изображение фона, но не меняет его масштабирование и свойства. Например, если вы откропили фон, он так и останется с этими параметрами. Это очень удобное поведение, особенно когда вы группируете несколько изображений в одно.
Как пользоваться Unsplash
Как вызывать плагин мы писали в предыдущем материале: читать.
Плагин позволяет как вставить случайную картинку, так и подобрать изображение по поиску из базы.
Чтобы вставить случайное изображение, нажмите либо «Insert random» — и тогда будет установлена совсем случайное изображение, либо на иконку категории — в таком случае изображение будет определено тематически.
Чтобы выбрать изображение из базы, введите ключевые слова на английском языке в окно поиска и выберите изображение из выдачи результатов. Чтобы выбрать фото, просто нажмите на него.
На наш взгляд Unsplash строго необходим всем, ведь он снимает рутинную возню как минимум с тестовыми изображениями. Перенос всего процесса в облако позволит сэкономить время и место на диске. Работает апи сервиса быстро. Наша оценка — 10 халявных картинок из 10.
Обнаружена интересная особенность работы плагина с маленькими объектами:
https://svgpng.ru/figma/unsplash-zagruzhaet-kartinki-v-nizkom-kachestve/
20 плагинов для Figma, которые экономят время дизайнера при создании макетов онлайн
Figma — графический онлайн-редактор, который за несколько лет активного развития обошёл основных конкурентов Sketch и Zeppelin. Успех обеспечивается за счёт решения проблем аудитории и того, что разработчики активно прислушивались к мнению пользователей.
Установка и настройка плагинов
Плагины — полезные дополнения, которые создают сторонние программисты. В июле 2019 года появилась тестовая версия редактора Figma с поддержкой расширений. Уже в августе команда сервиса заявила о полной работоспособности обновлённой панели управления.
Процесс установки состоит из 5 шагов:
Удобство «Фигмы» прослеживается в каждой детали. В том же Adobe Photoshop надо потратить время на поиск плагина, скачать его и загрузить в библиотеку. Длинный путь окажется бесполезным, если продукт не адаптирован под установленную версию графического редактора. С Figma таких проблем нет. Выбрал, нажал на кнопку и появились новые возможности.
На странице плагина размещено описание, история версий и контакты автора. При необходимости можно связаться с разработчиком, чтобы сообщить о проблеме или попросить добавить полезную функцию.
Мы подготовили список из 20 расширений, которые пригодятся дизайнерам, работающим в «Фигме».
Unsplash
Продукт от известного фотостока. Unsplash быстро заполняет блоки фотографиями. По состоянию на январь 2020 у него самое большое количество загрузок.
Принцип работы:
В дополнение интегрирована большая коллекция иллюстраций, разделённых на категории. Интерфейс на английском языке, но для понимания особенностей хватит базовых знаний.
Инструмент экономит время, когда нужно заполнить макет контентом. Выбрали карточки, задали тему и через несколько секунд слайдеры, «плитки» товаров и другие элементы показываются с красивыми фотографиями.
Map Maker
Плагин добавляет возможность вставлять интерактивные карты с сервисов Google Maps и Mapbox. При создании макетов дизайнеры часто добавляют блоки на страницы с контактами и описанием проекта. Чаще всего они просто делают снимки экрана в Гугле.
Map Maker позволяет сохранить главное преимущество Figma — интерактивность. С картами можно взаимодействовать и гибко изменять параметры. В меню настраивается вид, уровень приближения, отображение маркеров и другие опции.
Минус в том, что адрес надо проверять в Google Maps перед вставкой в редактор. Иначе в режиме предпросмотра отобразится ошибка и вставить блок не получится.
Charts
Визуальное представление данных часто используется в макетах для удобного восприятия больших таблиц и списков. Люди лучше понимают сложную информацию, когда она показывается в виде инфографики или графиков.
Расширение Charts позволяет создавать линейные, круговые, кольцевые и столбчатые диаграммы. Каждый вид поставляется с набором гибко настраиваемых параметров. После добавления блока в область редактирования его можно перемещать в любое место.
Iconify
Иконки в дизайне интерфейсов — эффективное средство визуализации. Они применяются для того, чтобы подкрепить роль определённого элемента. Пользователь видит фигуру и сразу понимает, куда перенаправит ссылка или пункт меню.
Расширение Iconify добавляет в «Фигму» архив из 40 тысяч картинок в векторном SVG формате. Их можно растягивать, перекрашивать и менять отображение.
Разработчик потрудился над созданием удобной структуры. Доступные изображения разделены на категории по типам и стилям. Есть emoji, популярные иконочные шрифты, наборы с разной цветовой гаммой. Функция вставки в виде XML кода позволяет добавлять в область документа любые фигуры из интернета.
Autoflow
Пользователи часто ругают Figma за плохую организацию режима просмотра фрейма. В интерфейсах, состоящих из 10 страниц тяжело ориентироваться. Это один из немногочисленных минусов графического редактора.
Плагин Autoflow создает наглядные связи между объектами. Можно добавлять сколько угодно пользовательских сценариев и показывать, как блоки сочетаются между собой.
Для установки связи надо выделить два элемента и включить Autoflow. Чтобы сократить время выполнения операции, воспользуйтесь сочетанием клавиш Ctrl+Alt+P. Оно запускает последний использованный плагин.
Content Reel
Продукт Microsoft, который значительно ускоряет наполнение макета контентом. Инструмент стабильно обновляется и радует пользователей новыми возможностями.
Content Reel состоит из 3 вкладок. В первой отображаются текстовые поля, которые часто используются в формах: имя, email, телефон, логин, название компании. Во второй области доступны женские и мужские аватары. Они подходят для оформления страницы профиля или списка комментариев. В третьем меню собрана коллекция иконок. Разделения по категориям нет, зато есть поиск.
Идея крутая, но пока реализация не дотягивает до идеала. Для вставки любого элемента надо сначала добавить соответствующий блок в макет. Затем выбрать его в документе и запустить плагин. Ещё один недостаток — отсутствие русского языка.
Blobs
Расширение создаёт аккуратные кляксы, которые можно интегрировать в интерфейс любого сайта или приложения для мобильных устройств. Плагин простой и не требует длительной настройки.
Инструкция по использованию:
Blobs добавляет объекты случайной формы. Пользователь влияет на них минимально. При сложности в 1 балл генерируются фигуры с равномерными пропорциями. На максимальном уровне выходят полноценные кляксы.
Image tracer
Разницу между векторной и растровой графикой знает каждый дизайнер. Иногда возникает необходимость конвертировать изображение в SVG или другой формат для масштабирования без потери качества.
Image tracer умеет делать эту операцию в Figma. Он распознает фигуры с чёткими контурами и экономит время. Не надо отрисовывать объект вручную, чтобы вставить его в макет.
Как пользоваться:
Полученные после конвертации фигуры можно трансформировать и менять другие свойства. Image tracer не заменяет векторные редакторы вроде Illustrator, а лишь помогает в решении конкретной задачи. Он не справится со сложными изображениями.
Content Buddy
Дополнение решает одну из главных проблем дизайнеров. В программах вроде Photoshop сложно менять слои в нескольких макетах одновременно. Такая задача — часть повседневной работы. Клиенты могут в последний момент попросить заменить логотип на 20 прототипах или обновить цвет панели.
Content Buddy меняет текст во всех выделенных фреймах. Задали искомый фрагмент, заменили вхождения и сохранили изменения. Плагин не умеет работать с фигурами и другими объектами. Пока что он ориентирован только на текст. Будем надеяться, что разработчик в будущем расширит возможности продукта.
Tumble
Полезное дополнение, которое добавляет эффект гравитации. Работает с вектором и текстовыми слоями. Лучше всего плагин взаимодействует с фигурами. Подойдёт для оформления заднего фона и создания паттернов.
Принцип работы:
Инструмент корректно определяет количество выделенных объектов и гармонично прижимает их к нижней границе фрейма.
Translate
Создание мультиязычных интерфейсов — стандартная задача для дизайнера. Многие компании адаптируют корпоративные порталы под несколько языков, чтобы находить новых клиентов в других регионах.
Дополнение Translate переводит текст на любой из 15 доступных языков. Для работы плагина надо получить ключ в настройках API «Яндекс.Переводчика».
Автор редко обновляет расширение, но за 6 месяцев количество доступных локализаций выросло с 6 до 15. Русский пока что не добавлен, но плагин всё равно будет полезен специалистам, работающим с иностранными заказчиками.
Если добавить в Translate поддержку русского и автоопределение языка выбранного фрагмента, он станет идеальным.
Brandfetch
На сайтах-визитках, корпоративных порталах и портфолио иногда размещают блоки со списком партнёров. Чаще всего это «плитки» с логотипами одинакового размера.
Brandfetch — поисковая система логотипов. Ввели в поле домен, нажали на кнопку, и если она есть в базе, в фрейм добавится новый слой. Плагин экономит время, но он больше подходит для зарубежных дизайнеров.
При тестировании дополнения Brandfetch не смогли найти логотип онлайн-медиа о бизнесе VC.ru, но зато корректно подгрузили картинку с популярного SEO форума.
Минусы:
Figmoji
Эмодзи — неотъемлемая часть UI. Их вставляют в списки комментариев или элементы фирменного стиля.
Добавлять emoji в Figma можно двумя способами. Первый — скопировать элемент с внешнего сайта и вставить как текст. Второй — использовать дополнение Figmoji.
Доступные эмодзи разделены на категории. Поиска нет, надо просмотреть список целиком и найти подходящий смайлик. Пока что в архиве доступен набор от Твиттера. Разработчик обещает добавить популярную библиотеку Apple.
QR code generator
QR-код — удобный способ передать информацию. В него можно зашифровать визитную карточку, ссылку на сайт или произвольный текст. В дизайне интерфейсов штрихкоды применяют для добавления ссылок на загрузку приложений. Стандартная камера в популярной операционной системе iOS способна распознавать QR-коды. Для Android надо установить специальную программу.
Расширение QR code generator превращает любой контент в штрихкод. Через него удобно передавать ссылку на прототип или загрузку файла из облачного хранилища «Фигмы».
Table Generator
Дизайн таблиц — отдельный вид искусства. Для удобного восприятия данных нужна понятная структура и гармоничная типографика.
Назначение Table Generator легко понять из названия. Инструмент не создаёт идеальные таблицы, а лишь ускоряет проектирование.
Принцип работы:
В настройках можно регулировать шрифт, пропорции ячеек, выравнивание и другие свойства. Автор обещает поддержку адаптивности, динамический размер ячеек и шаблоны.
Lorem Ipsum
Текст-заполнитель применяется для быстрого наполнения контентом. Он оживляет комментарии, текстовые блоки и другие элементы интерфейса.
Популярный Lorem Ipsum добрался и до «Фигмы». У плагина минимальное количество настроек. Пользователь включает стандартное начало предложения, задаёт количество предложений или абзацев и начинается генерация.
Расширение работает молниеносно. После нажатия на кнопку создается фрагмент, и окно закрывается. Порадовало наличие автогенерации. Lorem Ipsum проверяет рамки слоя и создаёт отрывок, который идеально вписывается в заданные границы.
Nisa Text Splitter
Figma значительно ускоряет процесс создания прототипов благодаря стандартным опциям и возможностям плагина. В архив инструментов автоматизации стоит добавить расширение, которое выводит работу с текстом на новый уровень.
Nisa Text Splitter выполняет 7 операций:
Image Palette
Главный навык дизайнера — умение подбирать гармоничную цветовую гамму. Для этих целей существуют специализированные сервисы, но без интуитивной навигации обойтись не получится.
Расширение Image Palette создаёт цветовую палитру на основе загруженного изображения. Инструмент определяет 5 наиболее ярких оттенков и выдаёт результат в виде цветных кружочков одинакового размера.
При тестировании плагина стало понятно, что он не всегда генерирует правильные значения цветов. Разработчик указал эту особенность на странице описания.
Color Overlay
Новое расширение, которое умеет перекрашивать растровые картинки. С векторными фигурами в среде «Фигмы» работать удобно, а вот с PNG ситуация непростая.
Как это работает:
Плагин действительно экономит время, но только если надо быстро перекрасить фигуру в один тон. Для детализированных картинок он не подойдёт. Область полностью заливается цветом, а внутреннее содержимое скрывается под слоем «краски».
Viewports
Интерфейс должен быть адаптивным по умолчанию. То есть корректно отображаться на широкоформатных мониторах, смартфонах и планшетах.
Работа по созданию «резинового» дизайна в Figma построена на ограничителях. Они задают границы фрейма и контролируют поведение элементов при изменении размера окна.
Расширение Viewports показывает, как выглядит контент на разных устройствах. Девайсы разделены по типу. Встроенный поиск обеспечивает просмотр макета со специфического устройства. В системе есть популярные Айфоны, Айпады, Андроид смартфоны и десктопы.
Плагины — отличный инструмент для пользователей, работающих в «Фигме». Искусственный интеллект не решает все проблемы, а лишь помогает реализовать конкретные задачи. На построение диаграмм или подбор фотографий без него пришлось бы потратить много времени.
Дизайнеры веб-студии IDBI следят за трендами и применяют в работе всю мощь продуктов автоматизации. Мы создадим идеальный интерфейс сайта или мобильного приложения для вашего проекта.
Топ 8 плагинов Figma
Плагины Figma давно ожидаемое событие. И вот наконец то они полноценно ворвались в нашу жизнь.
Не буду ходить вокруг да около — представляю вам подборку из восьми крутых плагинов Figma. В эту подборку вошли как и популярные плагины с большим количеством установок, так и менее заметные, но от этого не менее ценные.
Но сначала давайте посмотрим где находятся плагины в редакторе и как их установить.
Где искать плагины Figma
На самом деле все очень просто — плагины находятся слева на панели главной страницы
Нажмите на пункт Plugins и вы окажетесь на странице плагинов
Плагины сгруппированы по группам — рекомендуемые, популярные и установленные. Все плагины которые есть на данный момент вы можете посмотреть нажав на кнопку Browse all plugins.
Установка плагинов
Установить плагины можно двумя способами:
Установка плагина происходит мгновенно. Еще одно нажатие на кнопку инсталляции плагина приводит к его деактивации.
На детальной странице плагина вы можете посмотреть краткое описание и руководство по использованию плагина, также можете ознакомиться с информацией об авторе плагина и посмотреть его контакты, есть информация о истории версий плагина.
Переходим к самим плагинам
Top 8 плагинов Figma
Unsplash
Один из самых популярных и востребованных плагинов, если честно то я частенько задумывался о том почему Unsplash до сих пор не интегрирован с Figma и вот наконец то это произошло. Один из моих любимых плагинов, так как он в разы сокращает время работы с контентом. Особенно когда нужно быстро наполнить сайт и нет времени даже на то чтобы переключаться со вкладки на вкладку искать и сохранять изображения.
Работа с этим плагином крайне проста и приятна как и вся работа с редактором Figma.
Давайте посмотрим на его работу. Выберите плагин — нажмите правой кнопкой мыши в любом месте канваса. Выберите пункт Plugins → Unsplash.
Появится окно плагина.
Теперь выделите все карточки и нажмите любую категорию, я выбрал категорию — портреты.
Преимущество в том что вы таким образом в случайном порядке не тратя много времени можно наполнить сколько угодно большое количество карточек, слайдеров, фотографий к статьям и так далее, но несмотря на это также есть возможность более детального и расширенного поиска нужной фотографии.
Map Maker
Map Maker позволяет быстро создавать уникальную настраиваемую карту для вашего проекта. В настоящее время он поддерживает Google Maps и Mapbox.
Разберем процесс создания карты на основе Google Maps.
Выберите нужный плагин — Map Maker
По умолчанию установлена вкладка — Google Maps, она нам и нужна. Перейдите на поле Address и введите нужную локацию, например Paris.
1 — Вкладка Google Maps, 2 — Адресная строка для ввода названия локации, 3 — Блок Custom Style для ввода JSON кода.
Ниже адресной строки вы можете поменять тип карты и зум на тот который вас устроит.
Теперь самое интересное — стиль карты. Поменять стиль карты можно перейдя по одной из двух ссылок в блоке Custom Style
Давайте перейдем по первой ссылке Snazzy Map и посмотрим что это и как можно использовать данный сервис.
Перейдя по ссылке на ресурс Snazzy Map мы видим информационное окно которое гласит что данный сервис не может в полной мере поддерживать функционал Google Maps так как с июля 2019 года компания Google решила взимать с этого сервиса оплату за использования их API. Суммы достаточно большие. Для того чтобы не закрыть сервис и хоть как то оставаться на плаву, руководство сайта было вынуждено урезать самые дорогие функции и тем самым сократить свои расходы, тем более что сервис на данный момент бесплатный.
Вы можете посмотреть и изучить возможности сервиса самостоятельно, там нет ничего сложного, но так как не совсем понятна судьба данного сервиса тем более что подобный сервис теперь появился и у гугла, смысл в использовании именно Snazzy Map отпадает, моральная сторона этого вопроса думаю будет раскрыта в других источниках.
Перейдите по ссылке Google Official Map Style в блоке Custom Style
Выберите Create a Style.
Теперь можно подобрать нужный стиль, если не знаете что выбрать есть один проверенный стиль который одинаково хорошо смотрится на любом проекте, он достаточно нейтрален и ненавязчив. Стиль называется Silver.
Также можно немного почистить карту убрав лишние мешающие названия, достопримечательности и дороги. Для этого есть специальный фильтр Adjust density of features (регулировка плотности функций)
Также можно поменять цвета и настроить карту более гибко. Для этого нажмите внизу кнопку More Options.
Теперь когда карта готова нажмите Finish выйдет следующее окно:
Нажмите на ссылку — Copy JSON и код скопируется в буфер обмена, это нужно для того чтобы получить код настроенной карты и перенести его в наш плагин. Возвращаемся обратно в Figma и вставляем скопированный код в поле Custom Style.
Обратите внимание на то как изменилась карта в окне просмотра. Значит все применилось, все работает корректно.
Далее осталось только нажать на кнопку Make Map чтобы применить настроенную карту к нашему блоку который в дальнейшем можно использовать в проекте.
Я немного уменьшил зум и вот что из этого получилось.
Charts
Если вы часто проектируете дашборды то однозначно плагин Charts сильно облегчит выполнение рутины, и возможно позволит вам создавать вполне симпатичные графики.
Как он работает? Выбираем плагин Charts из выпадающего списка плагинов.
Получаем вот такое окно
Все довольно просто и интуитивно понятно. Давайте немного пройдемся по настройкам.
Можно создавать сколько угодно большое количество разных диаграмм
А потом настраивать их под свои задачи.
Iconify
Очень полезный и нужный плагин. Я думаю он должен быть в арсенале любого дизайнера.
Суть плагина вполне проста — быстрый поиск и добавление нужной иконки в SVG формате в ваш проект.
Выбираем плагин Iconify.
Получаем вот такое окно со всевозможными сборниками иконок, просто огромное количество.
Очень удобно реализована подача коллекций иконок, понятно количество иконок, виден размер, а также прописана принадлежность к компании и автор.
Пользоваться иконками невероятно просто. Можно воспользоваться конкретной коллекцией и подобрать иконку там, или найти иконку через поиск.
Затем выбранную иконку можно немного преобразовать — повернуть на определенный угол или отзеркалить по вертикали или горизонтали, а также задать нужный цвет.
Autoflow
Один из самых простых и самых популярных на сегодняшний день плагин.
Данный плагин позволяет показывать связь между объектами, очень полезная штука для изображения пользовательских сценариев и любых других сценариев, где важно показать принадлежность и последовательность событий.
Чтобы создать взаимосвязь достаточно выделить два объекта и выбрать в выпадающем списке плагин Autoflow.
Небольшой лайфхак: Чтобы каждый раз не выбирать плагин из списка есть сочетание клавиш которое позволяет выбирать последний плагин > которым вы пользовались — Ctrl+Alt+P.
Вот так в три клика можно получить связи между нужными объектами.
Content Reel
Плагин предназначен для того чтобы быстро и рандомно наполнять ваши страницы сайта уникальным контентом, плагин сам по себе очень полезный, но в тоже время достаточно неоднозначный.
Что входит в состав плагина:
Я создал восемь карточек с таким наполнением — аватар, поле имени, поле адреса и электронная почта.
Задача — получить на всех карточках разный контент. Давайте посмотрим как работает плагин и что он реально может. Начинаем с выбора плагина.
Получаем вот такое окно.
Далее выберите поочередно все имена, адреса и емейлы и нажмите нужный пункт в окне плагина как показано на гифке.
Мы рандомно поменяли на восьми карточках имена, адреса и емейлы. Отлично, аватары поменять мы не сможем потому что эта опция еще недоступна, когда ее добавят разработчики можно только гадать, поэтому предлагаю очень простое решение которым я пользуюсь очень давно и довольно успешно — воспользуемся сервисом Random User Generator.
Данный сервис тоже достаточно прост, чтобы им воспользоваться откройте его в новой вкладке браузера и нажатием мышки на аватарке выберите нужную вам, затем нажмите на нее правой кнопкой мыши и сохраните.
Нам нужно будет восемь разных фотографий пользователей. Теперь возвращаемся в Figma и заполняем аватарки на карточках сохраненными изображениями. Для того чтобы не переносить изображения по одному в Figma есть специальная пакетная вставка, активируется она клавиатурным сокращением Ctrl+Shift+K, далее в открывшемся окне выберите нужные изображения и нажмите открыть. Появится курсор с количеством изображений и превью.
Вот так мы восполнили достаточно досадный пробел этого плагина, возможно его авторам стоит подумать над тем чтобы договориться с сервисом Random User Generator о более тесном сотрудничестве и интеграции данного сервиса с редактором Figma.
Небольшой итог по плагину:
В целом плагин полезный, но на данный момент сыроватый. Использовать без фанатизма.
Blobs
Незамысловатый, простой и на мой взгляд очень нужный плагин, особенно учитывая тренды на всевозможные фоны, иллюстрации и абстракции.
Выбираем плагин Blobs.
Появляется вот такое окно.
И по сути это и есть весь плагин, две настройки — сложность и контраст, количество и там и там ограничено десятью. Давайте посмотрим что может этот малыш.
Еще минута и готово вот такое чудо:
Отлично! Я считаю что получается очень достойно, если учесть что все эти фигуры можно масштабировать и редактировать то этот плагин просто находка. Пока недооцененная сообществом, но думаю это изменится в будущем.
Image tracer
Этот плагин нужен в том случае когда у вас есть растровое изображение, но вам нужен вектор, а обводить либо нет времени либо желания либо того и другого.
Ищем нужное нам растровое изображение, например какой-нибудь силуэт или логотип или еще какое-нибудь нужное вам изображение, желательно с четкими очертаниями и контрастной заливкой. Я взял силуэт девушки с предыдущего руководства по афтер эффектсу.
Окно плагина активируется только в том случае если вы уже перенесли в редактор изображение и выделили его.
Работает он следующим образом.
Есть еще дополнительные опции по более точной настройке плагина
Пожалуй самая важная это опция blur она предназначена для сглаживания пикселей и превращение рваной линии в более плавную.
Плагин несомненно очень полезный, теперь вам не придется пользоваться дополнительным софтом подобно иллюстратору или корелу специально для того чтобы трассировать изображение.
Вместо заключения
Плагины в Figma несомненно крутая штука, но не стоит увлекаться и обвешиваться ими с ног до головы, ознакомьтесь со всеми и выберите себе 2-3 которые реально будут помогать вам и ежедневно брать на себя рутинные действия автоматизируя и упрощая тем самым процесс проектирования и создания крутых интерфейсов.