TransformMe: новый плагин, который позволит создавать потрясающие иллюстрации в Figma

Andrey Anashkin
Дизайн-кабак
3 min readMay 1, 2023

Когда речь заходит о дизайне, не всегда удается иметь под рукой все нужные инструменты. Возможно, вы работаете в Figma, но вам не хватает функций, которые есть в Illustrator. С такой проблемой я столкнулся два года назад и мне пришла в голову идея скопировать функцию Effects → Transform из Illustrator в Figma, и вот теперь я рад представить вам мой новый плагин — TransformMe.

Что делает плагин и как им пользоваться

TransformMe позволяет легко применять различные трансформации к выбранным элементам в Figma. Для начала работы с плагином выделите нужный элемент — это может быть как отдельный шейп, текст, так и целый артборд. Затем нажмите кнопку → Get Item from Figma (если кнопка неактивна, просто снимите выделение с объекта и выделите его снова).

Далее вы можете играться с настройками и изменять параметры трансформации так, как вам нужно. Например, попробуйте изменить размер, положение или поворот элемента. Когда ваша иллюстрация готова, нажмите на кнопку Past items to Figma →, чтобы вставить все изменения в Figma. В процессе работы с плагином вы можете также выделять другие элементы и добавлять их с помощью кнопки → Get Item from Figma, это позволит, например один раз настроив плагин, применять его к другим элементам. Для сброса настроек дважды кликните на ползунок.

Вот несколько примеров применения плагина с шейпом и с текстом.

Трансформация звезды
Трансформация текста

Техническая сторона плагина

В Figma API нет нормальной матрицы трансформации, поэтому пришлось написать свой просмотрщик, который позволил мне применять матрицу трансформации к SVG и загружать изменения в Figma. Изначально я считал это недоработкой, потому что, тот же плагин BlendingMe, который я написал как раз два года назад, умеет изменять объект прямо в Figma. Но оказалось, это значительно расширило возможности плагина и позволило применять трансформации не только к шейпам, но и к тексту, группам элементов и большим артбордам.

Что дальше

В ближайших планах разработки плагина — добавление функции изменения прозрачности, lock для масштабирования и позиции, а также возможности изменения вращения по отрезкам вместо градусов. Это позволит вам еще более точно настраивать расположение иллюстраций и создавать невероятные иллюстрации прямо в Figma.

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

И если вы хотите быть в курсе всех новостей и обновлений плагина TransformMe (а так же других моих плагинов BlendingMe и WaveMe), вы можете подписаться на телеграм канал и следить за его новостями (Да, я его только что создал, но уже есть много контента для него). Кроме того, вы всегда можете связаться со мной, чтобы поделиться своими идеями и предложениями по улучшению плагина или задать вопросы, если у вас возникнут какие-либо проблемы при его использовании.

Как итог, плагин TransformMe — кажется достаточно мощным инструментом для создания невероятных иллюстраций и проектов, ну и уж он точно ускорит процесс работы в Figma.

--

--