Библиотека маркетолога

Как создавать юзабилити правильно

Павел Рысков Исполнительный директор, ГК «Мир рекламы», Участник экспертного совета ИРИ, Вице-президент по рекламе Внешторгклуб, трекер ФРИИ

Юзабилити сайта – один из ключевых моментов успешного продвижения в Интернете. Простыми словами - это совокупность качественных характеристик, определяющих удобство пользования, продуманность интерфейса и эргономичность сайта. Юзабилити – необходимое промежуточное звено, обеспечивающее связь между рекламой и продажами. О важности этого фактора часто забывают, уделяя внимания только рекламе, при этом, именно юзабилити позволяет конвертировать рекламу в продажи и обращения клиентов. Правильный подход к данному понятию предполагает использование определенной методологии и релевантных инструментов, которые дают возможность двигаться в нужном направлении, так как стандартные рекомендации не всегда работают. И прежде чем использовать «советы гуру», необходимо проанализировать, что подойдет именно для вашего бизнеса.

Часто используют ещё одно понятие – user experience (UX), что означает совокупность впечатлений, возникающих у пользователя при взаимодействии с нашим сайтом. Именно UX во многом определяет, совершит или не совершит пользователь покупку. Также на Западе появилось такое понятие, как design thinking. Данное понятие относится не только к web-дизайну, а дизайну в целом, например, стул, стол; все, чем мы пользуемся.

Design thinking – это целая наука, позволяющая сделать user experience вашего продукта.

Конверсия сайта является прямым следствием качества юзабилити.

Остановимся подробнее на основных причинах, которые мешают пользователю совершить покупку (сделать заказ).

По данным исследования, представленного на рис.1 , следует отметить следующие моменты:

Рис. 1 Исследование Webcredible и Marketing shepra.

  1. Основным фактором, препятствующим совершению покупки, является отсутствие полной стоимости товара при начале оформления заказа.
  2. Необходима регистрация до покупки. По этому вопросу идет настоящая битва между маркетологами и единого мнения на данный момент не существует.
    Регистрация нужна игрокам рынка для того, чтобы получить данные о покупателе для вовлечения его в программу лояльности, информирования об акциях и предложениях, так как e-mail – это самый доходный и конверсионный канал, впоследствии практически бесплатный. Покупка без регистрации направлена на продажи прямо здесь и сейчас.
    Поэтому важно разобраться в бизнес-процессах и определить цели именно вашего проекта и тогда станет понятно нужна или не нужна регистрация на сайте.
  3. Покупатели делали лишь сравнение товаров. Кстати, это любимая отговорка очень многих продавцов: «Они же просто сравнивали…».
    Необходимо понимать, что если клиент сравнивает товары, значит у него уже есть сформированная потребность, однако его не подтолкнули к покупке, не привлекли внимание на сайте, и он ушел. Такие моменты обязательно необходимо прорабатывать, например, размещать дополнительные триггеры для того, чтобы клиент остановил свой выбор на имеющемся продукте или услуге;
  4. У покупателя не было достаточно времени, чтобы закончить оформления заказа – здесь прямая связь с удобством сайта. Алгоритм не доработан для совершения заказа, следовательно, он нуждается в улучшении и упрощении.

Также один из ключевых моментов - расположения контента.

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

Рис.2 Исследование читаемости текста. Источник: Software Usability Research Laboratory

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

Рис.3 Результаты исследования движения глаз. Источник: Alertbox

Однако здесь важно учитывать национальные, культурные и этнические особенности аудитории. Повсеместно внедрять подобный совет неуместно. Отличный пример, подтверждающий данный тезис – сайт компании BBC. Мы знаем, что европейская цивилизация читает слева направо (тексты, указатели и пр.) и для нее информация будет актуальна. Зато для арабской, азиатской или иной культуры подобный совет не сработает.

Рис. 4 Сайт компании BBC World Service.

Теперь давайте рассмотрим вопрос юзабилити в историческом ракурсе и начнем с традиций создания отечественных сайтов.

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

