Claude Design: что это и как сделать макет в Claude

Автор: Редакция AI-библиотеки · Дата: 21.10.2026 · Проверено: 21.10.2026 · Время чтения: 8 минут

Claude Design — это инструмент Anthropic, в котором макеты, интерактивные прототипы, одностраничники и другие визуальные материалы делаются через разговор с Claude. Вы описываете, что нужно, Claude собирает первую версию на холсте рядом с диалогом, а дальше вы правите её словами, комментариями к элементам или руками прямо на холсте. Ниже — где сейчас работает Claude Design, на каких планах он доступен, как подключить свою дизайн-систему, как экспортировать результат и как передать макет в Claude Code. Всё сверено со справочным центром Claude, страницей продукта и страницей тарифов на 20 октября 2026 года.

Кратко

• Claude Design доступен на планах Free, Pro, Max, Team и Enterprise и включён по умолчанию. На Enterprise он включается по умолчанию с 15 октября 2026 года.
• Работает в любом диалоге с Claude, во вкладке Artifacts, в Claude Code и в мобильном приложении.
• Отдельная версия на claude.ai/design закрывается 14 декабря 2026 года — дизайн-системы оттуда нужно перенести до этой даты.
• Результат можно отправить ссылкой, скачать в PowerPoint, PDF или HTML или передать в другие сервисы через коннекторы.
• В Claude Code есть команды /design и /design-sync: первая переносит дизайн в код и обратно, вторая подтягивает вашу дизайн-систему.
• Для презентаций у Claude теперь отдельный инструмент — Claude Slides.

Что такое Claude Design

Справочный центр описывает Claude Design как пару «разговор плюс холст». Вы описываете задачу — Claude генерирует рабочий макет на холсте рядом с диалогом. Затем вы дорабатываете его тремя способами:

• В чате — для крупных изменений: «сделай цветовую схему темнее», «перестрой дашборд так, чтобы метрики были в верхнем ряду», «покажи 2–3 варианта раскладки».
• Комментариями к элементам — для точечных правок: кликаете по кнопке и пишете «увеличь внутренние отступы».
• Прямо на холсте — перетаскивание, изменение размера и выравнивание элементов, правка текста, ползунки для отступов и цвета, которые Claude создаёт сам.

На странице продукта Anthropic перечисляет типичные задачи: макеты, одностраничники из коммерческих предложений, кликабельные прототипы будущих экранов и материалы для кампаний.

Claude Design — один из шаблонов, с которых начинается артефакт. Артефакт в Claude — это отдельный результат работы рядом с диалогом: документ, макет, страница. Поэтому работа в Design устроена так же, как с остальными артефактами: у каждого есть ссылка, по умолчанию закрытая, пока вы её не откроете.

Где работает Claude Design

По справочному центру, на 20 октября 2026 года:

• В диалоге. Попросите Claude о макете: «сделай одностраничник из этого предложения». Ещё вариант — выбрать в поле сообщения Output → Design.
• Во вкладке Artifacts. Откройте её и выберите шаблон Design.
• В Claude Code. Попросите Claude превратить идею в макет или используйте команду /design — в настольном приложении или в терминале.
• В мобильном приложении для iOS и Android. Можно попросить макет в любом диалоге, а потом открыть результат на весь экран во вкладке Artifacts. Настройки доступа меняются только в веб-версии или настольном приложении.
• На claude.ai/design. Отдельная версия продолжает работать до 14 декабря 2026 года, проекты в ней сохраняются до закрытия.

Изменение связано с решением Anthropic от 16 сентября 2026 года: Cowork и чат объединяются в один Claude, а возможности Design становятся доступны из любого разговора. Тогда же Anthropic представила Claude Docs и Claude Slides.

На каких планах доступен

План	Claude Design
Free	да
Pro	да
Max	да
Team	да, включён по умолчанию
Enterprise	да, по умолчанию с 15 октября 2026 года; владелец может включить раньше

На Team и Enterprise настройки Design, артефактов, дизайн-систем и общего доступа собраны в одном месте: Organization settings → Artifacts.

Как сделать первый макет

Порядок из справочного центра:

1. Начните макет из диалога или из вкладки Artifacts.
2. Подключите дизайн-систему, по которой Claude будет собирать макет.
3. Добавьте контекст: скриншоты, существующие материалы, ссылку на репозиторий с кодом.
4. Опишите, что нужно сделать.
5. Посмотрите, что Claude собрал на холсте.
6. Доработайте через чат, комментарии или прямо на холсте.
7. Экспортируйте результат или поделитесь ссылкой.

Справочный центр советует включать в запрос четыре вещи: цель (что делаете), раскладку (как расположить элементы), содержание (какую информацию показать) и аудиторию (для кого). Если чего-то не хватает, Claude задаст уточняющие вопросы.

