Как написать user flow для нейросети без додумывания логики

User flow для нейросети описывает путь пользователя по экранам: с чего он начинает, что нажимает, куда попадает и что видит, когда что-то идет не так. Вы пишете его до генерации, отдаете AI-агенту как техзадание, и агент строит ровно те экраны, которые вы заложили. Не те, что придумал сам. Ниже разберем, как составить такой user flow экран за экраном, с развилками, ошибками и пустыми состояниями, и дадим готовый промпт под копирование.

TL;DR. User flow для AI-агента — это пронумерованная карта экранов и переходов с обязательным описанием ошибок и пустых состояний. Опишите путь текстом, сохраните в MD-файл проекта, сошлитесь на него в промпте. Тогда нейросеть достраивает не логику, а только пиксели. Экономит 2-3 итерации переделок на каждой фиче.

Правила проверены на реальных сборках в Claude Code, Cursor и Lovable.

Почему нейросеть додумывает логику без user flow?

Без явного пути агент заполняет пробелы своими предположениями: рисует экраны, которых вы не просили, и пропускает состояния, о которых вы не сказали.

Модель не читает мысли. Она достраивает недостающие связи по паттернам из обучения, и в 8 случаях из 10 это будет не ваш сценарий. Опишете «форму регистрации» без деталей → получите поля, валидацию и редирект на своё усмотрение. Отдадите пронумерованный путь → агент соберет именно его. Разрыв между тем, что вы держите в голове, и тем, что видит нейросеть, закрывается одним документом.

Причина простая. Агент работает как строитель, а вы как архитектор. Строитель заливает фундамент там, где начерчено. Нет чертежа → он ставит стены по памяти о тысяче других домов. Пользовательский сценарий для нейросети и есть этот чертеж: он фиксирует, какие экраны существуют, какие ветки доступны и где путь заканчивается.

Есть нюанс. Чем сложнее продукт, тем дороже додумывание. На кнопке «изменить цвет» цена ошибки ноль. На флоу оплаты она в переделанном чекауте и потерянных заявках.

Чем user flow отличается от user journey и ТЗ?

User flow — это последовательность конкретных экранов и решений внутри одной задачи. User journey шире: эмоции и точки контакта на всем пути клиента. ТЗ описывает требования, но не рисует движение.

Эти три вещи путают постоянно, а для промпта разница критична. User journey отвечает на вопрос «что человек чувствует и где встречает бренд». User flow отвечает на вопрос «на какой экран он попадет после нажатия». Nielsen Norman Group разводит их по уровню детализации: journey — холистический путь через каналы и время, flow — набор дискретных взаимодействий внутри продукта.

Для нейросети вам нужен именно flow. Он дискретный, его легко разбить на шаги, и каждый шаг превращается в экран. Journey слишком абстрактен → агент из него ничего не соберет.

Из чего состоит user flow для AI-агента?

Минимальный набор: точка входа, экраны-действия, развилки-решения, ошибки, пустые состояния и точка выхода. Каждый элемент имеет свою форму по стандарту ISO 5807.

Классический user flow рисуют блок-схемой, и формы там не декоративные. Овал → старт или финиш. Прямоугольник → действие или экран. Ромб → развилка, где путь делится по условию. Параллелограмм → ввод или вывод данных. Стрелки → направление. Этот набор из пяти форм по стандарту ISO 5807 понимают и дизайнеры, и разработчики, и нейросеть.

Для агента формы можно не рисовать, а называть словами. «Экран», «развилка», «ошибка», «пустое состояние». Главное — не логика картинки, а полнота. Пропустили ветку «пользователь не залогинен» → агент либо забудет её, либо придумает поведение сам.

Как написать user flow для нейросети по шагам?

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

Готового флоу «на всё сразу» не бывает. Одна цель → одна схема. Хотите охватить и оплату, и регистрацию → это два отдельных user flow. Так советуют и UX-практики: пользовательский сценарий строят на ранней стадии, до прототипов, вокруг одной задачи. Дальше по шагам.

Шаг 1. Как задать одну цель и точку входа?

Начните с финиша. Что считается успехом: оплаченный заказ, сохранённый файл, подтверждённый вход. Затем откуда человек стартует: главная, ссылка из письма, результат поиска. Одна цель держит флоу читаемым. Две цели в одной схеме → ветки становятся нечитаемыми уже на втором персонаже.

Формулируйте цель действием пользователя, не фичей продукта. «Пользователь бронирует столик», а не «система показывает форму брони».

