Технологии

Figma объединяет дизайн и код на одном холсте. Cursor сделал ставку на иное

Susan Hill

Функция Code Layers в Figma делает то, что два года назад показалось бы несбыточным: позволяет клонировать репозиторий GitHub прямо на дизайн-холст. Как только репозиторий окажется там, можно извлечь редактируемые дизайн-фреймы из существующего кода, внести изменения визуально и синхронизировать их обратно в репозиторий — всё внутри одного файла Figma с полноценным совместным редактированием в реальном времени. Дизайн и разработка в одном окне.

Для дизайнеров, которые годами писали заметки о передаче задач, копировали спецификации в тикеты Jira или отправляли ссылки Zeplin инженерной команде, Code Layers меняет место, где происходит разговор между дизайном и кодом. Изменения в Figma обновляют базовый код; изменения в коде обновляют слой дизайна. Мост между двумя дисциплинами всегда требовал переключения контекста — теперь это переключение стало меньше.

Figma Motion превращает анимации в готовый к отправке код

Figma также анонсировала Motion — временну́ю шкалу анимации на основе ключевых кадров, встроенную прямо в холст. Дизайнеры создают переходы, состояния hover и анимации прокрутки с помощью временно́й шкалы и библиотеки пресетов, а затем экспортируют в семи форматах: CSS, JSON, React, MP4, WebM, Animated SVG и GIF. Анимация загрузки, созданная в Figma, больше не является справочным документом, который разработчик должен интерпретировать — это и есть сама анимация.

Третьим крупным объявлением стали Shader Effects — заливки с ускорением GPU на базе WebGPU (новейшего графического стандарта браузера), позволяющие дизайнерам применять сложные, математически генерированные текстуры непосредственно к слоям Figma. ИИ-агент Figma умеет генерировать такие заливки по текстовому описанию или загруженному изображению. Введите фразу вроде «матовое стекло с мягкими синими интерференционными узорами» — и холст создаст нечто, отображаемое в реальном времени и поддающееся интерактивной настройке.

ИИ-агент получает навыки, инструменты и внешние соединения

Сам ИИ-агент существенно расширился. Теперь он может создавать многоразовые «навыки» из инструкций на естественном языке — пользовательские инструменты, автоматизирующие повторяющиеся дизайн-задачи без знаний API — и подключается напрямую к внешним сервисам, включая Notion, GitHub и Microsoft Excel. В обновлении конца 2026 года появится Weavy, конструктор рабочих процессов, приобретённый Figma в прошлом году, для узловой автоматизации внутри дизайн-файлов.

Не всё доступно уже сегодня. Code Layers находится в режиме раннего доступа: заявки открываются в июле 2026 года, требуется место Full на платном плане Figma. Shader Effects и улучшенный ИИ-агент уже активны на платных планах. Figma Motion доступна прямо сейчас для владельцев мест Full, общая доступность Code Layers ожидается позже в 2026 году.

Амбиция Figma поглотить часть рабочего процесса редактора кода наталкивается на конкретный вопрос: написание кода и проектирование интерфейсов — это разные когнитивные задачи, а Cursor — ИИ-редактор кода, который SpaceX приобрела за 60 миллиардов долларов на прошлой неделе — построил аудиторию среди инженеров, а не дизайнеров. Сойдутся ли эти два сообщества на общем холсте — по-прежнему открытый вопрос.

Теги: , , , , ,

Обсуждение

Имеется 0 комментариев.