UX
Пользовательские сценарии и CJM
Пользовательский сценарий (user scenario) — это краткое описание конкретной жизненной ситуации, в которой персона использует продукт или сервис для достижения своей цели.
Пользовательские сценарии
Это не техническое описание действий, а живая история, в которой показано, как, зачем и с какими трудностями пользователь взаимодействует с продуктом.
Живая история
Зачем нужен сценарий?
  • Вжиться в роль пользователя
  • Понять контекст использования (время, место, настроение, окружение)
  • Выявить болевые точки — моменты, когда пользователь может запутаться, разозлиться или бросить процесс
  • Основать проектные решения не на фантазиях, а на реальном поведении
  1. Кто — персона (имя, профессия, ключевая характеристика)
  2. Контекст — где и в какой ситуации всё происходит
  3. Цель — что пользователь хочет сделать
  4. Действия — какие шаги он предпринимает
  5. Проблемы / барьеры — с чем сталкивается на пути
Структура пользовательского сценария
Имя: Олег, 35 лет, водитель такси
Контекст: стоит в пробке между заказами, ищет место поесть
Цель: найти ближайшее кафе с доступной парковкой

Сценарий:
Олег стоит в пробке, голоден и раздражён. Он берёт телефон, открывает Google Maps, пытается найти кафе рядом, но видит только модные рестораны с плохими отзывами. Затем он переходит в CafeRadar, смотрит на парковку, но приложение долго грузится. Он сдается и заезжает на заправку.
Пример
сценария
Контекст важен (голод, дорога, мало времени)
Олегу не нужен ресторан, ему важно удобство и простота
Интерфейс карт не учитывает цель Олега — поесть и не нарушить ПДД
Какие мы делаем выводы:
UX-дизайнер работает с персонами, мотивацией, контекстом и эмоциями. Он пишет не техническую инструкцию, а живую историю: кто пользователь, что он хочет сделать, в какой ситуации, что чувствует, какие возникают препятствия.

Это работа становиться основой для создания User-Flow. User Flow — это визуальное представление пошагового пути, который пользователь проходит в интерфейсе, чтобы достичь конкретной цели. Это схема, показывающая, через какие экраны, действия и решения проходит пользователь: от входа до целевого результата (например, регистрации, покупки, бронирования)..
Сценарий ➡️ User-Flow
Диаграмма, блок-схема
Что делает пользователь (где кликает, куда идёт)
Формальный, техничный
[Главный экран] ↓ [Выбрать ресторан] ↓ [Добавить блюдо в корзину] ↓ [Оформить заказ] ↓ [Оплата] ↓ [Экран благодарности]
User Flow
Сценарий
История, рассказ
Поведение и чувства пользователя
Человеческий, эмоциональный
«Олег стоит в пробке...»
Формат
Фокус
Язык
Пример
Разница между сценарием и User Flow
Use Case (структура):
Название: Заказ такси
Актор: Пользователь
Предусловие: Авторизация выполнена
Основной поток:
  1. Открывает приложение
  2. Главный экран
  3. Выбор точки назначения
  4. Выбор типа машины
  5. Подтверждение заказа
Постусловие: Ожидание заказа
UX-сценарий (вводный текст):
Пользователь хочет быстро заказать такси ночью. Он открывает приложение, вводит адрес, но запутался из-за нового интерфейса.
Трансформация:
Cценарий → User flow📘
Перед проектированием интерфейса (Wireframes/UX UI)
На основе User Flow проектируются конкретные экраны

Решается:
  • Сколько шагов нужно?
  • Какие точки входа?
  • Где пользователь может запутаться?

Это каркас логики — на его основе рождаются скрины.
Когда создаётся User Flow?
Ориентируйся на персону – сценарий должен быть логичным именно для неё.
Добавь реалистичные детали – погода, устройство, настроение, внешние обстоятельства.
Опиши препятствия – нет сигнала, не работает кнопка, не находит нужную функцию.
Избегай клише – пиши живо, как будто рассказываешь ситуацию другу.
Делай коротко – сценарий должен читаться за 30–60 секунд.
Как писать хороший сценарий: советы
Пример-практика
на базе некой UX-персоны
  • Имя: Анна
  • Возраст: 29 лет
  • Профессия: Проект-менеджер в IT
  • Город: Кишинёв
  • Поведение: активный пользователь мобильных приложений, всё делает «на ходу»
  • Цель: следить за личными финансами, избегать перерасходов
  • Боли: забывает фиксировать траты, путается в выписках, не понимает, куда уходит зарплата
Персона 1: Анна
  • 4–6 предложений

Подчеркни (выдели):
  • Цель пользователя
  • Контекст использования
  • Проблему / препятствие
  • Эмоцию
Создайте сценарий
Что видно:
  • Контекст: обед, на ходу
  • Цель: быстро зафиксировать трату
  • Барьер: сложный интерфейс, нет быстрого действия
  • Эмоция: раздражение → откладывание
Анна выходит с обеда с друзьями и вдруг вспоминает, что опять забыла записать расходы. Она достаёт телефон и открывает приложение для учёта бюджета. Интерфейс оказывается перегружен — слишком много кнопок и категорий. Она не может быстро найти «Рестораны» и теряет интерес. В итоге она думает: «Запишу потом», и снова забывает. Анна чувствует раздражение и беспомощность, потому что всё время теряет контроль над расходами.
Сценарий:
карта пути пользователя от первого контакта с продуктом до достижения цели. Она визуализирует поведение, мысли, эмоции, точки контакта и проблемы пользователя на каждом этапе.
CJM — customer journey map
В отличие от сценария (линейного рассказа), CJM — это структурированная таблица или диаграмма, где весь опыт пользователя разложен по шагам и каналам.

