Лого vc.ru

Инструмент: разработка карты перемещений пользователя при помощи UXPressia

Инструмент: разработка карты перемещений пользователя при помощи UXPressia

Менторы рубрики «Интерфейсы» на vc.ru продолжают публиковать кейсы компаний и инструменты, которые будут полезны представителям индустрии.

Сегодня в выпуске — обзор инструмента для создания Customer Journey Map UXPressia, подготовленный командой юзабилити-компании UXPresso.

Поделиться

Мир изменился. Мы чувствуем это в рекламе. Чувствуем в приложениях. Ощущаем в магазинах. Многое, что когда-то было, теперь утеряно. На самом деле, это даже хорошо. Сейчас расскажем почему.

Потребитель нынче пошел вредный, себе на уме. Так и норовит остаться недовольным, а потом написать где-то в этих ваших интернетах разгромный отзыв. Бизнесмен хватается за голову, кричит ему вслед: «Вернись, я все прощу (исправлю, сделаю хорошо и даже лучше, ну и так далее)!», перечитывает в ночи отзыв и мучается вопросом: «Почему все пошло не так?» Но потребитель непреклонен, а еще эти коварные конкуренты не дремлют.

И тут в помощь озадаченному предпринимателю приходит Customer Journey Map (далее CJM), или карта путешествия пользователя. Вот как, например, она может выглядеть:

Вот еще несколько известных примеров таких карт:

Главный принцип работы с CJM — потребитель является центром мироздания. Ему неинтересны вехи истории бизнеса и годы его эволюции: он ведь название компании узнал три минуты назад. Так что смотрим на все глазами пользователя. Особое внимание уделяется его психоэмоциональному состоянию в процессе потребления — тут на помощь приходят всякие графические штуки типа шкалы настроения и смайликов.

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

О продукте

Однажды мы в UXPresso подумали: «А почему бы не сделать онлайн-сервис для построения Customer Journey Map, который был бы простой, как Excel, красивый, как Photoshop, и в то же время удобный, как доска с разноцветными стикерами, а еще радовал бы глаз, грел душу и приносил деньги?» И замутили UXPressia, и так нам это понравилось, что до сих пор не можем остановиться.

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

В общем, оказалось, что такая потребность есть. Люди нынче образованные, ту самую книгу про Service Design читали все, предоставлять плохие услуги никто больше не хочет.

Мы ориентировались на две группы пользователей: «опытных» и «начинающих». Тем, кто знаком с техникой CJM, читал умные книжки, проводил воркшопы, лепил стикеры и так далее, мы хотели обеспечить достаточную гибкость, чтобы инструмент можно было использовать на совершенно разных проектах. Для тех, кто с техникой на вы, а то и вовсе использует ее впервые, мы хотели добавить полезности: не нудные получасовые видео «Как создать карту» с гундосым мужским голосом, а вспомогательные обучающие материалы по самой технике. Инструмент мы хотели сделать достаточно простым — и, если верить отзывам наших пользователей, справились с этим.

Об истории создания (и чуть-чуть о создателях)

Первые мысли о таком продукте появились у нас в начале 2014 года и очень будоражили воображение. Мы не стали откладывать их в долгий ящик, так что к апрелю 2014 года был готов прототип и даже началась разработка.

В мае мы провели альфа-тестирование в закрытом кругу: были приглашены опытные коллеги, знакомые с техникой CJM и не раз использовавшие ее на реальных проектах, — около десяти человек. Они давали честные (и не всегда приятные, но мы их простили) отзывы, вносили предложения и замечания, заодно находили и описывали баги в работе сервиса. Так мы сэкономили на QA (шутка).

После доработок по результатам первого тестирования мы провели еще одно тестирование — уже на более широкой выборке, в том числе среди студентов курсов ITMINE. На этот раз следили за двумя группами пользователей: как за опытными, так и за новичками (те, кто составлял CJM в первый раз). Много думали.

В ноябре 2014 года сервис обрел нынешнее название, заменившее рабочее 'CJM Online', окончательно оформилась концепция бренда UXPressia и появился логотип.

Наконец в конце 2014 года сервис был запущен, а в январе 2015 года у него появилась платная версия. Первую припасенную бутылку текилы мы (без главного разработчика Стаса, он не пьет и радовался тихо) откупорили в начале апреля 2015 года, когда появился первый заплативший пользователь.

