«Понимание потребности – главное условие дизайна». Так говорил Чарльз Имз, один из самых известных дизайнеров XX века. И с ним сложно поспорить: эстетичный, современный, созданный по всем трендам интерфейс бесполезен, если человек не может решить с его помощью свою задачу.
Когда человек заходит на сайт, он хочет быстро и без лишних вопросов получить то, за чем пришел: найти ответ, выбрать подходящий товар, оформить покупку или воспользоваться услугой. Но на своем пути он может столкнуться с неожиданными трудностями. Порой пользователь вообще уходит, так и не сделав задуманное. Задача дизайнера – разобраться, почему это происходит и как это предотвратить.
Но что мешает человеку достичь своей цели? Ответ может скрываться в деталях, которые дизайнер сначала даже не замечает. Найти их помогает карта пути пользователя. Разберем, как ее составить, какие проблемы можно обнаружить с ее помощью и как находить решения, которые сделают интерфейс удобнее.
Источник: commons.wikimedia.org, CCasares (WMF), CC BY-SA 4.0
Что такое карта пути пользователя и зачем она необходима
Карта пути пользователя – это схема, которая показывает, как человек взаимодействует с продуктом для достижения определенной цели. Карта – результат исследований дизайнера: в ней собирают и систематизируют данные о том, какие действия совершает пользователь, чего ожидает, что чувствует и с какими трудностями сталкивается.
Подобный метод использовали задолго до появления привычных нам цифровых сервисов. Еще в середине 1990-х компания OxfordSM начала разрабатывать и применять карты пользовательского пути для изучения клиентского опыта. Они помогали ответить на главный вопрос: что происходит с человеком на разных этапах взаимодействия с компанией и как сделать этот опыт лучше? Позже подход получил распространение в проектировании услуг, а с развитием цифровых продуктов стал востребован и среди дизайнеров интерфейсов.
В профессиональной среде можно обнаружить два сокращения для данного понятия:
- CJM (Customer Journey Map) – карта пути клиента. Показывает, как человек взаимодействует с компанией на разных этапах: узнает о ней, изучает предложения, пользуется продуктами или услугами, обращается за поддержкой. Помогает понять, что влияет на его впечатление о компании в целом.
- UJM (User Journey Map) – карта пути пользователя. Показывает, как человек решает определенную задачу: например, ищет информацию на сайте, выбирает нужную функцию или оформляет заказ. Помогает оценить удобство взаимодействия с продуктом.
Хотя дизайнеры нередко используют оба термина как синонимы, между ними есть различия. Проще говоря, CJM обычно рассматривает более широкий опыт клиента, а UJM подробнее, более точечно изучает взаимодействие с продуктом. Далее в статье для удобства будем использовать сокращение CJM.
Источник: commons.wikimedia.org, Advenio, CC BY-SA 4.0
Из чего состоит CJM
Во время исследования дизайнер собирает много информации о поведении пользователей. Чтобы увидеть закономерности и обнаружить проблемные моменты, эти сведения нужно упорядочить. Для этого CJM оформляют в виде таблицы или схемы, разделяя путь человека на последовательные этапы.
Вот основные элементы карты пути пользователя, которые позволяют систематизировать собранные данные:
- Портрет пользователя. Краткое описание группы людей (=аудитории), чей путь изучают: их цели, потребности и особенности поведения.
- Сценарий. Ситуация, в которой человек взаимодействует с продуктом, и результат, которого он хочет достичь. Например, записаться на прием к врачу через приложение.
- Этапы пути. Основные шаги, которые человек делает для достижения своей цели. Например, при покупке товара: поиск, выбор, оформление заказа и получение покупки.
- Действия. Что человек делает на каждом этапе: ищет информацию, сравнивает варианты, заполняет форму или подтверждает запись.
- Точки контакта. Все способы взаимодействия человека с продуктом или компанией: через сайт, приложение, письма или службу поддержки.
- Мысли и эмоции. О чем думает пользователь, какие вопросы у него возникают, что вызывает радость, сомнения или раздражение (это должны быть не догадки, а подтвержденные словами пользователей факты).
- Проблемы. Трудности, которые мешают человеку достичь цели: например, непонятные инструкции, сложная навигация, отсутствие нужной информации.
- Возможности для улучшения. Какие изменения могут устранить найденные трудности. Эти идеи еще предстоит проверить.
Карту можно дополнять любыми сведениями, которые имеют значение для изучаемого сценария. Главное, чтобы собранная информация действительно помогла разобраться в пользовательском опыте и найти возможности для его улучшения.
Источник: commons.wikimedia.org, EAsikingarmager (WMF), CC BY-SA 4.0
Как создать карту пути пользователя: пошаговая инструкция
Как понять, что действительно нужно пользователям? Какие действия они совершают для достижения цели и что может им помешать? Эти вопросы возникают и при создании нового продукта, и при доработке уже существующего. Чтобы найти ответы, дизайнер исследует поведение людей и составляет CJM.
В качестве примера возьмем вымышленное приложение для изучения языков.
Любые совпадения с реальными продуктами случайны. Описанные ситуации и возможные проблемы пользователей приведены для объяснения метода, поэтому их следует рассматривать как гипотезы.
Шаг 1. Определите цель исследования
Всегда начинаем с вопроса: что именно мы хотим узнать с помощью карты? Цель должна быть конкретной. В нашем примере компания хочет создать приложение для начинающих. Поэтому цель можно сформулировать так: выяснить, как люди выбирают приложение для изучения языка, с какими болями сталкиваются в процессе, какие сомнения возникают на пути, что помогает им начать обучение и какие трудности возникают на первых занятиях.
Предположим, будущие пользователи могут сомневаться, какой уровень выбрать, опасаться слишком сложных упражнений или не понимать, сколько времени потребуется на обучение. Пока это лишь версии, которые предстоит проверить.
Если приложение уже существует, цель исследования может быть конкретнее. Например, выяснить, почему люди устанавливают его, но прерывают занятия после первого урока.
Шаг 2. Изучите целевую аудиторию
Карта должна отражать реальный опыт, поэтому следующий шаг – собрать сведения о будущих или действующих пользователях. Портрет целевой аудитории – это собирательное описание людей, чей путь мы изучаем. Помимо общих сведений (то есть возраста, рода занятий, места проживания и культурного кода, если они важны для задачи), выясните, чего люди хотят достичь, как решают задачу сейчас и где сталкиваются с трудностями.
Для этого можно использовать разные методы:
- Интервью – чтобы понять причины решений и услышать о возникающих или возможных трудностях.
- Опросы – чтобы собрать ответы на одинаковые вопросы у большого числа участников и вывести статистику.
- Наблюдения – чтобы проследить, как человек выполняет определенные действия и в какие моменты испытывает затруднения.
- Аналитику (если продукт уже существует) – чтобы узнать, какие экраны посещают пользователи, как часто возвращаются и на каких этапах прекращают взаимодействие.
- Отзывы и обращения в поддержку – чтобы выяснить, с какими вопросами и проблемами люди обращаются чаще всего.
Допустим, мы предполагаем, что приложением будут пользоваться взрослые, которые начинают учить английский и располагают небольшим количеством свободного времени. Это пока описание предполагаемой аудитории. Чтобы проверить его, поговорим с людьми, которые уже использовали наше приложение (если оно есть) или недавно пробовали учить язык: узнаем, сколько времени они могли уделять занятиям, как занимались и что мешало делать это регулярно.
Важно расспрашивать о реальном опыте прямо, без наводящих вопросов. Из полученных ответов мы сможем составить портрет аудитории и понять, какие потребности и особенности поведения стоит учитывать в дальнейшей работе над картой.
Шаг 3. Выберите сценарий взаимодействия с продуктом/сервисом
Поскольку один продукт можно использовать для совершенно разных целей, важно определить конкретную ситуацию, которую будет описывать карта, и обозначить ее границы.
Вернемся к нашему примеру. Человек хочет изучать иностранный язык – это и есть начало пути. Он ищет подходящее приложение, знакомится с его возможностями, выбирает уровень подготовки и приступает к первым занятиям. Конечная точка CJM – прохождение первого урока и решение, стоит ли переходить к следующему.
Почему именно такой путь мы выбираем? Желание продолжить обучение может стать первым признаком того, что приложение заинтересовало пользователя и он готов вернуться к занятиям. Однако подтвердить это помогут только данные о его дальнейшем поведении.
Шаг 4. Выделите этапы пути и точки контакта
Теперь необходимо восстановить последовательность событий: что делает человек, прежде чем достигает своей цели. Для этого объедините близкие действия в отдельные этапы, а затем укажите конкретные моменты взаимодействия: что человек открыл, прочитал или получил.
Для приложения по изучению языков предварительно можно выделить следующие этапы:
- Появление цели и мотивации. Человек решает изучать иностранный язык.
- Поиск способа обучения. Рассматривает приложения, онлайн-курсы и другие варианты.
- Выбор приложения. Изучает возможности, сравнивает цены, отзывы и условия использования.
- Начало обучения. Регистрируется, определяет уровень подготовки и выбирает программу.
- Первый урок. Знакомится с упражнениями и выполняет задания.
- Продолжение занятий. Решает, когда вернуться к обучению.
Затем для каждого этапа определяют точки контакта. Например, во время поиска человек может читать отзывы или смотреть обзоры. После установки приложения он взаимодействует с его экранами, заданиями и уведомлениями, а также со службой поддержки.
Но реальный путь не всегда последователен. Пользователь может вернуться к поиску другого приложения, пропустить отдельные шаги, прервать урок и продолжить его через несколько дней или вовсе отказаться от выбранного сервиса. Такие особенности тоже отражают в карте, если они подтверждены исследованием.
Источник: commons.wikimedia.org, Nick Nijhuis, CC BY-SA 4.0
Шаг 5. Выясните, что думают и чувствуют пользователи
Теперь нужно разобраться, что стоит за действиями человека. Какие у него ожидания? Почему он принимает определенные решения? Что вызывает интерес, сомнения или раздражение? Одно и то же поведение может иметь разные причины. Например, человек закрыл приложение после первого урока, потому что выполнил намеченное на день, устал или не понял, как продолжить.
Вновь возвращаемся к результатам исследования аудитории, чтобы найти объяснение действиям пользователя и понять, что он чувствовал в этот момент.
Представим, что во время интервью несколько участников рассказали, как после первого урока растерялись: приложение предложило сразу несколько следующих занятий, но было непонятно, какое выбрать. Одни боялись пропустить важную тему, другие сомневались, подходят ли им упражнения по сложности. Если же известен только сам факт того, что пользователь закрыл приложение, причину ухода пока нельзя считать установленной.
Нельзя анализировать продукт в отрыве от тех, ради кого он и создается. За каждым действием стоят свои причины, ожидания и переживания. Если отразить их в CJM, дизайнер сможет увидеть, какие моменты вызывают затруднения и почему.
Шаг 6. Найдите проблемы и предложите варианты их решения
Один из наиболее сложных этапов – поиск закономерностей. Обратите внимание, какие трудности повторяются и на каких этапах они чаще всего возникают. При этом контекст не менее важен: если человек закрыл приложение после урока, это еще не значит, что он столкнулся с проблемой. Возможно, он выполнил все запланированное и собирается вернуться завтра.
Другое дело, если несколько участников исследования рассказывают, что не понимают, как продолжить обучение, или регулярно сталкиваются со слишком сложными заданиями. Особенно внимательно стоит изучить проблемы, которые одновременно обнаруживаются в разных источниках: например, о них говорят на интервью, пишут в отзывах и обращениях в поддержку.
Обратимся к нашему примеру. Предположим, исследование выявило несколько закономерных проблем. Какие решения можно предложить?
- Сложно выбрать уровень подготовки. Можно добавить короткое вводное задание, которое поможет подобрать программу с подходящей сложностью.
- Непонятно, сколько времени займет урок. Стоит показывать его примерную продолжительность, чтобы человек мог планировать занятия.
- Трудно понять, какое занятие проходить следующим. Можно выделить рекомендуемый урок и объяснить, почему стоит продолжить именно с него.
- Не виден результат обучения. Можно показывать освоенные темы и навыки, чтобы человек понимал, чему уже научился.
При выборе решений важно учитывать особенности целевой аудитории. Например, если люди занимаются языком во время коротких перерывов, возможность проходить небольшие уроки может оказаться полезнее длинных занятий. А начинающим пользователям важно деликатно объяснять ошибки и отмечать их успехи (даже небольшие).
Важно: не все проблемы, обнаруженные с помощью CJM, можно решить изменением интерфейса. Иногда причины кроются в условиях предоставления услуги, особенностях самого продукта или работе службы поддержки. Это зона ответственности других специалистов.
Шаг 7. Соберите результаты в единую карту
Теперь все собранные сведения нужно объединить в одну схему. Для начала хватит обычной электронной таблицы, но можно воспользоваться Figma, чтобы сделать карту более наглядной и удобной для совместной работы.
Расположите этапы слева направо в том порядке, в котором человек их проходит. Под каждым этапом разместите собранные данные. И чтобы карта получилась полезной, придерживайтесь нескольких правил:
- Пишите конкретно.
- Выделяйте проблемные места (например, отмечайте их цветом).
- Добавляйте подтверждения к важным выводам (например, цитаты из интервью или ссылки на данные аналитики).
- Отделяйте факты от гипотез.
- Не перегружайте карту лишней информацией.
Источник: commons.wikimedia.org, Rosenfeld Media, CC BY 2.0
Как научиться работать с пользовательским опытом
Карта – это хороший инструмент для обнаружения проблем в пользовательском опыте. Но чтобы их устранить, нужен дизайнер, который умеет замечать детали, смотреть на привычные вещи под другим углом и придумывать решения, способные сделать жизнь людей немного проще. Здесь пригодятся и аналитическое мышление, и авторский взгляд, и художественный вкус.
Компания может вложить немало денег в рекламу, привлечь тысячи посетителей на сайт и все равно потерять часть потенциальных покупателей из-за неудобного интерфейса. Поэтому бизнесу нужны дизайнеры, способные находить такие проблемы и предлагать решения. Чем проще людям пользоваться продуктом, тем выше шансы на покупку и повторное обращение, а у компании – больше возможностей для роста выручки.
Но чтобы создавать интерфейсы, которые помогают людям достигать своих целей, а компаниям – развиваться, важно освоить графические редакторы, исследовать целевую аудиторию, понимать задачи бизнеса и создавать продукты, отвечающие на запросы пользователей. Научиться этому можно на курсе «Дизайнер интерфейсов» от дизайн-студии «Логомашина».
Что входит в обучение:
- CJM и другие инструменты исследования – навыки изучения потребностей пользователей перед проектированием.
- 440 часов практики – работа над заданиями и проектами для портфолио.
- Обратная связь без ограничений по количеству проверок – подробные разборы и возможность доработать задание с наставником.
- Командная работа в «Крутых студиях» – работа над реальным проектом в нашей дизайн-студии вместе с командой и арт-директором.
- Карьерная поддержка – помогаем оформить портфолио и резюме, подготовиться к собеседованиям и выполнить первые заказы еще во время обучения.
Над программой работают опытные дизайнеры, которые хорошо понимают требования профессии и знают, какие навыки пригодятся новичкам. Именно поэтому в центре обучения – задачи, с которыми дизайнеры сталкиваются в реальных проектах. Студенты получают возможность попробовать разные подходы, разобраться в собственных ошибках и постепенно собрать портфолио.
Научитесь смотреть на продукт глазами пользователя и создавать понятные, удобные интерфейсы.
Как CJM используют в работе над проектом: кейс студентки «Логомашины»
Каждая выявленная проблема – повод пересмотреть конкретный элемент интерфейса. Например:
- Человек не завершает регистрацию → форма требует слишком много данных → оставить только необходимые поля.
- Не находит нужный раздел → названия в меню ему непонятны → переименовать и перегруппировать разделы.
- Откладывает покупку → не видит итоговую сумму до оплаты → показать полную стоимость заранее.
- Не понимает, отправилась ли заявка → после нажатия нет подтверждения → показать сообщение об успешной отправке.
- Возвращается к задаче и начинает сначала → введенные данные не сохранились → сохранять прогресс автоматически.
- Не приступает к следующему уроку → непонятно, какое занятие ему подходит → выделить рекомендуемый урок и указать его длительность.
Каждое решение нужно проверять: стало ли пользователю легче?
Навыки приходят с опытом, и мы считаем, что получать его можно и нужно еще во время обучения. Потому мы создали «Крутые студии» – проект, где начинающие специалисты работают с реальными заказчиками, погружаются в корпоративный мир дизайна и учатся отвечать за результат.
Одна из участниц проекта – Анастасия Федорова. Ей очень хотелось попасть в «Крутые студии», и удалось это лишь с шестой попытки: первые пять заявок отклонили, но Анастасия продолжала пробовать и в итоге присоединилась к команде седьмого сезона.
Как это устроено в школе? В «Крутых студиях» участники работают в командах под руководством арт-директора. Задания поступают от дизайн-студии «Логомашина» и ее партнеров (среди них есть проекты для реальных заказчиков). Анастасия тоже участвовала в этой работе. В следующем, восьмом сезоне ей предложили стать арт-директором. В этой роли она вместе с командой проводила исследования и занималась разработкой CJM для проекта. Позже ее профессионализм оценили еще выше – Анастасия стала помощником руководителя «Крутых студий».
Итого: что важно помнить при составлении карты
Хорошо проработанная карта пользовательского пути помогает взглянуть на продукт глазами тех, кто им пользуется. Она показывает, на каком этапе человек сталкивается с трудностями, что именно мешает ему выполнить задачу и какие изменения стоит проверить.
Главное, что стоит помнить:
- Одна карта – один конкретный сценарий. Попытка охватить все способы использования продукта сделает CJM слишком громоздкой.
- Поведение и его причина – разные вещи. Статистика покажет, где люди прекращают действие, а интервью и другие методы сбора информации помогут разобраться, почему.
- Решения должны приниматься с учетом особенностей аудитории. Подсказка, которая будет полезна новичку, может раздражать опытного пользователя.
И помните: CJM ценна настолько, насколько ее выводы помогают принимать решения, полезные людям.
- Научим создавать логотипы, упаковку, фирменный стиль, баннеры, сайты и AI-креативы
- Закрепим наставника — он поможет освоить программы и выполнить первый оплачиваемый заказ
- Поможем начать зарабатывать с 4-го месяца, собрать портфолио и выйти на доход от 100 000 ₽ после курса
Краткое содержание
Как использовать карту пути пользователя?
Найдите проблемный этап и посмотрите, что известно о причинах затруднений. На основе этих данных предложите изменение интерфейса. Например, если пользователи не замечают кнопку продолжения, попробуйте изменить ее расположение или цвет и проверьте новый вариант.
Где взять шаблон карты пути пользователя?
В Figma Community или FigJam введите в поиск Customer Journey Map. Выберите шаблон под свой сценарий и удалите ненужные блоки. Для простой CJM подойдет даже электронная таблица.
Что делать, если нет возможности поговорить с пользователями напрямую?
Начните с изучения отзывов о продукте и обращений в поддержку. Если есть доступ к аналитике, посмотрите, на каких экранах пользователи чаще всего закрывают приложение и сколько человек не завершает начатое действие. Этого хватит, чтобы набросать первую версию CJM. Но почему люди ведут себя именно так, все же лучше спросить у них самих.
Можно ли составить карту до запуска продукта?
Да. Узнайте, как люди решают эту задачу сейчас (на примере конкурентов), и на основе их опыта опишите возможный путь в новом продукте. Отметьте, какие шаги пока остаются предположениями.
Как понять, какие проблемы на карте нужно решать в первую очередь?
Оцените, сколько людей сталкивается с проблемой и насколько серьезны ее последствия. В первую очередь стоит обратить внимание на те препятствия, из-за которых компания теряет клиентов, деньги или доверие пользователей.