Это один из форматов сбора исследовательской информации, который отражает сценарий пользователя: шаги, эмоциональные реакции, время, ключевые цитаты.
  • Понять опыт пользователя как процесс — от интереса до завершения задачи
  • Выявить болевые точки: где он путается, бросает, злится
  • Найти возможности для улучшения UX (через автоматизацию, упрощение, подсказки)
  • Вовлечь команду: дизайнеров, маркетологов, разработчиков, поддержку — в единую картину
Зачем нужна CJM?
Что можно улучшить в продукте или процессе? Где «точка роста» UX?
7. Возможности для улучшения
Где возникают проблемы, недоразумения, разрывы? Что мешает пользователю продолжить?
6. Болевые точки
Через какие каналы и интерфейсы пользователь взаимодействует с продуктом?
5. Точки контакта
Что он чувствует? Позитив или фрустрацию? Где поднимается тревожность?
4. Эмоции пользователя
О чём он думает? Какие вопросы возникают? Что пытается понять?
3. Мысли и вопросы пользователя
Что делает пользователь на каждом этапе? Какие реальные шаги он предпринимает?
2. Действия пользователя
Логическая последовательность шагов от первого контакта до завершения цели (и даже после).
1. Этапы пути пользователя
Из чего состоит CJM
Как составить CJM
Шаг 1: Определи цель карты CJM — это не просто красивая таблица.

Сначала задай себе вопрос:

  • Что ты хочешь проанализировать?
  • Какой опыт описываешь — покупка? использование? подписка?
  • На каком этапе сейчас продукт (MVP, редизайн, улучшение поддержки)?
  • Кто будет использовать CJM (UX, PM, бизнес)?

Пример цели: «Понять, почему пользователи бросают оформление заказа на третьем шаге.»
Шаг 2: Выбери 1 персону

Не пытайся описать всех — это размазывает фокус. Возьми одну UX-персону, у которой реальная цель и поведение, и проанализируй путь именно её глазами.

  • Что ты хочешь проанализировать?
  • Какой опыт описываешь — покупка? использование? подписка?
  • На каком этапе сейчас продукт (MVP, редизайн, улучшение поддержки)?
  • Кто будет использовать CJM (UX, PM, бизнес)?

Пример: Анна, 29 лет, маркетолог, хочет быстро оплатить коммунальные в мобильном банке.

Шаг 3: Опиши ключевые этапы пути

Пронумеруй этапы, которые проходит пользователь — логически и по времени. Обычно 4–6 шагов достаточно.

Примеры этапов:

  1. Осознание — узнал о продукте
  2. Исследование — читает, сравнивает
  3. Принятие решения — оформляет заказ
  4. Получение — использует продукт
  5. Поддержка — пишет в чат или звонит
  6. Повторное использование — возвращается / рекомендует другим
Шаг 4: На каждом этапе добавь:

Действия. Пример: «Скачивает приложение»
Мысли/вопросы. Пример: «Это безопасно?»
Эмоции. Пример: «Тревога»
Точки контакта. Пример: «App Store, SMS, email»
Болевые точки. Пример: Слишком много разрешений
Шаг 5: Используй реальные данные

CJM — это не фантазия дизайнера.

Используем в работе:

  • Интервью и опросы
  • Поведенческую аналитику (Google Analytics)
  • Жалобы в поддержку
  • Отзывы
Шаг 6: Найди боли и точки роста

На основе карты задай себе и команде вопросы.

  • Где пользователь застревает?
  • Где он уходит?
  • Где он раздражается или путается?
  • Что мы можем добавить, убрать или улучшить?
Шаг 7: Прими решения

CJM без действия — мёртвая карта.

  • Подумай над фичами и улучшениями
  • Инструмент аргументации перед менеджментом
  • Приоритезация процесов в roadmap
  • Создание сценариев для тестирования
Типовые ошибки
Нет фокуса на эмоциях — только шаги, без "что чувствует человек"
Слишком сложная — перегружена деталями, трудно читать
Изолирована от реального дизайна — её сделали и забыли
Нет ясной цели — не понятно, зачем её создавали
  • Помогает найти точки потери клиента
  • Позволяет спроектировать гладкий, логичный, эмоционально комфортный путь
  • Даёт аргументы в разговоре с менеджерами/разработчиками
  • Используется в: UI-дизайне, маркетинге, разработке функций, поддержке
Что CJM даёт UX-дизайнеру
Вывод из сегодняшнего урока
Пользовательские сценарии и CJM — это не просто формальности или "артефакты UX".

Это инструменты эмпатии и здравого смысла, которые помогают:

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

Сценарий — показывает, что делает пользователь и почему.
CJM — показывает, как он это делает, что чувствует и где всё ломается.
Составить CJM сценария поиска офлайн курса — с момента возникновения желания и до момента окончания первой вступительной лекции.
UX-персона: Ты
Цель: Найти лучшие офлайн курсы по UX/UI дизайну в Кишиневе
Домашка
Made on
Tilda