Обновление Figma 2023: новые возможности и функции
Figma — популярный сервис для дизайна, который используется для создания веб-сайтов, мобильных приложений и различных прототипов. На конференции Config, которая состоялась 21 июня 2023 года, было представлено крупное обновление Figma. Среди новых возможностей — Dev Mode, переменные, расширенная функциональность прототипов, интеграции, искусственный интеллект и многое другое.
Предлагаем подробно рассмотреть некоторые новые функции и возможности, которые появились в этом обновлении.
Dev Mode
Особенность функции Dev Mode заключается в том, что она ускоряет переход от проектирования к этапу разработки. Благодаря использованию данного режима можно быстро находить нужную информацию для программирования, такую как спецификации и стили, готовый код и т.д. Это значительно ускоряет процесс создания и сборки проектов.
Хотя область применения данной возможности весьма широка, использовать ее стоит с осторожностью. Dev Mode находится в бета-версии и не всегда работает корректно. Часто приходится редактировать результат или даже начинать с нуля.
Обновленный режим Inspect
Новый режим 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
В Auto Layout появились две новые функции — Wrap и Max/Min.
Wrap используется для переноса элементов списка на следующую строку. Это обновление полезно, так как иногда необходимо сделать сквозное форматирование текста в кнопках, формах и других интерфейсных элементах.
Max/Min позволяют устанавливать максимальные и минимальные значения ширины и высоты карточки, что позволит изменять размер контента в зависимости от ее размера.
Превью шрифтов
В Figma теперь доступна возможность предварительного просмотра шрифтов. Эта функция поможет оценить, как выглядит текст с разными стилями шрифта, и улучшит качество дизайна.
Статусы
Статус определяет, какие фреймы готовы к разработке. Кроме того, теперь доступна система контроля версий, позволяющая видеть различия между измененными компонентами, а также кто и когда их вносил.
Плагин для VS Code
С помощью плагина для VS Code возможен доступ к файлам дизайн-макета, просмотр и контроль изменений в них без выхода из редактора.
Что будет в следующем обновлении Figma?
Компания Figma приобрела Diagram — организацию, которая занималась разработкой AI-плагинов.
Известно, что в скором времени можно будет, например, вводить запросы для создания макета кнопок в разных стилях. Искусственный интеллект будет работать так же, как встроенный ChatGPT в Figma, и поможет создавать тексты. Кроме того, можно будет сделать запрос на создание элементов интерфейса в нескольких вариантах и заменить информацию в них с помощью ИИ.
мерси)
Круто, что теперь есть превью. Его отсутствие реально раньше раздражало. Хорошо, что разработчики наконец-то одумались)))
Точняк! Раньше мешало, что не были нормально видные отступы у блоков. Теперь такой проблемы нет.
Он теперь мак онли скетч в подметки не годится, хотя скетч до последнего был моим фаворитом.
Раньше можно было двигать элемент в Inspect, а как теперь это делать? Что-то не могу понять? У кого-то получается?