Обновление Figma 2023: новые возможности и функции

Figma — популярный сервис для дизайна, который используется для создания веб-сайтов, мобильных приложений и различных прототипов. На конференции Config, которая состоялась 21 июня 2023 года, было представлено крупное обновление Figma. Среди новых возможностей — Dev Mode, переменные, расширенная функциональность прототипов, интеграции, искусственный интеллект и многое другое.

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

Особенность функции Dev Mode заключается в том, что она ускоряет переход от проектирования к этапу разработки. Благодаря использованию данного режима можно быстро находить нужную информацию для программирования, такую как спецификации и стили, готовый код и т.д. Это значительно ускоряет процесс создания и сборки проектов.

Хотя область применения данной возможности весьма широка, использовать ее стоит с осторожностью. Dev Mode находится в бета-версии и не всегда работает корректно. Часто приходится редактировать результат или даже начинать с нуля.

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

Также теперь с помощью таких плагинов, как Anima и Figma to Code, можно получить готовый код в различных вариантах:

• HTML
• CSS
• TailwindCSS
• Flutter
• SwiftUI (среда для разработки на iOS, iPadOS, WatchOS, tvOS и MacOS)
• React (JSX)
• TypeScript (TSX)

Кроме того, код можно сразу открыть в любой среде разработки (Visual Studio, Sublime Text, Atom) или скачать в виде архива, который содержит готовый шаблон. Для этого достаточно открыть файл в своем редакторе кода.

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

В Auto Layout появились две новые функции — Wrap и Max/Min.

Wrap используется для переноса элементов списка на следующую строку. Это обновление полезно, так как иногда необходимо сделать сквозное форматирование текста в кнопках, формах и других интерфейсных элементах.

Max/Min позволяют устанавливать максимальные и минимальные значения ширины и высоты карточки, что позволит изменять размер контента в зависимости от ее размера.

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

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

С помощью плагина для VS Code возможен доступ к файлам дизайн-макета, просмотр и контроль изменений в них без выхода из редактора.

Компания Figma приобрела Diagram — организацию, которая занималась разработкой AI-плагинов.

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

#figma #figmadesign #design