Figma: Двунаправленные рабочие процессы с Figma MCP и Claude Code

Этот 50-минутный прямой эфир, опубликованный на YouTube-канале Figma в марте 2026 года, снят с участием Тарика Шихипара (технический сотрудник Anthropic) и Бретта МакМиллина (дизайн-эдвокат Figma). Разговор построен вокруг живой демонстрации: спикеры строят и ломают вещи на экране, одновременно объясняя, что они делают. Слайдов практически нет.

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

Для кого это видео

Дизайнеры, пишущие немного кода, и инженеры, тесно работающие с дизайн-файлами, получат от этой сессии больше всего. Предполагается базовое знакомство с Claude Code и системой компонентов Figma. Зрителям, которые ещё не настраивали сервер Figma MCP, стоит параллельно читать документацию по настройке, поскольку демонстрация начинается с уже настроенного состояния.

Ключевые выводы

MCP-соединение обрабатывает файл Figma как структурированные данные, а не как статичный экспорт. Claude Code может запрашивать конкретные компоненты, понимать связи переменных с дизайн-токенами и генерировать код реализации, соответствующий реальной дизайн-системе, а не её обобщённому приближению.
Перенос из Claude Code в Figma создаёт редактируемые нативные слои, а не сплющенные изображения или заблокированные группы. Это важно для передачи: разработчик, создавший новый UI-элемент в Claude Code, может отправить его в Figma в форме, которую дизайн-команда сможет доработать без пересборки с нуля.
Обратное направление — из дизайна в код — требует, чтобы дизайнер понимал описываемую структуру на уровне деталей. Шихипар демонстрирует несколько случаев, когда расплывчатое описание даёт обобщённый код, а описание, привязанное к конкретным именам компонентов и ссылкам на переменные, даёт готовый к реализации результат.
Сессия честно показывает реальные ограничения: MCP-соединение пока не охватывает все типы файлов Figma и некоторые возможности дизайн-систем. Спикеры обсуждают, что работает стабильно, а что ещё развивается — это полезнее, чем продуктовая демо, избегающая пограничных случаев.
Рабочий процесс меняет масштаб того, что может сделать совместная работа дизайнера и инженера за одну сессию. Вместо того чтобы дизайн производил спецификации для интерпретации инженерами, обе стороны могут работать с одними и теми же материалами и перемещать изменения через границу без ручного пересоздания.

Стоит смотреть, если ваша команда уже освоила AI-инструменты Figma и вы пытаетесь соединить их с процессом разработки, либо если вы оцениваете, достаточно ли зрела интеграция Figma MCP для использования в работе с production-facing дизайном.