Claude Design — отдельный раздел Claude, где вы описываете словами нужное, а на холсте рядом с перепиской собирается готовая работа: макет экрана, колода слайдов или страница сайта. По-русски его называют «клод дизайн», и открыт он на платной подписке Claude. Фотографии, фоны и иллюстрации в такую работу приносят готовыми файлами: своей модели изображений у Claude Design нет.
Кадр для слайда и первого экрана — в чате на этой странице
Опишите словами, что должно быть на картинке, и заберите готовый файл: в проект Claude Design его кладут так же, как снимки и готовые материалы. Одну картинку в сутки с одного адреса GEN202 рисует за свой счёт, без регистрации.
Claude дизайн: что такое Claude Design и что он собирает
В Claude Design человек получает готовый дизайн, интерактивный прототип или презентацию из разговора с Claude — так продукт описан в справке Anthropic. Там же он назван бета-версией. Вышел он из подразделения Anthropic Labs, анонс был 17 апреля 2026 года.
Работы, которые Anthropic перечисляет на продуктовой странице, делятся на четыре вида. Первый вид — прототипы, макеты и вайрфреймы, то есть черновые схемы экранов. Второй вид — дизайн-исследования, когда одно и то же решение показывают сразу в нескольких направлениях. Третий вид — презентации для инвесторов и маркетинговые материалы: одностраничные сайты, картинки для соцсетей и материалы кампаний. Четвёртый вид — документы вроде резюме или одностраничника с выводом в PDF.
Работа при этом остаётся разговорной. Вы не расставляете элементы вручную с нуля, а говорите, что нужно получить, и правите то, что собралось. Правка рукой прямо на холсте тоже есть.
Какой сервис Claude выбрать: чат, Claude Design или Claude Code
Разговор в обычном чате Claude подходит, когда наглядное нужно внутри объяснения: Claude собирает схему или график кодом прямо в переписке, и там же они остаются.
Claude Design берут, когда работу отдают дальше: на холсте собирается макет, колода слайдов или страница, а из проекта их выгружают файлом или отправляют в другой сервис.
Claude Code нужен, когда результат должен стать настоящим проектом с файлами и кодом. С Claude Design он связан напрямую, и работа переходит из одного в другой в обе стороны.
Claude design сайт: адрес инструмента и рабочее окно
Открывают Claude Design по адресу claude.ai/design, а в настольном приложении Claude для него есть отдельный пункт боковой панели. Вход идёт под той же учётной записью Claude, что и чат.
Официальный сайт Claude Design с описанием продукта — страница claude.com/product/design у Anthropic; порядок работы описан в справке на support.claude.com.
Окно разделено на две части: слева идёт переписка, справа стоит холст. Вы пишете, что нужно, Claude собирает работу на холсте, вы смотрите на результат и уточняете следующим сообщением.
Claude design как пользоваться: порядок первого проекта
Первый проект собирают в таком порядке.
- Создайте проект и дайте ему имя.
- Импортируйте фирменное оформление, если системы организации ещё нет; опубликованную систему новый проект берёт сам.
- Добавьте контекст: снимки существующих экранов, изображения, готовые материалы, кодовую базу.
- Опишите задачу словами: что за работа, для каких экранов и что в ней важнее всего.
- Посмотрите, что собралось на холсте.
- Уточняйте — перепиской, комментариями к месту на холсте или правкой прямо на элементе.
- Экспортируйте результат или поделитесь ссылкой.
Разговор Claude начинает с вопросов о задаче. Он спрашивает, насколько подробным должен быть результат — вся страница целиком или только ключевые части, какое из ваших изображений поставить на первый экран, какое визуальное направление ближе. Ответы на эти вопросы уходят в работу вместе с самим заданием.
Что приносят в проект на вход
В проект кладут всё, на что Claude должен опираться:
- снимки существующих макетов, изображения и готовые материалы;
- колоду слайдов или документ, оформление которого нужно повторить;
- репозиторий кода — чтобы Claude видел готовые компоненты и правила оформления;
- файлы DOCX, PPTX и XLSX;
- элементы, захваченные прямо со своего сайта.
Изображения во всех этих перечнях стоят на входе: их приносит человек.
Как правят собранное: переписка, комментарии и холст
Править собранное можно тремя способами, и справка называет, когда какой к месту.
К этому блог Anthropic от 17 июня 2026 года добавляет ползунки-регуляторы: Claude сам выносит их к отступам и цвету, и значение меняют движением, а не отдельным сообщением.
Вернуться к прежнему направлению работы позволяет раздел справки «Управление версиями и редакциями». Вы просите Claude сохранить то, что уже собрано, и попробовать другой подход; Claude сохраняет текущий проект и называет место, где он лежит.
Дизайн система claude: собрать один раз и включить во все проекты
Настройке фирменного оформления Anthropic отвела отдельную статью справки. Система собирается однажды, а дальше её берут все проекты организации.
Исходным материалом может быть кодовая база с библиотекой компонентов, прототипы и снимки экранов, презентация или документ с фирменным оформлением — годятся даже PowerPoint и PDF. Отдельными файлами приносят логотипы, палитры цветов и образцы шрифтов. Из этого Claude собирает цветовую палитру, шрифты с размерами и начертаниями, компоненты — кнопки, карточки, элементы навигации — и правила раскладки: отступы, сетки, структуры страниц.
Готовую систему проверяют тестовым проектом, включают переключателем «Опубликовано», а правят кнопкой «Remix» в параметрах организации. Опубликованную систему новый проект наследует сам, и прикладывать её файлами не нужно. Собранный макет Claude сверяет с этой системой и сам правит расхождения.
Из ограничений справки — импорт дизайн-системы настолько хорош, насколько хорош его источник — следуют два правила работы с исходным материалом. Первое: из рабочего файла с макетами загружают не всё подряд, а выбранные страницы, потому что архивные и черновые экраны сбивают представление о системе. Второе: перенос компонентов Claude показывает по одному и просит подтвердить каждый, и на этом шаге обычно и находятся не те шрифты и не те начертания. Подтвердили — компонент уходит в систему; отправили на переделку — Claude собирает его заново по вашему замечанию.
Claude презентация: колода слайдов из чернового плана
Колоду слайдов собирают из чернового плана: вы рассказываете, о чём презентация, Claude выкладывает слайды на холсте в фирменном оформлении, а готовое забирают файлом PPTX или отправляют в Canva. Claude создание презентаций устроено так же, как работа над макетом: презентация в Claude Design — такой же проект, и отличается он только тем, что вы просите собрать.
Готовая колода бывает и на входе. Статья справки про дизайн-систему называет презентацию одним из материалов, по которым Claude разбирает фирменное оформление: вы приносите старую колоду, а новые собираются в её виде.
Иллюстрации и фоны к колоде остаются вашей частью работы. Про слайды Anthropic не называет ни числа слайдов, ни шаблонов, ни встроенной библиотеки иллюстраций. Картинки под слайды делают рисующей моделью и приносят файлами: что ставят на слайд и как держат один вид у всей серии, разобрано на страницах картинки для презентации и фон для презентации, а порядок сборки колоды целиком — на странице нейросеть презентация.
Готовую колоду забирают в PPTX и дорабатывают в том редакторе, который этот формат читает. Второй получатель — Canva, работа уходит туда прямо из окна экспорта. Третий — Gamma, сервис-сборщик презентаций, он тоже есть в официальном списке.
Claude создание сайта: страница, которую собирают разговором
Сайт через Claude собирают тем же порядком, что макет и колоду: проект, дизайн-система, задание словами, правка на холсте. Одностраничные сайты названы отдельным сценарием на продуктовой странице, в разделе маркетинговых материалов, а пример запроса про страницу стоит прямо в справке, среди хороших формулировок: «Создайте целевую страницу для нашего нового продукта API с героическим разделом, примерами кода и ценами». Готовую страницу выгружают отдельным HTML-файлом.
В сеть готовую страницу выводит внешний сервис: на продуктовой странице названы Vercel, Wix, Lovable и Replit. Ссылка самого Claude Design работает внутри организации, и анонс описывает три уровня доступа — закрытый документ, просмотр по ссылке внутри организации и право на правку.
Другой путь — передать страницу в Claude Code. Выгруженный HTML показывают в браузере, но проектом он ещё не стал: файловой структуры и серверной части в нём нет. В Claude Code страницу разбирают на файлы, дописывают и выкладывают обычным порядком.
Как сделать сайт на Claude так, чтобы он получился вашим, решает задание. В нём называют состав разделов сверху вниз — шапка, первый экран, блоки с содержанием, форма, подвал — и дают готовые тексты. Такое задание удобно писать в обычной переписке с Claude, а в Claude Design приносить уже файлом: это тот же контекст, что снимки и материалы. Картинку на первый экран и фоны в разделах вы тоже приносите свои; сравнение рисующих моделей по задачам собрано на странице нейросеть для картинок.
Экспорт: форматы и сервисы, куда уходит работа
Кнопка «Экспорт» стоит в правом верхнем углу проекта. Справка перечисляет форматы:
- скачать как .zip;
- экспортировать как PDF;
- экспортировать как PPTX;
- отправить в Canva;
- экспортировать как автономный HTML.
То, что должно уйти картинкой, готовят рисующей моделью заранее и ставят в макет как изображение: растрового вывода — PNG или JPG — в списке форматов нет.
Отдельным списком идут сервисы, которым Claude Design передаёт работу: Adobe, Base44, Canva, Gamma, Lovable, Miro, Replit, Vercel, Wix. В Claude Code работа уходит двумя способами — местному агенту и в Claude Code Web; набор для такой передачи Claude собирает сам.
Claude code дизайн: работа из терминала
Из Claude Code Claude Design доступен командами. Дизайн-систему подтягивает /design-sync. Сервер MCP подключается одной строкой:
claude mcp add --scope user --transport http claude-design https://api.anthropic.com/v1/design/mcpПосле этого вход выполняется командой /design-login. Что такое сервер MCP и как он устроен вообще, разобрано на странице Claude Code MCP, а навыки Claude Code — на странице Claude Code skills.
Из терминала собирают любой проект Claude Design. Колода слайдов и страница сайта устроены там так же, как макет, поэтому презентацию и сайт из Claude Code собирают тем же способом, а смотрят и правят собранное на холсте в браузере.
Связь между двумя инструментами двусторонняя. Прототип, начатый в Claude Code, синхронизируют в Claude Design и правят на холсте; работу из Claude Design передают обратно в Claude Code, когда пора собирать её в настоящий проект. В блоге Anthropic от 24 июля 2026 года разделение названо коротко: Claude Code — для кода, Claude Design — для остальных частей дизайнерской работы.
Тем, кто работает из терминала, кадры удобнее заказывать оттуда же. У GEN202 для этого есть навык: агент настраивает его один раз по описанию вызовов, а фраза подключения целиком приведена на странице навыка для агента.
Откуда берутся картинки для макета, слайда и первого экрана
Картинки для макета делают отдельно и приносят в проект файлом. Причину называет продуктовый дизайнер Anthropic, который делал Claude Design, в записи от 24 июля 2026 года: своей модели изображений у инструмента нет, он не сделан для генерации картинок и потому плохо подходит для разработки логотипа. Правильный путь там же назван прямо — принести логотип и материалы, которые у вас уже есть.
Отсюда простое разделение. График по вашим данным, диаграмма и анимация появляются в работе как её часть, потому что собраны кодом. Фотография, рисунок, фон и любой кадр, который должен выглядеть снятым или нарисованным, приходят готовым файлом.
Файл делают рисующей моделью. В GEN202 их четыре: Nano Banana 2, Nano Banana Pro, GPT Image 2 и Grok Imagine Image 2.0. Каждая рисует по описанию словами, а первые три ещё и переделывают приложенную картинку.
Grok Imagine Image 2.0 считается отдельно от этой таблицы: цена за картинку у неё одна на любой размер, и стоит эта цена на странице самой модели.
Списание идёт за каждый готовый кадр, и переделка считается новым кадром. Поэтому варианты перебирают на нижней ступени, а верхнюю включают для того кадра, который встанет в макет.
Знак для компании — тот самый случай, о котором предупреждает Anthropic. Его делают отдельно и приносят в проект готовым; как собрать знак и что с ним делают дальше, показано на странице нейросеть логотип. Остальные задачи дизайнера — рекламный кадр, обложка, фон, единый вид у серии картинок — собраны на странице нейросети для дизайнеров. Что Claude делает с изображениями в обычной переписке, разобрано отдельно: Claude картинки.
Готовый файл попадает в проект Claude Design как загруженное изображение — тем же способом, каким справка предлагает давать любой другой контекст.
Что сказать Claude, чтобы он собрал нужное
Советы справки Anthropic сводятся к шести пунктам:
- начинайте с простого макета и усложняйте его шагами, а не описывайте всю работу одним сообщением;
- правку называйте числом — конкретным размером или отступом, а не общим замечанием, что выглядит неправильно;
- компонент своей дизайн-системы называйте по имени, тогда Claude возьмёт именно его;
- сразу говорите, для каких экранов делается работа;
- просите два-три варианта сразу, пока направление не выбрано;
- попросите Claude разобрать собранный макет на доступность, контрастность и иерархию — это отдельная работа, и он делает её по просьбе.
Известные ограничения Claude Design
Свои ограничения Anthropic перечисляет в справке отдельным разделом:
- Claude Design работает только в веб-версии и на рабочем столе;
- встроенные комментарии иногда не показываются на самой странице, и тогда их смотрят в отдельном представлении;
- очень большой репозиторий лучше связывать из Claude Code: в браузере он даёт задержки и сбои;
- ошибка подключения лечится новой вкладкой в том же проекте;
- одновременная правка одного проекта двумя людьми работает ненадёжно;
- импорт дизайн-системы настолько хорош, насколько хорош его источник.
Что вы дописываете после Claude
Собранная страница повторяет то, что вы дали, и достраивает остальное своими решениями. Если продукт не показан снимками, Claude нарисует условные картинки по смыслу названия, и с настоящим видом продукта они не совпадут. Тексты в такой ситуации он тоже пишет сам, и написанное расходится с тем, как вы обычно рассказываете о своей работе.
Числа и цены появляются на странице тем же порядком. Если в задании их не было, они всё равно окажутся в макете, и перечитывать их надо отдельно от остального текста.
Значки и цвета, придуманные на ходу, иногда выпадают из палитры: на синей странице появляется зелёный значок. Соседние элементы наезжают друг на друга. И то и другое правится на месте: обвели область, сказали, что не так, получили исправление.
Формы на собранной странице выглядят готовыми, но отправку к ним подключают отдельно — это работа уже за пределами Claude Design.
Правило здесь одно: результат определяется исходными данными, а не длиной запроса. Задание с описанием продукта, снимками, готовыми материалами и фирменным оформлением даёт страницу, которую остаётся довести. Запрос из одной фразы даёт вид, в котором Claude придумал за вас всё, чего вы не сказали.
Сколько стоит Claude Design и на каких тарифах он открыт
Claude Design входит в подписку Claude и оплачивается вместе с ней. Справка называет планы, на которых он открыт: Pro, Max, Team и Enterprise. На Enterprise он выключен по умолчанию, и включает его администратор в параметрах организации. Все четыре плана платные, поэтому работа начинается после оплаты подписки; как её оплачивают из России, разобрано на странице оплата Claude.
Лимиты у Claude Design общие с чатом, Claude Code и Cowork, а прежний отдельный недельный лимит для него отменён. Когда лимит израсходован, Claude Design недоступен до сброса; если в организации включены кредиты использования, работа продолжается на них. Что именно расходуется и как это считается, разобрано на странице лимиты Claude.
Готовые изображения считаются отдельно от подписки: их делает рисующая модель, и счёт идёт за каждый кадр.
Частые вопросы
Как сделать презентацию в Claude Design?
Создайте проект и опишите задачу словами: о чём презентация, для кого и что важнее показать. Claude уточнит вопросами недостающее и выложит слайды на холсте в фирменном оформлении организации. Дальше их правят перепиской, комментариями к отдельному месту и рукой на холсте, а готовую колоду выгружают в PPTX или отправляют в Canva.
Что нужно Claude, чтобы собрать колоду слайдов?
Хватает рассказа о задаче своими словами: Claude начинает работу с вопросов и достраивает остальное сам. Готовая колода может быть и на входе — тогда Claude разбирает по ней фирменное оформление и собирает новые слайды в том же виде. Чем подробнее исходные данные, тем меньше он придумывает за вас.
Можно ли собрать в Claude Design логотип?
Anthropic отвечает на этот вопрос прямо: логотип лучше принести готовым, а Claude Design сделан для другой работы. Сам знак делают рисующей моделью — порядок работы, готовые описания и перевод знака в вектор разобраны на странице нейросеть логотип. Готовый файл кладут в дизайн-систему вместе с палитрой и шрифтами, после чего он попадает во все проекты организации.
Как выложить в интернет страницу, собранную в Claude Design?
Наружу страница уходит через внешний сервис — на продуктовой странице названы Vercel, Wix, Lovable и Replit. Ссылка из самого Claude Design открывается внутри организации и даёт три уровня доступа. Другой путь — выгрузить автономный HTML и передать работу в Claude Code, чтобы довести её до настоящего проекта.
На каких тарифах открыт Claude Design и есть ли отдельная плата?
Инструмент входит в подписку и оплачивается вместе с ней, а открыт он на планах Pro, Max, Team и Enterprise; на Enterprise его включает администратор организации. Расход у него общий с чатом, Claude Code и Cowork, и считается он в одном лимите. Как устроен счёт лимитов, разобрано на странице лимиты Claude.
Где взять картинку и фон под слайд и сколько это стоит?
Кадр заказывают у рисующей модели по описанию словами и приносят файлом в проект. У Nano Banana 2 нижняя ступень качества стоит 7,2 ₽, верхняя — 14,4 ₽. Что ставят на слайд и как держат один вид у серии, показано на страницах картинки для презентации и фон для презентации, а сравнение моделей по задачам — на странице нейросеть для картинок.
Как подключить Claude Design к Claude Code — нужен ли плагин?
Подключение идёт через сервер MCP: его добавляют одной командой, после чего вход выполняется командой /design-login, а дизайн-систему подтягивает /design-sync. Что такое сервер MCP, разобрано на странице Claude Code MCP, а навыки, которыми расширяют самого агента, — на странице Claude Code skills.