Figma представляет инструменты для AI-моушн-графики и шейдеров на WebGPU
Figma коренным образом меняет подход к взаимодействию дизайна и разработки, интегрируя передовые возможности ИИ непосредственно в свое основное рабочее пространство (canvas). На ежегодной конференции Config дизайн-гигант анонсировал набор высокоточных инструментов, включая моушн-графику на базе ИИ и шейдерные эффекты, предназначенные для автоматизации сложных творческих рабочих процессов.
Сокращение разрыва с помощью Code Layers и полностековой оптимизации
Одним из наиболее значимых изменений в экосистеме Figma стало переосмысление холста, который теперь оптимизирован для full-stack разработки. Внедрение «Code Layers» позволяет дизайнерам и инженерам работать в единой среде, фактически стирая границы между визуальным макетом и живым программным кодом.
Разработчики теперь могут клонировать репозитории, генерировать новые направления дизайна с помощью ИИ-агента Figma и извлекать сложные сценарии (flows) в редактируемые слои дизайна. Что крайне важно, эти обновления обеспечивают двусторонний рабочий процесс, при котором изменения могут синхронизироваться обратно с кодом. Объединяя ИИ-агентов и инструменты программирования в едином пространстве, Figma отходит от роли простого инструмента для прототипирования, стремясь стать центральным узлом всего жизненного цикла разработки продукта.
Генеративный моушн и анимация на базе ИИ
Figma берется за один из самых трудоемких аспектов UI/UX-дизайна — моушн. Новые инструменты Motion позволяют командам совместно проектировать анимацию, переходы и 3D-трансформации прямо внутри платформы.
Вместо того чтобы вручную проставлять ключевые кадры для каждого движения, пользователи могут использовать интерфейс чат-бота, чтобы «создавать» анимацию с помощью текстовых запросов (prompts). Этот подход на базе ИИ позволяет авторам описывать переходы — например, специфический эффект отскока или скольжения — и автоматически генерировать анимацию. Поскольку эти моушн-активы связаны с дизайн-системами и имеют программную основу, они являются «готовыми к внедрению» (ready to ship), что значительно снижает трение при передаче макетов от дизайнеров к фронтенд-разработчикам.
Высокоточная визуализация с помощью шейдеров WebGPU
Расширяя границы визуальной точности, Figma представила новые инструменты для шейдеров на базе WebGPU. Это позволяет создавать кастомные визуальные эффекты и заливки, которые ранее были невозможны в рамках ограничений инструмента.
Теперь пользователи могут использовать промпты для создания сложных шейдерных эффектов, таких как дизеринг (dithering), пикселизация и сложные типы размытия, прямо на холсте. Эта возможность позволяет дизайнерам внедрять высококлассные, производительные визуальные эффекты, основанные на современных веб-стандартах. Дополнением к этому служит «Figma Weave» — набор из более чем 20 интегрированных ИИ-инструментов, предназначенных для превращения сложных многоэтапных рабочих процессов с ИИ в простые и интуитивно понятные действия на холсте.
Почему это важно для ландшафта ИИ
Эволюция Figma сигнализирует о более широком отраслевом тренде: переходе от концепции «ИИ как помощника» к «ИИ как интегрированному движку». Внедряя генеративные возможности в такие специализированные области, как моушн-дизайн и математика шейдеров, Figma демонстрирует, как LLM и генеративный ИИ могут применяться в высокотехнических профессиональных рабочих процессах. Это достижение устанавливает новый стандарт того, как творческое ПО может дополнять человеческий опыт, а не просто автоматизировать простые повторяющиеся задачи.
Основные выводы
- Единый рабочий процесс: Новые Code Layers позволяют разработчикам синхронизировать изменения дизайна напрямую с кодом, оптимизируя процесс передачи макетов.
- Генеративный моушн: Дизайнеры теперь могут использовать текстовые запросы на естественном языке для создания сложных, основанных на коде анимаций и 3D-трансформаций.
- Продвинутая визуализация: Интеграция шейдеров на базе WebGPU позволяет создавать высокоточные эффекты, такие как дизеринг и пикселизация, с помощью простых ИИ-запросов.