При этом есть много сайтов, на которых ничего не менялись много лет. К примеру, для Западной Европы характерен некоторый консерватизм и традиционность, особенно для немецких сайтов.

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

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

В чем же причины таких различий? Безусловно, это:

  • география пользователей;
  • традиции и ментальность;
  • положение компании на рынке;
  • сфера бизнеса;
  • целевая аудитория.

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

Гораздо более правильный и логичный подход к созданию юзабилити – это гибкий подход (Agile) (рис.5).

Рис.5 Гибкая методология разработки (agile-метод)

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

Мы анализируем, что необходимо сделать или улучшить, затем формируем список для разработки (доработки), он реализуется, и снова происходят измерения и аналитика. Этот процесс цикличен.

И таким образом, мы видим, как каждое улучшение влияет на конечный результат.

Однако, мы все же часто сталкиваемся с «красивыми сайтами», особенно это касается сферы искусства, ювелирных изделий, когда акцентируется внимание на том, КАК выглядит сайт, а не КАК пользователь будет с ним взаимодействовать.

Как же тестировать юзабилити «по уму»?

Рассмотрим данный вопрос на наглядном примере – RBS Group.

Задачей было полностью пересмотреть и улучшить юзабилити портала, содержащего более 500 000 страниц.

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

В итоге были построены графики, где зеленым цветом отмечен правильный путь, красным цветом – пути, которыми пользователи шли неправильно, то есть некоторые пользователь пошли по данному пути, но он не вел к цели. И красные точки – это места, где пользователь долго думал, прежде чем совершить следующее действие.

Дальше определяется, сколько пользователей достигли цели. В нашем случае – это 75%, что на самом деле, не очень хороший показатель.

В результате мы видим более детальный график, где показано, что сразу достигли цели только 50%, 25% пользователей еще «погуляли» по сайту перед тем, как завершить задачу. Кроме этого, есть существенная часть пользователей, которые не достигли цели.

Такие моменты следует отслеживать и тогда, проведя грамотную аналитику, вы сможете правильно продумать юзабилити для своего сайта.

Теперь перейдем к основным подходам к тестированию юзабилити:

Тестирование с моделированием (сессии лицом к лицу) - когда вы готовите свой портал, то общаетесь непосредственно с представителями целевой аудитории. Варианты данного подхода следующие:

  • Лабораторное тестирование
  • «Коридорные» или личные опросы. При данном подходе к тестированию, если вводятся какие-либо изменения в продукт/услугу, они непосредственно проверяются на целевом пользователе, там где он использует данный продукт/услугу. Данная методика широко применяется для запуска стартапов, особенно в Европе. Правда, и у нас, в акселераторе ФРИИ, сейчас при запуске стартапов, участники используют, в том числе, и этот метод.
  • Удаленное интервью (Skype, Teamviewer, …)

Перед тем, как проводить тестирование, необходимо сформулировать гипотезы, например, как показано на рис. 6

Рис.6. Анализ действий пользователя при покупке билета в терминале.

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

Второй вариант тестирования, где в основном находятся главные инструменты, - удаленное независимое тестирование. «Независимое» означает, что вы не находитесь рядом с человеком.

Существуют следующие инструменты удаленного тестирования:

  • Бенчмаркинг юзабилити. Когда вы создаете определенные тесты, которые вам нужно. Допустим, надо найти такой-то товар на сайте, надо положить что-то в «Корзину», и т.д. Далее заводите это в систему, она создает определенные ссылки, вы ставите скрипт на сайт и получаете ссылку. Пользователь переходит по ней и пробует выполнить ваш тест.

Рис.7 Программа для бенчмаркинга юзабилити - //www.loop11.com/

В итоге вы получаете аналитику. Рассмотрим данный момент на примере портала Yahoo! (рис.8), Строка, которая выделена красным, показывает, что 83% пользователей не смогли найти цену на Apple iPad. Следовательно, получая такие результаты, вы должны понять, что надо что-то менять. В таком тесте необходимо прописывать критические для вас цели.

Рис.8 Юзабилити тест портала Yahoo!