Сейчас у нас несколько тысяч пользователей и очень много обратной связи от них. Аудитория получилась разношерстная: есть и одинокие рейнджеры, и крупные Service Design- или UX Design-компании (больше чем с 200 пользователями), очень много продуктовых компаний (от банков до магазинов сантехники).

С пользователями нам, можно сказать, повезло. Поскольку большинство из них — так или иначе наши коллеги, они дают очень конструктивную и понятную обратную связь: не забывают указывать версии браузеров и ОС, даже скриншоты присылают. Все пожелания мы рассматриваем, и они учитываются при принятии решений о дальнейшем развитии сервиса. Ну, если совсем честно, учитываются не все — иначе мы бы превратились в JIRA (здесь должно быть название вашей нелюбимой баг-трекинговой системы).

Теперь о конкурентах. Когда мы начинали, у нас было три главных конкурента: стикеры, Excel и очень большой, страшный и дорогой Touchpoint Dashboard. Если бы у нас было десять свободных разработчиков и не было никакого чувства юмора, мы бы сделали второй Touchpoint Dashboard, только с красивыми иконками — но все было ровно наоборот.

Судя по всем опросам, самый популярный инструмент для построения CJM — это бумага, доска (или даже стена) и стикеры. В идеальном мире, когда команда заполняет карту, ответственный сотрудник как-то оцифровывает ее и поддерживает в актуальном состоянии (конечно, если он достаточно ответственный). Это происходит не всегда, и в результате стикеры со временем осыпаются, как листья по осени, и бесследно исчезают, а идеи и инсайты по улучшению сервиса не доходят до реализации. У нас так тоже было: заполнять карту круто и весело, а оцифровывать — скука скучная.

Другой не менее популярный инструмент — Excel (который можно назвать меньшим злом). Результаты не теряются, использовать его умеют все. Правда, результат работы не будоражит умы и не мотивирует что-то менять в сервисе. 2015 год на дворе, в этих ваших интернетах CJM одна другой краше, а у вас — табличка в Excel, да еще и без картинок. На время и для внутреннего использования такой вариант подойдет, но чужим его и показать-то неприлично.

Когда мы переходили от идеи к началу работы над проектом, мы с Никитой Ефимовым как-то были на конференции UX Poland. Буквально за день опросили 15–20 человек, которые используют в работе Customer Journey Map. Все они говорили, что используют стикеры и бумагу, а если итоги работы нужно продемонстрировать заказчику, то нанимают отдельного дизайнера для красивой визуализации.

Про конкурентов и почему мы лучше

Всегда возникает дилемма: сделать быстро, но используя только стикеры и Excel, или медленно и с привлечением дизайнера, зато красиво и наглядно. Мы когда-то даже Visio использовали, но это было давно, и при воспоминании об этом у Аси ( UX-аналитик компании — прим. ред.) дергается глаз. Сегодня выбор стал побольше, существует десяток-два сервисов, с помощью которых можно создать CJM. По возможностям их можно разделить на несколько типов:
  • Онлайн-доски (например, Mural.ly и Realtimeboard.com). Среди шаблонов есть один универсальный шаблон CJM, но его слишком неудобно подгонять под себя. Ну и еще в реальной жизни стикеры клеить прикольно и весело, они такие разноцветные, а в цифровой среде — лень и долго.
  • Специальные сервисы конкретно для создания CJM. Самый известный из них — Smaply. Остальные либо очень уж ограничены в возможностях, либо локальны (есть сервисы на японском и немецком языках без английских версий, есть очень простое и маленькое приложение для iPad).
  • Монструозные сервисы с возможностью параллельного сбора разной статистики (Touchpoint Dashboard, Totango, Journifica). Можно подключать опросы пользователей и сбор статистики через всевозможную сетевую аналитику. В таких сервисах можно отслеживать выполнение выставленных KPI — часто умный сервис сам считает нужные показатели и формирует отчеты по ним.
  • Сервисы на базе платформ для ведения бизнеса (Journey Builder на базе salesforce.com, IBM Journey Design, Tandem Seven). Подойдут тем, кто уже использует какую-либо платформу, поскольку иначе усилия и затраты просто не оправдают себя.

