Из Claude Code в Figma

Из Claude Code в Figma

Еще один шаг в сторону более мягкой коллаборации между дизайнером и продактом, который билдит прототипы с LLM. Теперь прототипы, созданные в Claude Code, можно перемещать в Figma для дальнейшей командной работы.

Первоисточник: https://www.figma.com/blog/introducing-claude-code-to-figma/

Инструкция на русском:

1. Подключение Связываете Claude Code с вашим аккаунтом Figma. Для этого используется Figma MCP server. Это дает нейросети официальное разрешение заходить в ваши дизайн-файлы.

2. Запуск интерфейса Запускаете свой проект локально или открываете нужную страницу в браузере. Claude должен видеть живой работающий код, чтобы считать его структуру, стили и данные.

3. Команда на захват В терминале Claude Code вы просто пишете текстом: «Перенеси этот экран в Figma».

- ИИ сканирует код страницы.

- Превращает HTML/CSS в понятный для Figma формат.

- Копирует результат в буфер обмена или отправляет напрямую в открытый файл.

4. Работа на холсте Вы переходите в Figma и вставляете результат. Вместо плоской картинки вы получаете живые слои: кнопки, шрифты и отступы, которые можно двигать, перекрашивать и тестировать вместе с командой.

Для команд звучит офигенно! Пробуем?

#PG_education