Когда команда проектирует сайт, она обычно думает категориями страниц: главная, о компании, услуги, контакты. Посетитель думает иначе: ему нужно решить задачу. «Узнать, сколько стоит ремонт», «выбрать подходящий тариф», «проверить, можно ли доверять этой фирме». Страницы для него лишь промежуточные точки. Если путь между ними не продуман, человек теряется и уходит, не дойдя до цели.
Пользовательский сценарий — это описание последовательности действий, которые человек совершает для достижения цели на сайте. Он связывает мотивы посетителя, его контекст и конкретные экраны. Работа со сценариями помогает отвечать на вопросы, которые иначе решаются интуитивно: что показать первым, куда поставить кнопку, какую информацию дать до формы, а какую после.
В этой статье разберём, из чего состоит сценарий, как его собрать на основе реальных данных, как превратить в структуру страниц и как проверить, что он работает.
Сценарий, история и путь клиента: не путаем термины
В проектировании встречается несколько близких понятий. Пользовательская история — короткая формулировка потребности: «Как директор небольшой компании, я хочу быстро понять стоимость сайта, чтобы решить, стоит ли оставлять заявку». Сценарий разворачивает историю в последовательность шагов и экранов. Карта пути клиента (customer journey map) смотрит шире: она охватывает всё взаимодействие с брендом, включая рекламу, звонки, письма и работу после покупки.
Для проектирования сайта чаще всего достаточно сценариев: они конкретнее карты и помогают принимать решения по экранам. Карту пути строят, когда нужно согласовать работу нескольких каналов, например сайта, рассылок и отдела продаж. Об этой связке рассказано в материале про взаимодействие сайта и отдела продаж.
Из чего состоит хороший сценарий
Для каждого сценария полезно зафиксировать несколько элементов.
- Персона. Кто этот человек: роль, опыт, уровень знаний о теме. Не вымышленный Иван тридцати пяти лет с хобби, а рабочий портрет с задачей и ограничениями.
- Цель. Что человек хочет получить. Одна цель на один сценарий, иначе описание размывается.
- Контекст. Откуда пришёл, с какого устройства, в какой ситуации: на бегу со смартфона или за рабочим столом после изучения нескольких предложений.
- Точка входа. Страница, на которую человек попадает: главная, статья блога, объявление, карточка товара.
- Шаги. Последовательность действий и экранов, которые ведут к результату.
- Вопросы и сомнения. Что человек хочет узнать или чего опасается на каждом шаге.
- Критерий успеха. Заявка, заказ, звонок, скачивание, подписка. То, по чему вы поймёте, что сценарий сработал.
Откуда брать информацию
Сценарии, придуманные в кабинете, обычно описывают идеального клиента, которого не существует. Лучше опираться на данные. Основные источники такие.
- Интервью с клиентами. Спросите, как они искали решение, что сравнивали, на каком этапе возникали сомнения. Методику разбираем в материале про UX-исследование.
- Вопросы отдела продаж. Менеджеры слышат одни и те же вопросы десятки раз. Эти вопросы и есть содержание сценариев.
- Поисковые запросы. Формулировки в поиске показывают реальные задачи и их приоритеты. Связь запросов и структуры подробно описана в статье про семантическое ядро.
- Аналитика сайта. Популярные страницы, типичные цепочки переходов, места выхода. Она показывает, как люди ведут себя сейчас.
- Обращения в поддержку. Частые жалобы и непонимание указывают на провалы в существующих сценариях.
Как выбрать главные сценарии
Список возможных сценариев быстро разрастается. Если пытаться проработать все, вы утонете в деталях. Поэтому сценарии нужно приоритизировать. Для каждого оцените две вещи: насколько он важен для бизнеса и как часто встречается. Сценарий «найти контакты» встречается постоянно, но сам по себе денег не приносит. Сценарий «заказать расчёт стоимости» встречается реже, зато напрямую ведёт к продаже.
Обычно выделяют три–пять основных сценариев и столько же второстепенных. Основные определяют структуру главной страницы и меню, второстепенные получают поддержку в виде отдельных страниц и ссылок. Для интернет-магазина основные сценарии — «найти нужный товар», «сравнить варианты», «оформить заказ». Для компании, оказывающей услуги, — «понять, чем вы занимаетесь», «убедиться, что вам можно доверять», «узнать стоимость и оставить заявку».
Пошаговая методика проектирования
Шаг 1. Определите персону и задачу
Запишите одной фразой, кто пришёл и зачем. Хороший формат: «Руководитель отдела закупок ищет поставщика и сравнивает несколько вариантов за один вечер». В нём есть роль, цель и контекст, который влияет на поведение: человек сравнивает и ограничен во времени.
Шаг 2. Опишите путь без привязки к сайту
Сначала представьте, как человек решал бы задачу без вашего ресурса. Что он ищет? Какие вопросы задаёт? Какие критерии применяет? Только после этого накладывайте путь на сайт. Так вы увидите потребности, а не будете подгонять сценарий под уже существующие страницы.
Шаг 3. Разбейте на шаги и экраны
Для каждого шага определите, что человек видит, что делает и что хочет узнать. Затем решите, какой экран отвечает на это. Если одному шагу не соответствует ни один экран, значит, вы нашли пробел в структуре. Если экран не отвечает ни на один шаг, он, вероятно, лишний.
Шаг 4. Найдите барьеры и сомнения
На каждом шаге выпишите, что может остановить. Нет цены, непонятно, сколько ждать, страшно оставлять данные, форма слишком длинная, нет подтверждения надёжности. Для каждого барьера придумайте ответ: блок с этапами, отзывы, гарантии, короткий текст рядом с формой. Вопросы доверия подробнее разбираются в материале про типографику и доверие.
Шаг 5. Определите точку действия
Решите, где именно человек должен совершить целевое действие и как сделать его максимально простым. Для разных сценариев точки различаются: одному нужна кнопка «Рассчитать стоимость», другому звонок, третьему подписка на материалы. Практика оформления призывов описана в статье про кнопки и призывы к действию.
Пример сценария для сайта услуг
Возьмём типичный случай: компания ищет подрядчика для создания сайта. Опишем сценарий по шагам.
| Шаг | Что делает человек | Что ему нужно узнать | Что даёт сайт |
|---|---|---|---|
| 1. Вход | Приходит из поиска на страницу услуги | Подходит ли это под мою задачу | Ясный заголовок, перечень решаемых задач |
| 2. Оценка | Листает, смотрит примеры работ | Умеют ли они делать то, что нужно | Кейсы с результатами и описанием задач |
| 3. Сомнения | Ищет цену и сроки | Сколько это стоит и как долго ждать | Диапазоны цен, этапы работы |
| 4. Доверие | Проверяет отзывы и команду | Можно ли им доверять | Отзывы, гарантии, информация о команде |
| 5. Действие | Решает обратиться | Как это сделать просто и безопасно | Короткая форма, понятный следующий шаг |
Такая таблица сразу показывает, чего не хватает. Если на сайте нет ответа на третий шаг, посетители будут уходить искать цены у конкурентов. Именно поэтому на страницах услуг стоит размещать ориентиры стоимости и ссылки на тарифы и этапы работы.
Многоканальные и альтернативные сценарии
Редко бывает так, что все приходят в одну и ту же точку. Один человек появился из рекламы и сразу попал на лендинг, другой прочитал статью в блоге, третий вернулся по закладке. Для каждой точки входа сценарий начинается по-своему. Посетитель из статьи ещё не знает, чем вы занимаетесь, поэтому ему нужно мягко предложить следующий шаг. Посетитель из рекламы уже заинтересован конкретным предложением, ему нужно быстро получить подтверждение и форму. Страницы, на которые ведёт реклама, проектируются отдельно: подробности приведены в материале про посадочные страницы под рекламу.
Нужно также продумать альтернативные пути: что будет, если человек не готов оставить заявку сейчас? Для таких случаев помогают мягкие действия: подписка, скачивание материала, добавление в избранное, возможность вернуться позже. Это не отвлекает от основной цели, а страхует от потери заинтересованных, но неготовых посетителей.
Отдельный сценарий всегда стоит планировать для ошибок и тупиков: страницы «ничего не найдено», пустая корзина, недоступный товар, ошибка в форме. Если человек упирается в стену без подсказки, он не вернётся.
Как сценарии превращаются в структуру сайта
Когда основные сценарии описаны, структура формируется почти автоматически. Из каждого шага вытекает блок или страница. Из повторяющихся шагов в разных сценариях получаются общие элементы: меню, поиск, форма заявки, блок доверия. Пункты меню называются так, как человек формулирует свою задачу, а не так, как принято внутри компании. Вместо «Решения» лучше «Услуги», вместо «Направления деятельности» просто «Что мы делаем».
Затем сценарии ложатся на прототип. Каждый шаг проверяется вопросом: «Понятно ли здесь, что делать дальше?». Если ответ неочевиден, добавляют подсказку, меняют расположение кнопки или упрощают шаг. Как переход от схемы к интерфейсу выглядит на практике, рассказано в материале про прототипирование сайта.
Типичные ошибки проектирования сценариев
- Идеальный пользователь. Сценарий предполагает, что человек внимательно прочтёт всё и сразу поймёт. В реальности он торопится, отвлекается и пропускает текст.
- Слишком много сценариев. Попытка угодить всем даёт сайт, который ничего не акцентирует.
- Сценарий от структуры компании. Разделы повторяют оргструктуру: отделы, подразделения. Клиенту это безразлично, ему нужен результат.
- Отсутствие данных. Сценарии придуманы, а не собраны из интервью и аналитики.
- Игнорирование мобильных условий. Человек на смартфоне действует иначе: короче сессии, больше отвлечений, неудобно вводить текст.
- Нет критерия успеха. Непонятно, что считать результатом, поэтому нечего измерять и улучшать.
- Однократная работа. Сценарии составили один раз и забыли. Между тем аудитория и предложения меняются.
Как проверить и улучшить сценарий
Проверка складывается из двух частей. Сначала качественная: дайте нескольким людям задачу из сценария и наблюдайте. Затем количественная: настройте в аналитике цели и воронки по шагам, чтобы видеть, на каком этапе уходят. Если на третьем шаге теряется половина посетителей, именно туда стоит направить усилия. Подходы к метрикам описаны в статье про веб-аналитику, а методы увеличения числа заявок — в материале про конверсию сайта.
Улучшайте по одному фактору за раз. Изменили текст на кнопке, подождали, оценили результат. Если менять сразу всё, невозможно понять, что именно сработало. При достаточном трафике закрепить вывод помогают контролируемые эксперименты.
Итог
Пользовательские сценарии помогают смотреть на сайт глазами человека с конкретной задачей. Они превращают набор страниц в понятные дороги, на которых каждый шаг отвечает на вопрос посетителя и мягко приближает его к действию. Начните с трёх основных сценариев, соберите данные у реальных клиентов, опишите шаги и барьеры, а затем проверьте путь на прототипе.
Если вы планируете новый сайт или хотите переработать существующий, напишите нам: поможем выделить ключевые сценарии вашей аудитории и превратить их в структуру, которая приводит клиентов к заявке.