Примеры запросов на русском, по образцу из справочного центра:

• «Сделай дашборд с выручкой по месяцам и фильтрами по региону и продукту».
• «Нарисуй онбординг мобильного приложения из 4 экранов, который знакомит с главными функциями».
• «Собери лендинг для нового API: первый экран, примеры кода, цены».
• «Сделай форму обратной связи с вопросами, которые меняются в зависимости от категории».

Если комментарии на холсте не срабатывают, справочный центр рекомендует вставить замечание прямо в чат — это известная временная проблема, когда комментарии иногда пропадают до того, как Claude их прочитает.

Дизайн-система: почему с неё начинать

Без дизайн-системы Claude Design выдаёт рабочий, но обезличенный результат. С ней каждый новый проект автоматически использует ваши цвета, шрифты и компоненты.

Дизайн-систему можно подключить из репозитория на GitHub, из файлов дизайна, из загруженных файлов или из локального проекта командой /design-sync в Claude Code. По справочному центру, Claude строит макеты из ваших настоящих компонентов, сам сверяет результат с дизайн-системой и исправляет расхождения до того, как вы их увидите.

Для команд Anthropic советует порядок: сначала опытный дизайнер настраивает дизайн-систему, потом доступ получают все остальные. На Enterprise администраторы могут разрешить публикацию, выбор системы по умолчанию и удаление дизайн-систем только отдельным людям.

Если вы работали в отдельной версии на claude.ai/design, перенесите дизайн-системы в основной Claude до 14 декабря 2026 года. На Enterprise для этого должны быть включены Artifacts и Design systems в Organization settings → Artifacts — дизайн-системы там по умолчанию выключены.

Экспорт и передача дальше

По странице продукта, результат можно:

• отправить ссылкой — она закрыта по умолчанию, пока вы не откроете доступ;
• скачать в PowerPoint, PDF или HTML;
• передать в другие сервисы через коннекторы. На странице продукта упомянуты, в частности, Adobe, Canva, Gamma, Lovable, Miro, Replit, Vercel и Wix.

Как передать макет в Claude Code

Claude Design и Claude Code связаны напрямую. Когда макет готов стать программой, его передают в Claude Code, и тот продолжает с вашего макета, а не начинает заново по скриншоту.

В Claude Code для этого две команды:

• /design — перенести макет в код проекта, выгрузить код как живой прототип или поручить Claude сделать всё от макета до работающей программы;
• /design-sync — подтянуть дизайн-систему из проекта, чтобы всё, что вы собираете в Claude Design, начиналось с ваших компонентов.

Claude Code входит в платные планы. Как его поставить — в статье как установить Claude Code, правила для проекта — в CLAUDE.md.

Частые вопросы

Нужна ли платная подписка? Нет. По справочному центру и странице тарифов, Claude Design есть на бесплатном плане. Платный план нужен для Claude Code и команд /design и /design-sync.

Чем Claude Design отличается от Figma? Figma — профессиональный редактор, где дизайнер рисует руками. В Claude Design основной способ работы — описание задачи словами, а холст служит для правок. Связать Claude с макетами Figma можно и с другой стороны — через сервер Figma MCP.

Можно ли делать презентации? Для презентаций у Claude теперь отдельный инструмент — Claude Slides. По странице тарифов на дату сверки Slides отмечен на планах Free, Pro и Max. В объявлении 16 сентября 2026 года Design, Slides и Docs были названы бета-версиями на платных планах — состав планов с тех пор расширился, ориентируйтесь на страницу тарифов.

Работает ли в России? Сервисы Anthropic работают в странах из официального списка поддерживаемых регионов. На дату сверки России в этом списке нет.

Что дальше

Обзор других нейросетей для интерфейсов — в статье нейросеть для Figma. Как устроены агенты, которые делают работу целиком, — в материале что такое AI-агент.

Актуально на 20 октября 2026 года. Claude Design активно меняется: в октябре — декабре 2026 года Anthropic переносит его из отдельной версии в основной Claude, так что расположение кнопок может отличаться.

Источники

1. Claude Help Center — Get started with Claude Design: https://support.claude.com/en/articles/14604416-get-started-with-claude-design
2. Claude Help Center — Claude Design admin guide for Team and Enterprise plans: https://support.claude.com/en/articles/14604406-claude-design-admin-guide-for-team-and-enterprise-plans
3. Claude — Claude Design: https://claude.com/product/design
4. Claude — Claude Cowork and chat are now one Claude (16.09.2026): https://claude.com/resources/articles/cowork-is-now-claude
5. Claude — Pricing: https://claude.com/pricing
6. Anthropic — Supported countries and regions: https://www.anthropic.com/legal/supported-regions