Шаг 2. Как разложить путь на экраны?

Идите линейно от входа к цели и называйте каждый экран отглагольно. «Видит каталог» → «открывает карточку» → «жмёт купить» → «вводит данные» → «видит подтверждение». Один экран — один блок, одно действие. Если на экране три разных действия, разбейте на три блока.

Держите блоки крупными. Абстрагируйтесь от того, как работает база данных или API. Агенту в user flow нужен путь глазами человека, техника прописывается отдельно.

Шаг 3. Как добавить развилки и альтернативные ветки?

Ромб — это вопрос с ответами «да» и «нет». «Товар в наличии? Да → в корзину. Нет → предложить аналог». Каждая развилка порождает минимум две стрелки, и обе надо довести до конца. Оборванная ветка → место, где агент додумает поведение.

Отказные ветки прописывайте так же тщательно, как основную. Пользователь отклонил оффер → куда он попадает: назад в список, к другому варианту или в конец сценария. Три разных исхода, три стрелки.

Шаг 4. Как описать ошибки и пустые состояния?

Здесь ломается 90% сгенерированных интерфейсов. Основной путь агент собирает нормально, а «что если пусто» и «что если ошибка» пропускает. Пройдите по каждому экрану и задайте два вопроса. Что видит человек, когда данных ещё нет. Что видит, когда действие провалилось.

Пустое состояние: корзина пуста, список избранного пуст, поиск без результатов. Ошибка: нет сети, неверный пароль, оплата отклонена, файл не загрузился. Каждое такое состояние — отдельный блок в схеме.

Шаг 5. Как сохранить flow, чтобы агент на него опирался?

Опишите весь путь текстом как пронумерованный список и сохраните в файл user-flow.md внутри проекта. Затем в промпте на генерацию сошлитесь на него: «строй строго по user-flow.md, не добавляй экранов от себя». Мы в VibeCoderz так делаем на всех новых сборках. Агент перечитывает файл на каждой итерации и перестаёт дрейфовать.

Именно этот приём закрывает додумывание. Логика лежит в документе, а не в оперативной памяти модели, которая обнуляется между запросами.

Готовый промпт для user flow, после которого агент не додумывает

Один промпт превращает ваше устное описание в структурированный user flow с ошибками и пустыми состояниями. Копируете, подставляете задачу, получаете файл, по которому агент строит без импровизации.

Промпт работает в два прохода. Сначала нейросеть формализует ваш путь, потом строит по нему. За счёт разделения агент не смешивает «придумать логику» и «сверстать экран». По нашим сборкам это снимает 2-3 круга переделок на средней фиче.

Промпт для генерации user flow (проход 1):

Ты продуктовый аналитик. Составь user flow для задачи ниже.

Задача: [опиши цель одним предложением, например: пользователь
оплачивает подписку с карты].
Точка входа: [откуда стартует пользователь].
Роли: [кто проходит путь, например: гость и залогиненный].

Требования к результату:
1. Пронумерованный список экранов от входа до цели.
2. Для каждого экрана: действие пользователя и что он видит.
3. Все развилки в формате «условие → ветка А / ветка Б».
4. Отдельным блоком для КАЖДОГО экрана: пустое состояние
   и состояние ошибки.
5. Не описывай базу данных, API и валидацию.
6. Не добавляй экранов, которых нет в задаче.

Формат вывода: markdown, готовый к сохранению в user-flow.md.

Промпт для сборки (проход 2):

Построй интерфейс строго по файлу user-flow.md.
Не добавляй экранов и переходов, которых нет в файле.
Реализуй ВСЕ пустые состояния и ошибки из флоу.
Если в файле есть пробел или противоречие — спроси,
не додумывай.

Лайфхак: добавьте в первый промпт строку «используй разные пометки для комментариев, вопросов и идей». Тогда нейросеть не молча закроет спорные места, а вынесет их вопросами, и вы поймаете дыры в логике до генерации.

Максим: «Веб-версию GoBanana я собрал за 3 часа после выхода модели. Секрет не в скорости печати. Сначала прогнал весь путь пользователя по экранам, а потом дал агенту строить. Сделал — получил цифру: 6-8 часов на весь продукт, который принёс 12 млн рублей.»

Какие ошибки убивают user flow для нейросети?

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

Первая ошибка — тащить в флоу базу данных и API. Схема разрастается, агент тонет в деталях и теряет главный путь. Держите технику в отдельном документе, а в user flow оставляйте только то, что видит и делает человек.