В каждом из этих сервисов есть бесплатный пробный период сроком от 15 до 30 дней. Дальше — до свидания, прощайте, карты. Минимальная стоимость — $7 в месяц при условии приобретения подписки сразу на год (Realtimeboard.com) либо $10 в месяц при разовой покупке. Максимальную не ограничит даже ваша фантазия.

У UXPressia сейчас есть два тарифных плана.

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

Второй план — Pro, $9 в месяц. Он позволяет создавать неограниченное количество CJM, экспортировать готовые карты в PNG или PDF и делиться ими с неограниченным числом людей. Чтобы усилить эффект, повторим: неограниченное, неограниченное, неограниченное. В ближайшем будущем — создание корпоративного плана.

Про фичи

Сегодня UXPressia позволяет составлять CJM-карты для линейных процессов. Для каждой карты доступны ячейки следующих типов:
  • Текстовые.
  • Текстовые с фоновой графикой, чтобы показать процессы разных типов (линейный, нелинейный, циклический) или каналы взаимодействия клиентов с бизнесом.
  • Цитаты (по сути, те же текстовые ячейки, но курсивом и с красивыми кавычками). Мелочь, но, судя по отзывам, добавляет правдоподобия.
  • Проблемы и идеи — те же текстовые, но красного и зеленого цветов.
  • Картинки. Можно вставлять скриншоты интерфейса, фотографии пользователей, да хоть котиков.
  • Видео. Можно вставить запись с YouTube-сессии прямо в карту — Excel так не умеет.
  • График эмоций с возможностью дополнить их смайликами, чтобы не только описать действия и мысли пользователя, но и наглядно показать его эмоциональное состояние на конкретном этапе и его изменение на протяжении всего «путешествия».
  • Документы: можно прикрепить к карте, например, результаты опроса.

Кроме этого, к каждой карте можно добавить человека, который будет подстегивать эмпатию. Глядя на него, вы будете генерировать идеи, вопрошая: «Ну, что тебе не нравится, дорогой мой мистер N?»

UXPressia поддерживает экспорт карт в PNG и PDF. Первый красивый (темненький), второй — принтер-френдли (то есть беленький, для экономии чернил).

Что касается совместной работы, сейчас можно поделиться картой с помощью прямой ссылки или отправить ее на конкретные почтовые адреса. В будущем планируем полноценную функциональность по совместной работе — чтобы не хуже, чем в Google Docs.

Теперь о полезных опциях для новичков. Их у нас много:

1. Самое очевидное — раздел Help. В нем мы для наглядности добавили к текстовому описанию гифки для всех ключевых операций

2. Примеры и описания для каждого типа ячейки.

3. Для ячеек типа Ideas и Problems мы собрали полезные советы для мозгового штурма.

4. На старте, сразу после регистрации, пользователям доступны два готовых примера заполненных карт (и еще несколько появится в ближайшем будущем).

Если в процессе работы с UXPressia появляются какие-то вопросы (а также замечания, предложения, или просто хочется «поговорить об этом»), можно написать нам. Мы всегда отвечаем на письма. А еще ведем Twitter — там тоже можно задавать нам вопросы и писать отзывы.

Такую карту путешествия пользователя можно составить для туристического агентства. Десять шагов, пять строк — и сразу всем все понятно

Про то, как сделать карту (кратко)

Наш раздел Help достаточно информативен, но у нас также есть вот такая штука с пошаговой инструкцией о том, с какого конца подойти к составлению CJM.

Про то, как сделать карту (подробно)

Пойдем по шагам.

1. В самом начале нужно понять назначение карты путешествия и выявить бизнес-цели компании, предоставляющей услугу. Под эти цели при желании можно выделить в таблице отдельную строку, чтобы можно было отследить, насколько бизнес-цели компании совпадают с целями потребителя, — но это совсем не обязательно.

2. Далее нужно обязательно создать персону. В нашем случае это будет офисный клерк Мария, у которой есть свои привычки, а доход позволяет потратить энную сумму на такую маленькую девичью радость, как чашка кофе в середине рабочего дня. (Тут стоит пояснить, что Маша к нам не с потолка упала, она представляет из себя результат анализа целевой аудитории компании.)

