- Опубликовано
Из Claude Code в Figma
- Автор
- Имя
- Product games с Кристиной Гусевой
- Telegram
- Product games с Кристиной Гусевой10409 подписчиков1020 постовПродакт-менеджер в New Yorker в Германии, ex-менеджер продукта в ВТБ ❤️ Рассказываю о карьере, делюсь, как строить продукты, которые пользователи полюбят Сотрудничество - @KriGuseva https://www.gosuslugi.ru/snet/6739ccfc340096358ba95950
Кратко
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
