Что получишь
Гайд · Даниил Шишко
Восемь приёмов от брифа до прототипа и готовая инструкция, с которой агент поможет пройти весь процесс.
О гайде
Я разложил свой процесс от брифа до прототипа на восемь этапов. Для каждого выбрал один приём, который можно сразу попробовать на своей задаче.
В каждом приёме — два-три действия, готовый запрос агенту и описание результата. Копируешь запрос, подставляешь свою задачу и отправляешь. В конце этапа объясняю, для чего этого приёма достаточно, а где понадобится больше подготовки.
В конце гайда есть скилл — готовая инструкция для агента. В ней собраны все восемь этапов: что делать, когда спросить твоё мнение и как проверить результат. Подключаешь её и проходишь процесс вместе с агентом.
Для запросов из гайда подойдут ChatGPT, Claude или Codex. Здесь я называю агентом AI-помощника, которому ты поручаешь задачу и даёшь материалы для работы.
Удобнее проходить этапы в одном чате или проекте: тогда у агента под рукой будут бриф, разбор конкурентов и остальные результаты. Но каждый приём можно использовать отдельно. Начинай с того этапа, на котором у тебя больше всего рутины.
Почему так
Если описать только результат, агент сам решит, как к нему прийти. Заполнит пробелы своими предположениями — и они могут не совпасть с тем, что ты имел в виду. Отсюда правки по кругу и разный результат на похожих задачах.
Поэтому в запросах ниже указан порядок действий. Сначала агент разбирается в задаче, затем показывает промежуточный результат. Там, где нужно твоё решение, он останавливается и ждёт ответа.
Так, как она пришла от заказчика или из таск-трекера. Специально готовить описание не нужно.
Сначала о продукте и пользователях, затем о деталях и ограничениях. Его задача — помочь разобраться, а не сразу предложить решение.
Запрос для агента
Я дизайнер. Моя задача: [одна строка]. Пока не предлагай решений — помоги собрать бриф. Задавай вопросы от общего к частному: что за продукт и для кого, как люди решают эту задачу сейчас, какие есть ограничения и как мы поймём, что всё получилось. Задавай не больше трёх вопросов за раз. Если я не знаю ответа, добавляй вопрос в список «Вопросы заказчику». Не придумывай ответ за меня. В конце собери бриф из моих ответов и отдельный список вопросов заказчику.
Обычно хватает нескольких раундов. Если агент начал предлагать решения раньше времени, верни его к вопросам.
Что получишь
Где потолок. Бриф пока остаётся в переписке. Если работаешь с агентом в папке проекта, сохрани его отдельным файлом и указывай на него в следующих задачах. Так агенту будет проще опираться на договорённости. На курсе мы выстраиваем весь процесс с такими файлами.
Сравнивай один и тот же шаг: например, регистрацию или оформление заказа. Так будет понятно, как разные продукты решают одну задачу.
Что помогает пользователю и стоит взять, что мешает и почему.
Запрос для агента
Вот экраны конкурентов на шаге [каком]. Разбери каждый экран: что помогает пользователю и стоит взять в наш продукт, что мешает и чего лучше избегать. Объясни причины. В конце предложи три решения для нашего продукта и объясни, чем каждое полезно.
Что получишь
Где потолок. Здесь мы разбираем один шаг. Чтобы сравнить продукты целиком, понадобятся общие критерии оценки и источники, на которые можно опереться. Такое исследование собираем на курсе.
Возьми описание из брифа: кто этот человек, чем занят и с какими проблемами сталкивается.
Запрос для агента
Сыграй пользователя из брифа: [кто это]. Я проведу с тобой интервью. Отвечай естественно: можешь сомневаться, путаться и давать короткие ответы. Когда я напишу «стоп», выйди из роли и разбери мои вопросы. Покажи, какие вопросы подсказывали желаемый ответ, и предложи, как их переформулировать.
Задавай вопросы по одному, как в разговоре с человеком.
Агент покажет, где формулировка подталкивала собеседника к определённому ответу, и предложит более нейтральный вариант.
Что получишь
Где потолок. Ответы агента не заменяют исследование с реальными пользователями. Это репетиция твоих вопросов, которая помогает лучше подготовиться к разговору.
От первого входа до результата, ради которого человек пришёл в продукт.
Запрос для агента
По нашему брифу опиши основной сценарий пользователя: от первого входа до результата. Разбей его на шаги. Добавь ситуации, когда что-то идёт иначе: ошибка, пустой список, возврат назад, первый вход, когда данных ещё нет. Составь список экранов и их состояний. Для каждого укажи, на каком шаге он нужен и что помогает сделать пользователю.
Что увидит человек при ошибке? Куда вернётся по кнопке «Назад»? Что будет на экране, пока данных нет? Именно в таких ситуациях обычно и обнаруживаются забытые экраны.
Что получишь
Где потолок. Без брифа агент предложит привычный набор экранов для похожего продукта. Чем подробнее вы разобрали задачу на первом этапе, тем точнее будет список.
Выбери экран своего продукта, на который стоит ориентироваться. Можно прислать скриншот.
Сетка, отступы, шрифты, цвета, акценты, устройство карточек и кнопок. Проверь описание до того, как агент начнёт собирать новый экран.
Запрос для агента
Вот эталонный экран нашего продукта. Сначала опиши правила его оформления: сетку, отступы, шрифты и размеры текста, цвета, акценты, устройство карточек и кнопок. Покажи мне эти правила и дождись моего «ок». Только после этого собери экран [какой] по согласованным правилам.
Если что-то выбивается из стиля, покажи агенту конкретное расхождение: например, другой размер заголовка или отступ между карточками.
Что получишь
Где потолок. Одного эталона может хватить для отдельного экрана. Для сорока экранов нужна дизайн-система: общие компоненты и правила, к которым агент обращается при сборке. Её создаём на курсе. Если результат выглядит шаблонно, загляни в гайд «Как убрать AI-слоп из дизайна».
Приложи скриншот или опиши экран словами. Укажи, какую задачу пользователь здесь решает.
Заголовок, кнопки, подсказки, сообщения об ошибках и тексты для случаев, когда данных ещё нет.
Запрос для агента
Вот экран: [скриншот или описание]. Здесь пользователь [что делает]. Напиши все тексты для этого экрана: заголовок, кнопки, подсказки, сообщения об ошибках и тексты для пустых состояний. Используй понятные пользователю слова. В тексте кнопки называй действие. В сообщении об ошибке объясняй, что случилось и что делать дальше. Если сомневаешься в формулировке, предложи два варианта.
Что получишь
Где потолок. Если не описать тон продукта, агент выберет его сам. Чтобы тексты звучали одинаково на всех экранах, один раз запиши правила тона и передавай их вместе с задачей.
Что изображено, какое окружение, свет, фактура, палитра и композиция. Агент поможет собрать это описание в JSON — текстовый формат, где у каждого параметра есть своё название и значение. Писать его вручную не нужно.
Запрос для агента
Подготовь шаблон запроса для генератора картинок в формате JSON. Отдельно опиши параметры: объект, окружение, свет, фактура, палитра, композиция и ракурс. Заполни шаблон под наш стиль: [опиши стиль или приложи пример]. Затем сделай пять вариантов. В каждом меняй только объект из этого списка: [список объектов]. Остальные параметры оставь одинаковыми.
Используй полученные варианты для генерации картинок. Свет, фактуру и палитру оставляй прежними: они помогают сохранить общий стиль серии.
Что получишь
Где потолок. Одинаковое описание уменьшает различия между картинками, но не убирает их полностью. Для более стабильного результата нужны процессы генерации, собранные из связанных блоков: каждый отвечает за свой шаг и настройки. Их называют нодовыми пайплайнами, и на курсе мы разбираем, как их собрать.
Передай готовые экраны. Попроси связать их по основному сценарию и добавить состояния кнопок и полей: например, нажатие, недоступную кнопку или ошибку ввода.
Запрос для агента
Собери из этих экранов кликабельный прототип, который открывается в браузере. Свяжи экраны по основному сценарию пользователя и добавь состояния кнопок и полей. Дальше я буду присылать скриншоты с пометками, что нужно исправить. Меняй только отмеченные места, остальное оставляй как есть.
От начала до конца, как пользователь: нажимай кнопки, заполняй поля, переходи между экранами.
Обведи нужное место и одной фразой объясни, что исправить.
Что получишь
Где потолок. Указание «меняй только отмеченное» помогает удержать правки в нужных границах. Как опубликовать прототип по ссылке и подключить аналитику, чтобы видеть, где пользователи застревают, показываем на курсе.
Скилл — это папка с инструкцией для агента. В приложениях, которые поддерживают скиллы, агент может использовать её для подходящей задачи. Внутри этого скилла описано, что делать на каждом этапе, когда остановиться и дождаться твоего решения и как проверить результат.
Пишешь «Начнём с брифа» — и агент начинает задавать вопросы по инструкции.
Что в архиве
Как поставить
Внутри папка design-process-map с файлами SKILL.md и README.md. Для приложения Claude архив распаковывать не нужно.
Claude Code: распакуй архив и положи папку design-process-map в .claude/skills внутри своего проекта. Итоговый путь: .claude/skills/design-process-map/SKILL.md. Codex: положи эту же папку в .agents/skills внутри проекта. Итоговый путь: .agents/skills/design-process-map/SKILL.md. Приложение Claude: открой Customize → Skills → Upload a skill и загрузи ZIP-архив. ChatGPT: используй файл как инструкцию в чате. Распакуй архив, прикрепи SKILL.md к сообщению и напиши: «Работай по этому файлу».
Если не укажешь этап, агент покажет карту процесса и спросит, с чего начать.
Запрос для агента
Начнём с брифа: [задача одной строкой].
Скилл задаёт порядок работы. Решения на каждом этапе принимаешь ты.
Бонус
Вопросы
Курс
Это моя полная программа по работе с агентами в дизайне. На ней проходим весь путь: от задачи в три строчки до работающего прототипа. Его можно открыть по ссылке и посмотреть по данным аналитики, как им пользуются люди.
01
02
03
04
Промокод
PROCESSMAP39
Тем, кто дочитал до конца, дарю промокод на скидку 39%. Смотри программу и бронируй место.