Вторая — рисовать только счастливый путь. «Всё прошло хорошо» агент соберёт и без вас. Ценность флоу в ветках «пусто», «ошибка», «отказ». Их и прописывайте детальнее всего.

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

Если тема пересекается с вашей нишей, посмотрите готовые сценарии в каталоге AI-агентов — там разложены типовые пути под разные профессии и задачи.

Чем рисовать и куда скармливать готовый flow?

Для черновика хватит текста в MD-файле. Для визуальной схемы берут Figma, Miro или Whimsical. Скармливать флоу можно любому агенту: Cursor, Claude Code, Lovable, Bolt.

Рисовать схему необязательно. Нейросети достаточно текстового флоу, а картинку вы делаете для себя и команды. Если нужна визуализация, подойдёт связка Figma и FigJam для дизайн-команд, Miro для воркшопов, Whimsical для быстрых блок-схем.

Дальше выбираете инструмент под сборку. Для точной вёрстки по флоу хорошо заходит Claude Code на высоком уровне усилия. Для быстрого прототипа с UI — Lovable или Bolt. Если пишете в редакторе, Cursor читает user-flow.md через @-упоминание файла.

Полный список инструментов лежит в каталоге AI IDE.

FAQ

Что такое user flow простыми словами? Это карта шагов, которые человек проходит в продукте, чтобы сделать одно дело: оплатить, зарегистрироваться, скачать файл. Рисуется блоками и стрелками. Показывает, какие экраны нужны и куда ведёт каждая кнопка ещё до дизайна и кода.

Зачем писать user flow для нейросети, если можно просто описать задачу? Потому что на короткое описание агент достраивает недостающую логику по своим паттернам. Пронумерованный флоу с ошибками и пустыми состояниями убирает пространство для догадок. Агент строит ваш сценарий, а не усреднённый из обучающих данных.

Как заставить AI-агента не добавлять лишние экраны? Сохраните флоу в файл и в промпте на сборку напишите: «строй строго по user-flow.md, не добавляй экранов от себя, при пробеле спрашивай». Модель перечитывает файл на каждой итерации и держится рамок.

Чем user flow отличается от ТЗ? ТЗ перечисляет требования и ограничения. User flow рисует движение: экран за экраном, с развилками. Для генерации интерфейса нейросети нужен именно flow, а ТЗ идёт дополнением с техническими деталями.

Обязательно ли рисовать схему или хватит текста? Для нейросети хватит текста. Пронумерованный список экранов и переходов в MD-файле агент читает лучше картинки. Схему в Figma или Miro делают для команды и презентаций, а не для промпта.

Что писать в пустых состояниях и ошибках? Для пустого: что видит человек, когда данных ещё нет (пустая корзина, поиск без результатов). Для ошибки: нет сети, неверный пароль, оплата отклонена. Каждое состояние — отдельный блок с текстом и следующим действием.

С какой нейросети начать сборку по флоу? Возьмите универсальную модель уровня Claude Opus 4.8 или Gemini 3.1 Pro для UI, а для быстрого прототипа — Lovable или Bolt. Флоу читается всеми одинаково, разница только в качестве вёрстки и цене токенов.

Глоссарий

User flow — карта экранов, действий и решений, которые пользователь проходит ради одной цели внутри продукта.

User journey — более широкий путь клиента с эмоциями и точками контакта, от знакомства с продуктом до повторного использования.

Развилка (decision) — точка, где путь делится по условию на две ветки и больше. На схеме обозначается ромбом.

Пустое состояние (empty state) — экран, когда данных ещё нет: пустая корзина, лента без записей, поиск без результатов.

Edge-состояние — редкий сценарий на границе логики: ошибка сети, отклонённая оплата, действие без прав.

ISO 5807 — стандарт форм блок-схем: овал для старта и финиша, прямоугольник для действий, ромб для развилок.

Точка входа (entry point) — место, откуда пользователь начинает путь: главная, пуш, ссылка из письма, результат поиска.

Что дальше

Соберите первый user flow на любой мелкой задаче: форма подписки или экран входа. Прогоните через промпт выше, сохраните в user-flow.md, отдайте агенту. Сравните результат с тем, что модель собирала «на глаз». Разница в количестве переделок станет заметна на первой же фиче.

Разбор конкретных инструментов под сборку → в каталоге AI IDE на VibeCoderz. Если хотите выстроить процесс под свой продукт и не терять итерации на переделках, запишитесь на консультацию к Максиму.

Материал команды VibeCoderz. Обновлено: июль 2026.