Представим ситуацию: 1000 человек зашли на сайт за неделю, 15 оставили заявку. Конверсия 1,5%. Он понимает, что это мало, но не понимает, где именно люди уходят и почему.
Дизайнер говорит: «Надо улучшить пользовательский опыт». Но с чего начать? Переделывать главную? Упрощать форму? Менять навигацию? Непонятно.
Карта пути пользователя — это инструмент, который показывает весь путь человека от первого касания до покупки и помогает найти конкретные места, где дизайн создаёт барьеры. Не абстрактные рекомендации «сделать удобнее», а точное понимание: на каком этапе что сломалось.
Что такое карта пути пользователя
Это визуальная схема, которая показывает, как человек движется к цели: от момента, когда он впервые узнал о вас, до покупки и дальше.
Карта фиксирует:
- Какие этапы проходит человек (увидел рекламу → зашел на сайт → посмотрел услугу → оставил заявку)
- Где он встречается с дизайном (баннер, главная страница, карточка товара, форма)
- Что чувствует на каждом этапе (интерес, растерянность, раздражение, удовлетворение)
- Где возникают проблемы (не нашел цену, не понял как заказать, форма слишком сложная)
Карта помогает посмотреть на проект не глазами владельца бизнеса или члена команды («у нас все логично»), а глазами человека, который впервые столкнулся с вашим сайтом.
Как выглядит карта
Существует несколько форматов карт. Выбор зависит от сложности продукта и задачи.
Линейная карта
Самый простой и распространённый формат. Этапы пути идут слева направо, под каждым этапом — детали.
Структура:
| Этап | Действие пользователя | Точка контакта | Эмоция | Проблема дизайна |
|---|---|---|---|---|
| Осознание | Видит рекламу услуги | Баннер в Яндексе | Интерес | Баннер перегружен текстом |
| Интерес | Заходит на сайт | Главная страница | Растерянность | Непонятно, что предлагается |
| Изучение | Открывает страницу услуги | Карточка услуги | Сомнение | Нет цены, нет примеров |
| Решение | Заполняет форму заявки | Форма | Раздражение | 10 полей, непонятные названия |
| Контакт | Получает звонок | Телефонный разговор | Удовлетворение | — |
Линейная карта хорошо работает для простых путей: лендинг, форма обратной связи, небольшой интернет-магазин. Когда у человека один основной маршрут от начала до конца.
Что она дает: видно, на каком этапе все ломается. Если на этапе «Изучение» эмоция падает — проблема в карточке услуги или товара.
Карта с эмоциональной кривой
Это график, где по горизонтали — этапы пути, по вертикали — уровень удовлетворенности. Линия показывает, как меняются эмоции человека.
Как это работает:
- Человек видит рекламу — интерес высокий (линия вверх)
- Заходит на главную — растерялся, непонятно куда кликать (линия вниз)
- Нашёл услугу — обрадовался (линия вверх)
- Увидел форму из 12 полей — раздражён (линия резко вниз)
- Заполнил форму, получил быстрый ответ — доволен (линия вверх)
Линейная карта с эмоциональной кривой
Когда использовать: для сложных путей с множеством точек контакта. Когда важно не просто зафиксировать этапы, а увидеть эмоциональные пики и провалы.
Что она дает: показывает критические точки — места, где человек максимально близок к тому, чтобы уйти. Это приоритет для исправлений.
Карта с несколькими сценариями
Показывает разные пути к одной цели. Например:
- Человек пришел из поиска → попал на статью в блоге → перешёл в каталог → купил
- Человек кликнул на рекламу → попал на лендинг → оставил заявку
- Человек пришёл по рекомендации → зашёл в раздел «О компании» → посмотрел кейсы → написал в чат
Когда использовать: для сложных продуктов, где у людей разные пути. Или когда у вас несколько типов аудитории с разными задачами.
Что она дает: помогает увидеть, какие сценарии работают лучше, какие хуже. Можно сравнить конверсию разных путей и понять, куда направить усилия.
Что карта показывает
Точки контакта с дизайном
Это конкретные места, где человек встречается с вашим визуалом: баннер в рекламе, главная страница, карточка товара, форма заявки, письмо-подтверждение, личный кабинет.
На карте видно: сколько точек контакта проходит человек, прежде чем совершить целевое действие. Если их слишком много — путь слишком сложный. Если на каком-то этапе точка контакта отсутствует — человек теряется.
Пример: человек кликнул на рекламу курса, попал на главную страницу, но там нет информации об этом курсе. Он должен сам искать через меню. Это лишняя точка контакта, которая создает барьер.
Эмоции на каждом этапе
Это не про «человек счастлив» или «человек грустный». Это про конкретные реакции на дизайн:
- «Не понял, что делать» = плохая навигация или отсутствие визуальных подсказок
- «Раздражен» = форма слишком длинная или кнопка не работает
- «Сомневается» = нет доказательств качества (отзывов, кейсов, цены)
- «Обрадовался» = быстро нашел то, что искал
Эмоции помогают понять, где дизайн работает против цели.
Проблемы дизайна
Карта превращает абстрактное «плохой дизайн» в список конкретных проблем:
- На главной странице нет понятного заголовка — человек не понимает, что здесь предлагают
- Кнопка «Заказать» серая и внизу страницы — её не замечают
- В форме 10 полей, половина непонятны — человек бросает заполнение
- Цена спрятана — человек уходит искать её у конкурентов
- После отправки формы нет подтверждения — человек не уверен, что заявка ушла
Когда проблемы зафиксированы на карте, становится понятно, что исправлять.
Если вы видите, что сайт не приносит ожидаемый результат, но не понимаете, в чем причина — напишите нам!
Проведем аудит пользовательского опыта и покажем, где дизайн мешает конверсии, а где можно усилить результат.
Как построить карту
Не нужны сложные инструменты. Можно начать с простой схемы в таблице или на доске.
Шаг 1. Выберите один сценарий
Не пытайтесь охватить все возможные пути сразу. Начните с самого частого — того, по которому идет большинство ваших клиентов.
Например, для интернет-магазина это может быть: человек кликнул на рекламу → попал на главную → перешёл в каталог → открыл карточку товара → добавил в корзину → оформил заказ.
Шаг 2. Выпишите этапы
Разбейте путь на шаги. Не нужно делать 20 этапов — достаточно 5-7 ключевых.
Шаг 3. Для каждого этапа зафиксируйте детали
Что делает человек? Что он видит (точка контакта с дизайном)? Что чувствует? Какие проблемы возникают?
Если не знаете — не придумывайте. Смотрите данные: аналитику сайта (где уходят), записи сессий (где люди кликают, где зависают), тепловые карты (что замечают, что игнорируют), опросы клиентов.
Шаг 4. Найдите узкие места
Посмотрите на карту и найдите этапы, где:
- Больше всего людей уходит (смотрите аналитику)
- Эмоция падает до минимума
- Накопилось несколько проблем дизайна
Это приоритет для исправлений.
Шаг 5. Исправляйте по одной проблеме
Не переделывайте весь сайт сразу. Возьмите самое болезненное место (например, форму заявки, где уходит 70% людей) и исправьте его. Проверьте результат. Если конверсия выросла — двигайтесь дальше.
Коротко: главное
Карта пути пользователя — это не просто инструмент дизайнера. Это способ увидеть, куда уходят деньги.
Вы вкладываетесь в рекламу, приводите трафик на сайт. Но если человек не может найти цену, если форма заявки слишком сложная, если кнопка «Купить» незаметна — он уходит. Вы платите за клик, но не получаете клиента.
Карта показывает конкретные места, где это происходит. Не абстрактное «надо улучшить дизайн», а точное понимание: на этапе оформления заявки уходит 60% людей, потому что форма из 10 полей.
Понравилась статья?
Поделиться