Design Systems Collective: от промпта до production с Claude Design и Claude Code

О чём статья

Опубликованная в апреле 2026 года в издании Design Systems Collective на Medium, статья Абхи Чаттерджи отвечает на практический вопрос о том, как Claude Design и Claude Code предназначены работать вместе для продуктовых дизайнеров — и реалистичен ли получившийся процесс настолько, чтобы заменить существующий цикл «Figma — передача» в командах, уже поддерживающих дизайн-систему.

Контекст

Статья отражает период, когда Anthropic выпустила оба инструмента — Claude Design (инструмент визуального исследования) и Claude Code (агентный инструмент генерации кода), — и дизайн-сообщество разбиралось, как соединить их в практичный production-процесс. Design Systems Collective — это издание Medium для практиков, работающих с дизайн-системами, и статья написана для дизайнеров, у которых уже есть библиотека компонентов, а не для широкой аудитории.

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

Описанный процесс начинается в Claude Design с быстрого визуального исследования — генерации вариантов макета, тестирования расположения компонентов и быстрого достижения визуального намерения без построения полной спецификации. Ключевой шаг — передача: использование Export → Handoff to Claude Code, которое генерирует пакет, содержащий файлы дизайна, токены дизайн-системы, структуру компонентов и намерение за каждой страницей. Этот пакет даёт Claude Code общий контекст, а не просто визуальную цель.

Claude Code затем использует пакет передачи для создания production-готового кода, который остаётся в рамках ограничений реальной дизайн-системы. Поскольку токены и семантика компонентов передаются вместе с экспортом, результат соответствует определениям системы, а не реконструирует их из скриншотов.

Автор проверил, что продуктовый дизайнер реально может создавать прототипы с production-кодом при хорошо структурированной дизайн-системе — дизайн и код разделяют общий язык именования и токенов, и AI ускоряет, а не переводит. Процесс ломается, когда дизайн-система непоследовательна или когда именование компонентов расходится между Figma и кодовой базой. Этот случай сбоя описан явно, а не замалчивается.

Кому читать

Руководителям дизайн-системы и продуктовым дизайнерам, оценивающим, стоит ли интегрировать агентные инструменты кода в свой дизайн-разработческий процесс, особенно в организациях, где обслуживание дизайн-системы уже является приоритетом. Также полезно для технических руководителей, пытающихся понять, что в действительности выдаёт передача от Claude Design к Claude Code, и подходит ли это их процессу проверки.