Такой подход позволяет визуализировать своего пользователя. Перед вами возникает не абстрактный представитель целевой аудитории, а живой человек со своими взглядами и желаниями, который и является пользователем вашего товара или услуги и для которого вы будете его совершенствовать. Согласитесь, странно принимать спорные решения, зная, что Мария, пусть и абстрактная, будет разочарована.

3. После этого начинается построение самого CJM. Для начала на нем необходимо выделить все этапы и точки взаимодействия Маши с компанией. Рекомендуем делать это параллельно, потому что очень часто точки взаимодействия помогают легко выявить этапы и наоборот.

У Маши проходит несколько этапов от возникновения потребности попить кофе до рассказов о кофейне коллегам и друзьям уже после того, как кофе выпит.

История про Марию, девушку 26 лет от роду, жизненная и не придуманная (почти)

Мария, ведущий менеджер ООО «Ромашка», примерно в 16:00 отчиталась руководству об окончании важного этапа своей работы и решила себя за это вознаградить чем-то вкусным. «Почему бы не кофе?» — подумала Маша и спросила коллег, нет ли чего-нибудь интересного по соседству. Кто-то вспомнил, что неподалеку открылась кофейня с кофе навынос. Приложение в смартфоне это подтвердило, в отзывах не оказалось ничего ужасного, и вот наша Маша отправляется в путь.

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

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

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

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

4. Итак, мы выявили все этапы и точки соприкосновения. Этапов у нас семь (рисунок ниже), им присваиваются названия, точки соприкосновения сразу же указываются в соответствующей строке под каждым из этапов. Так вы сразу начнете систематизировать сведения о каналах связи с вашим пользователем, его способах получения информации, а заодно о том, какие проблемы возникают при использовании этих каналов и где контакт с пользователем может быть разорван.

5. Далее мы указываем ожидания пользователя от взаимодействия с компанией и описываем сам процесс взаимодействия. На этом этапе нужно использовать результаты опросов и интервью с пользователями, всевозможные отзывы, которые они оставляют у вас на сайте или где-то в интернете (рекомендуем искать их везде, от соцсетей до всевозможных форумов и обсуждений в приложениях).

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

7. Строка «Цитаты» используется довольно редко, однако в данном случае она имеет смысл: мы можем указать в ней реальные слова реальных людей, взятые откуда-то из отзывов.

8. В нашем сервисе есть возможность для наглядной демонстрации изменения эмоционального состояния Маши на протяжении всего процесса — строка, в которой можно проставить смайлики и обозначить эти изменения в виде графика. Это очень наглядно и позволяет сразу акцентировать внимание на проблемных моментах.

9. Далее мы описываем проблемы. Как правило, выявить их можно, внимательно читая отзывы. Не стоит отнекиваться от них, говоря, что проблема решена — это просто пользователь глупый. Пользователь не глупый. Значит, вы недостаточно проработали проблему, раз он не понимает, как ее решить. Также можно попробовать себя в роли анонимного покупателя или использовать в этой роли кого-то, чьему мнению вы доверяете. Плюс здравый смысл — о нем всегда стоит помнить.

10. После описания проблем стоит позвать коллег и начать генерировать идеи для их решения (если, конечно, вы не позвали их раньше). Тут действуют те же принципы, что всегда: записывать все подряд, не отмахиваться даже от самых фантастичных идей и помнить о нашей Маше: что если бы вместо участия в бонусной программе сейчас ей предложили оставить email, куда ей пришлют ссылку на форму регистрации в программе, как бы она к этому отнеслась.

При желании можно добавить к каждому этапу изображения. Это могут быть картинки из нарисованной от руки story board, визуализация точек соприкосновения, снимки экранов (если речь идет о мобильном или веб-приложении) и так далее.

Вот что у нас в итоге получилось.

Про исключения

Сейчас UXPressia.com позволяет легко и быстро строить карты для процессов, у которых есть начало и конец. Для нелинейных процессов он вряд ли подойдет, хотя вы можете проявить смекалку и попробовать.

Пока UXPressia является инструментом для определенного этапа работы UX-специалиста или бизнес-аналитика. К нему не получится прикрутить аналитику, чтобы он все сам собирал и записывал, куда надо, — все KPI придется считать самостоятельно и заносить в карту ручками. Также он не заменит таск-трекеры: это направление мы сознательно решили не развивать. Комбайна не будет.