Следующее, опросы-тесты (рис.9). Суть заключается в том, что вы создаете варианты страницы 1, 2, 3 и пользователь выбирает ту, которая ему больше понравится.

Рис.9 Программа для проведения опросов-тестов - //verifyapp.com/

  • онлайн тесты на основе карт поведения (рис.10). Вы предлагаете пользователям самим распределить элементы на вашем сайте, так, как им кажется, что будет удобнее.

Рис.10 Программа для проведения онлайн тестов на основе карт поведения - https://www.optimalworkshop.com/

И удаленное независимое тестирование с записью (рис.11). Вы даете задание и пользователи из разных стран (конечно, если вам это нужно) просматривают ваш сайт в онлайн-режиме и рассказывают, что они делают. Таким образом, вы получаете записи, которые можете анализировать с командой и дорабатывать недочеты, так как видите, где у пользователей возникали проблемы при взаимодействии с сайтом.

Рис.11 Программа для проведения удаленного независимого тестирования с записью - //whatusersdo.com

Еще хотелось бы рассказать о сервисе онлайн тестирования на основе карт поведения и карт первых кликов - Optimal Workshop. Вы даете задание пользователем, например, положить товары в корзину, и смотрите, куда первым делом они начинают кликать. Таким образом, определяются те места, которые отвлекают пользователя и не дают ему выполнить задание – покупку (рис.12)

Рис.12 Онлайн тестирование на основе первых кликов

На рис. 13 представлено онлайн тестирование на основе карт поведения.

Рис.13 «Дерево» поведения пользователей на сайте

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

И последнее, это стандартные инструменты: Google Analytics и Яндекс.Метрика, которые имеют несколько разделов, позволяющих анализировать именно юзабилити (страницы выхода, тепловая карта в Google и вебвизор, карта кликов в Яндекс).

Карта кликов. Если на какой-то раздел, который не приносит конверсий, много кликают, то его надо или убирать, или уменьшать, или переносить. Пользователя необходимо направлять по пути покупки.

Рис.14 Карта кликов

ВебВизор (рис.15) – простой вариант аналитики, где вы можете видеть поведение пользователя, но, к сожалению, не сможете узнать, что он хочет и почему уходит.

Рис.15 Вебвизор

Карта поведения (рис.16). Зеленым цветом показано, куда пользователи переходят с каких страниц, а красным – с каких уходят.

Рис. 16 Карта поведения
Кликните по изображению, чтобы его увеличить

Страницы выхода (рис.17) показывают аналогичную информацию в текстовом виде.

Рис. 17 Страницы выхода
Кликните по изображению, чтобы его увеличить

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

А теперь, хотелось бы поделиться с вами нашим опытом проведения сплит тестирования.

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

Мы сделали классическое сплит тестирование для центра обучения иностранным языкам. Ниже представлены две версии сайты старая (рис.18) и новая (рис.19)

Рис. 18 Старая версия сайта                                   Рис.19 Новая версия сайта

Были приведены определенные гипотезы, и результат по ним вы можете увидеть на рис. 20.

Рис. 20 Результат сплит-теста

Мы видим, что новая версия оказалась на 23% хуже, чем старая. То есть гипотезы не подтвердились и, обратите внимание, что тестировались наши предположения уже на «живом» трафике. Тестирование на реальном трафике несёт риски потери обращений, поэтому надо стараться применять в первую очередь подходы, которые помогут вам улучшить юзабилити без потери реальных заказов.

Важно понимать, что либо вы предварительно тестируете юзабилити сайта с помощью специальных сервисов (о которых говорилось выше), и оправдываете/не оправдываете свои гипотезы, либо тестируете на «живом» сайте, учитывая возможность потреять n-ое количество заявок.

В завершение, хотелось бы подвести небольшой итог:

  1. При работе с юзабилити всегда учитывайте специфику своей целевой аудитории
  2. Прислушивайтесь к «гуру», но анализируйте их советы в разрезе своих бизнес-процессов
  3. Используйте современные инструменты и подходы к созданию юзабилити
  4. Не бойтесь экспериментировать, но делайте это обдуманно