Связка Figma Desktop и СуперИнтеллекта позволяет не только обсуждать макет в чате, но и выполнять в нём реальные действия. Агент читает структуру открытого файла, создаёт и изменяет фреймы, фигуры, текст и компоненты, а также экспортирует выбранные элементы.

Что даёт подключение

  • Чтение дизайна: получить информацию о документе, страницах, выделении и свойствах элементов.
  • Создание и редактирование: фреймы, прямоугольники и другие фигуры, текстовые слои, компоненты и их экземпляры.
  • Подготовка макетов: собрать карточку, пост, экран или серию слайдов по текстовому описанию.
  • Экспорт: выгрузить выбранный фрейм или элемент, например в PNG.

Что понадобится

  1. Figma Desktop последней версии и открытый в нём файл, с которым будет работать агент.
  2. Приложение СуперИнтеллект на компьютере. Скачайте его с my.suin.ai/download и войдите в свой аккаунт SUIN.
  3. Node.js с npx и Python 3 для двух локальных вспомогательных процессов.

Шаг 1. Запустите локальный MCP-сервер

В терминале выполните команду и оставьте процесс запущенным:

npx claude-talk-to-figma-mcp

Пакет поднимает WebSocket на порту 3055 и MCP-сервер. WebSocket связывает плагин внутри Figma Desktop с локальным агентским каналом, а MCP даёт агенту инструменты чтения и изменения макета.

Шаг 2. Установите плагин в Figma Desktop

  1. В Figma Desktop откройте Menu → Plugins → Development → Import plugin from manifest….
  2. Выберите файл src/claude_mcp_plugin/manifest.json в папке установленного пакета.
  3. После импорта в разделе Plugins → Development появится плагин «СуперИнтеллект — Figma Agent».

В проверенной установке путь к manifest выглядит так:

/tmp/figma-arinspunk/src/claude_mcp_plugin/manifest.json

Если пакет установлен в другом месте, укажите свой путь — важен именно manifest.json внутри src/claude_mcp_plugin.

Меню Plugins и Development в Figma Desktop
В Figma Desktop откройте Plugins → Development.

Шаг 3. Подключите канал плагина

  1. Откройте Plugins → Development → «СуперИнтеллект — Figma Agent».
  2. Дождитесь зелёного блока «Connected on port 3055! Copy the channel ID: …» и скопируйте ID.
  3. Нажмите Connect. Если плагин уже подключён, вместо неё будет кнопка Disconnect — повторно подключаться не нужно.
  4. Укажите скопированный channel ID в настройках интеграции SUIN. Для серверной настройки используется переменная окружения FIGMA_DESKTOP_CHANNEL.
FIGMA_DESKTOP_CHANNEL=ваш_channel_id
Плагин СуперИнтеллект — Figma Agent подключён к порту 3055
Зелёный блок подтверждает подключение к порту 3055. Скопируйте channel ID.

Шаг 4. Запустите HTTP-обёртку для backend

Во втором терминале запустите:

python3 /tmp/figma-mcp-http.py

Скрипт слушает 127.0.0.1:3900 и проксирует MCP-вызовы между backend СуперИнтеллекта и локальным сервером Figma. Он нужен потому, что backend обращается к инструментам по HTTP, а не напрямую через WebSocket плагина. Этот процесс тоже должен оставаться запущенным.

Шаг 5. Включите Figma Desktop в чате SUIN

  1. Откройте чат в приложении СуперИнтеллект.
  2. Нажмите «+» рядом с полем ввода, затем откройте подключения. В текущем интерфейсе список «Мои подключения» также открывается отдельной иконкой интеграций рядом с «+».
  3. Включите компьютер, на котором запущена Figma Desktop, — например MacBook-Pro-RYBIN. Если в списке отображается отдельный пункт Figma Desktop, включите и его.
  4. Убедитесь, что компьютер показывает статус «В сети».
Figma и компьютер MacBook включены в подключениях СуперИнтеллекта
В «Моих подключениях» включите компьютер, на котором запущена Figma Desktop. Облачная Figma — отдельная интеграция.

Режим «Полный контроль»

Для создания и редактирования без подтверждения каждой операции выберите «Полный контроль» в меню подтверждений действий ИИ и разрешите доверенную работу в настройках приложения. В других режимах SUIN может спрашивать подтверждение на запись и создание объектов.

Меню выбора режима Полный контроль в СуперИнтеллекте
«Полный контроль» убирает стандартные подтверждения; опасные действия приложение всё равно может спрашивать отдельно.

Примеры запросов

После подключения можно писать обычные задачи в чат:

  • «Создай фрейм 1080×1350 с заголовком».
  • «Сделай карточку продукта по этому шаблону».
  • «Экспортируй этот фрейм в PNG».

Для точного результата называйте размеры, текст, цвета, отступы и целевой фрейм. Если нужно изменить существующий элемент, сначала выделите его в Figma и сошлитесь на выделение в запросе.

Фреймы 1080×1350, созданные агентом СуперИнтеллекта в Figma Desktop
Пример результата: семь фреймов 1080×1350 созданы агентом из чата SUIN.

Если что-то не работает

СимптомВероятная причинаЧто сделать
Must join a channelПлагин не подключён или channel ID сменилсяОткройте плагин, нажмите Connect, скопируйте актуальный ID и обновите его в настройках SUIN или FIGMA_DESKTOP_CHANNEL.
DEVICE_OFFLINEПриложение на компьютере закрыто или нет сетиОткройте СуперИнтеллект на ПК, войдите в аккаунт и проверьте интернет. Затем включите компьютер в «Моих подключениях».
Figma Desktop закрыта или агент не видит файлЛокальный плагин недоступенОткройте Figma Desktop и нужный файл, затем снова запустите плагин и проверьте порт 3055.
Permission dialog появляется при каждой операцииВыбран режим с подтверждениями или компьютер не доверенВключите «Полный контроль» и доверие в настройках приложения. Опасные команды и снимки экрана могут запрашивать подтверждение отдельно.
Диагностика подключения Figma Desktop

Безопасность

  • Запускайте только проверенные пакет, manifest плагина и HTTP-скрипт.
  • Не передавайте channel ID посторонним и обновляйте его при смене канала.
  • Если не нужны автоматические изменения, оставайтесь в режиме с подтверждением записи.
  • Для остановки доступа закройте плагин, оба локальных процесса и выключите компьютер в подключениях чата.