Хотя к таблице можно прицепить и картинки, и видео, и прочие документы, хранить все это добро у нас в сервисе не получится: места маловато, да и не для того мы все это затевали. Может быть, когда-нибудь — но не в этот раз.

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

Про перспективы

Однажды Алексей Копылов написал: «Customer Journey Map — это, пожалуй, лучший инструмент UХ за последние десять лет (после персонажей)». Так что мы считаем, что мы в самом начале развития UXPressia.

Тема опыта пользователя и его поэтапного взаимодействия с бизнесом все чаще звучит на разных конференциях и форумах — CJM как инструмент становится все более популярен. Что приятно, у нас уже есть пользователи во всех часовых поясах. Что менее приятно, вопросы в поддержку прилетают в любое время суток. Так что со временем мы задумаемся о локализации и сервис заговорит на нескольких языках.

В дальнейшем мы будем развивать наш сервис в нескольких направлениях:

  1. Мелкие улучшения самого инструмента и полезные материалы. Например, мы уже сейчас активно работаем над созданием шаблонов для CJM в разных отраслях. Каждый шаблон сделан на базе найденных в открытом доступе десятков карт, содержит уникальное сочетание этапов и разрезов взаимодействия и даже черновую персону. Причем у шаблонов будут бесплатные версии для скачивания в формате PDF.
  2. Крупные фичи: крутая визуализация процессов разного вида, совмещенная с каналами взаимодействия. Слои на одной карте (можно будет сравнить путешествие для разных пользователей, или путешествие as is/to be). Collaboration. Может быть даже однажды придумаем, как красиво строить круглые карты.
  3. Новые инструменты в рамках UXPressia. Следующие на очереди — персоны, потом — инструмент для построения Impact Map. Когда все три инструмента будут красиво интегрированы друг с другом, наступит мир и счастье во всем мире.
Популярные статьи
Показать еще
Комментарии отсортированы
как обычно по времени по популярности

Отлично! Уволюсь из Газпрома, открою компанию и куплю прем = )

0

Я что-то не нашел на сайте переключалку на русский. Не подскажете где она?

0

Здравствуйте, Игорь.
Локализации интерфейса на другие языки сейчас нет. Это в планах (правильнее сказать, что это в списке потенциальных вещей, которые мы собираемся делать), но не самое приоритетное. Тем не менее, саму карту можно заполнять на русском языке.

0

Попользовался, купил подписку. Непонятно как работает если редактировать совместно над проектом - не синхронизируется, многовато глюков с JS(панелью редактирования текстов), не масштабируемо и не гибко, нельзя объеденять ячейки(часто например процессы и точки взаимодейтсвия на различных стейджах нельзя разделить, процесс единый и неразрывный или циклический).
Вобщем штука клевая и полезня, но в реальности тот же эксель более гибкий))

Максим, Uxpressia для линейных процессов подходит пока.
CJM можно попробовать построить также в Mindmeister, например.

0

да можно, но специализированый инструмент конечно иметь удобнее.

0

Максим, спасибо за обратную связь! Рад, что наша штука для Вас клевая и полезная (:
Более удобная одновременная работа над проектом -- одно из приоритетных направлений для работы. Более гибкая работа с ячейками тоже в списке.
А не могли бы Вы пояснить, что вы имеете в виду, когда говорите
- "не масштабируемо"?
- "не гибко"?

0

Возможность комментирования статьи доступна только в первые две недели после публикации.

Сейчас обсуждают
Андрей Малолин

Так начинающему или совсем без опыта работы?

Почему в Санкт-Петербурге сложно найти дизайнера интерфейсов
0
Константин Фанки

Что за Codewise? Кто нибудь слышал про них до этого рейтинга?

Avito оказалась единственным российским представителем в рейтинге Deloitte Technology Fast 500
0
Den Neustroev

Складывается впечатление, что вы из Avito.

Avito оказалась единственным российским представителем в рейтинге Deloitte Technology Fast 500
1
Gregory Golovanov

У нимакс вполне себе московский ценник

Почему в Санкт-Петербурге сложно найти дизайнера интерфейсов
0
GaLL

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

Почему в Санкт-Петербурге сложно найти дизайнера интерфейсов
0
Показать еще