Figma сделала огромный шаг навстречу вайбкодерам, анонсировав глубокую интеграцию с популярными AI-инструментами разработки через протокол MCP (Model Context Protocol). В список новых партнеров вошли Warp, Cursor, GitHub Copilot, Factor, Augment Code и Fireblender.

Суть обновления в концепции «Code to Canvas»: теперь UI-код, сгенерированный нейросетью в терминале или редакторе, можно мгновенно превратить в редактируемый дизайн на холсте Figma и наоборот. Это создает замкнутый цикл (round-trip loop) между разработкой и проектированием.

Зачем это вайбкодерам?

Для тех, кто строит продукты в одиночку или небольшими командами, используя Cursor или Warp, главная проблема всегда заключалась в «рассинхроне» кода и визуала. Теперь контекст сохраняется: вы можете быстро набросать прототип кодом, перекинуть его в Figma для визуальной полировки, а затем вернуть обновленные стили обратно в проект.

Как работает интеграция через MCP

Использование Figma MCP Server позволяет инструментам вроде терминала Warp напрямую взаимодействовать с API Figma.

Ключевые возможности:

• Визуализация кода: Превращение UI-компонентов из кода в живые слои Figma.
• Сохранение контекста: AI-агенты теперь «видят» структуру дизайна и могут предлагать правки кода, основываясь на реальных макетах.
• Двусторонний рабочий процесс: Правки в Figma могут автоматически учитываться при генерации следующей итерации кода в Cursor или Claude Code.

«Мы добавляем новых MCP-партнеров, чтобы замкнуть цикл между кодом и холстом, где бы вы ни начинали работу», — отметил Дилан Филд, сооснователь и CEO Figma. «Когда AI позволяет любому создать всё, что он может сформулировать, дизайн становится главным дифференциатором».

Эта интеграция дополняет уже существующие связки с OpenAI Codex и Anthropic Claude Code, превращая Figma из просто графического редактора в полноценный узел управления разработкой продукта, где код и дизайн существуют в едином контексте.