Артефакты: документы, прототипы, интерфейсы

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

Что такое артефакт

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

Артефакты доступны на всех планах и во всех приложениях: сайт, десктоп, Cowork, Claude Code.

Какие бывают артефакты

Документы. Текст в формате Markdown: техническое задание, протокол, план, статья. Отличие от текста в чате — редактирование: можно выделить абзац и попросить переписать только его, не трогая остальное.

Код. Файл на любом языке с подсветкой. Для разработчиков — очевидно; для остальных — скрипт для обработки таблицы, формула, SQL-запрос, который можно скопировать целиком.

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

Векторная графика. SVG-иконки, простые иллюстрации, схематичные макеты.

Веб-страницы и интерактивные компоненты. Самое интересное. Claude может собрать работающую HTML-страницу или React-компонент: форму с валидацией, калькулятор, таблицу с сортировкой, прототип экрана с переходами. Это запускается прямо в панели, и с ним можно взаимодействовать.

Прототип за один разговор

Разберём сценарий, который в Amiga случается постоянно: нужно показать клиенту идею экрана, а макета в Figma ещё нет.

Дизайнер или аналитик пишет: «Собери интерактивный прототип формы записи на обслуживание автомобиля. Поля: марка (выбор из списка), госномер, дата и время (только рабочие часы), описание проблемы. Кнопка „Записаться“ ведёт на экран подтверждения с итогом. Стиль — нейтральный, крупные поля, для телефона».

Claude собирает React-компонент, который открывается в панели. Его можно потрогать: выбрать марку, ввести номер, увидеть ошибку валидации, нажать кнопку и перейти на экран подтверждения. Дальше — итерации в чате: «сделай выбор даты календарём», «добавь шаг с выбором филиала перед датой», «подсвети обязательные поля».

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

Тот же приём для аналитика: «Собери интерактивную схему статусов заказа с переходами; при клике на переход показывай, кто его инициирует и какие уведомления уходят». Для менеджера: «Сделай калькулятор стоимости проекта по нашей модели: часы по ролям, ставки, коэффициент риска».

Как править артефакт

Три способа, от грубого к тонкому.

Через чат. «Перепиши раздел „Риски“ короче», «замени синий на серый», «добавь колонку „Ответственный“». Claude создаёт новую версию артефакта.

Точечно. В документах можно выделить фрагмент текста и попросить изменить именно его. Это быстрее, чем объяснять словами, где что.

Руками. Артефакт можно редактировать прямо в панели — поправить опечатку, переставить пункт — без обращения к модели.

Каждое изменение сохраняется как версия. Между версиями можно переключаться: если правка ухудшила результат, вернитесь назад. Это снимает страх «а вдруг сломается» и позволяет экспериментировать свободнее.

Публикация и совместная работа

Артефакт можно опубликовать — он получает ссылку, по которой его откроет любой, у кого она есть, без аккаунта. На корпоративных планах можно ограничить доступ организацией. Опубликованный прототип можно показать клиенту, документ — отправить коллеге, код — вставить в тикет.

Опубликованный артефакт можно взять за основу для своего: скопировать код и продолжить работу в своём чате. Так в команде накапливаются заготовки: типовой прототип формы, шаблон отчёта, калькулятор.

Отдельный вид — артефакты, которые сами обращаются к Claude. Например, интерактивный помощник «вставь текст письма — получи три варианта ответа». Такой артефакт вызывает модель из своего кода, а расходуется лимит того, кто им пользуется, а не автора. Это способ собрать простой внутренний инструмент без разработки и сервера.

Границы

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

Второе ограничение — то же, что у любого ответа модели: содержимое надо проверять. Схема процесса будет ровно такой, как вы описали, включая ошибки в описании. Документ может уверенно содержать выдуманную деталь. Артефакт удобен, но не более достоверен, чем текст в чате.

→

Попробуйте сами

10–15 мин на рабочем месте

1. Опишите Claude экран или форму из вашего текущего проекта и попросите интерактивный прототип. Сделайте три итерации через чат. Оцените, насколько быстро получилось что-то, что можно показать.
2. Попросите документ-артефакт — например, план тестирования или структуру ТЗ. Выделите один раздел и попросите переписать только его. Затем переключитесь на предыдущую версию и сравните.
3. Опишите словами бизнес-процесс (согласование заявки, выпуск релиза) и попросите диаграмму. Проверьте, все ли шаги на месте, — и заметьте, где ошибка была в вашем описании, а где в результате.

Коротко

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