Юзабилити-тестирование — большой гайд

• Что такое дизайн UI/UX
• Важность UI/UX
• Что такое юзабилити
• Что такое юзабилити-тестирование
• Что такое тестирование UI/UX
• Почему тестирование UI/UX очень важно
• На что обращают внимание в первую очередь
• Как эффективно тестировать юзабилити
  • Определение, что тестировать
  • Определение пользователей
  • Выбор метода
  • Запись сценариев
  • Анализ результатов и коррекция UI/UX
• Чеклист тестирования UX
• Чеклист тестирования UI
• Инструменты
• Автоматизация
• Сколько пользователей нужно?
• Советы

Что такое дизайн UI/UX

Дизайн UI (пользовательского интерфейса) — разработка вида/дизайна программного продукта; каждый экран, кнопка, страница, и все прочие визуальные компоненты, видимые на экране приложения/странице.

Дизайн UX (User Experience) — стратегия улучшения впечатлений пользователей посетителей от взаимодействия с продуктом.

Важность UI/UX

Приятный и удобный вид приложения/сайта и позитивные впечатления пользователей — генератор прибыли в бизнесе и средство привлечения новых пользователей. 

Что такое юзабилити

Юзабилити — это общая комфортабельность продукта, с точки зрения пользователя. Просто ли освоить продукт, научиться работать с ним? Как быстро пользователь/клиент получает то что ему нужно? Есть ли в приложении или на странице что-то, что его раздражает? Проще говоря, юзабилити — это «точка соединения» UI+UX.

Что такое юзабилити-тестирование

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

Что такое тестирование UI/UX

Это тестирование пользовательского интерфейса и пользовательских впечатлений в программных продуктах.

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

Тестирование UX оценивает, как продукт влияет на общее впечатление пользователя (то есть User Experience). Тестирование UX — это о комфорте пользователя. Такое тестирование включает все аспекты UX, от разметки и дизайна интерфейса до тонкостей подачи контента. Оно определяет проблемы с комфортабельностью, например меню, неудобные для навигации, некорректная или просроченная информация, или медленно реагирующие кнопки.

Почему тестирование UI/UX крайне важно

Любая проблема с комфортабельностью продукта приводит к тому, что по крайней мере часть пользователей отказывается от продукта. Это может быть даже небольшая проблема, например некорректная отрисовка какой-то не очень важной кнопки, или слишком мелкий шрифт.

Позитивное впечатление пользователей — это то что привлекает пользователей и удерживает их.

Хорошей практикой является проводить тестирование UI/UX на ранних этапах процесса жизненного цикла разработки. Это позволяет вовремя определить любые проблемы с юзабельностью и устранить их до релиза, экономить время и усилия, поскольку устранение багов на поздних этапах цикла обходится намного дороже, и приносит больше проблем.

На что обращают внимание в первую очередь

Доступность

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

Легкость восприятия

Чтобы быть доступным для восприятия, контент в продукте должен быть доступен пользователям через привычные им способы, которыми они обычно пользуются. Все части интерфейса должны быть понятны, а также иметь некие альтернативные варианты. Например, на случай если из-за низкой скорости интернета изображение не загружается, оно должно иметь alt-текст и/или поясняющую подпись.

Скорость и производительность

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

Понятный интерфейс

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

Удобство навигации

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

Плавность

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

Также юзабилити-тестирование контролирует:

• Целостность, последовательность и логичность контента
• Совместимость
• Легкость освоения/обучения работе с продуктом
• Надежность, точность и практичность контента и навигации

Как эффективно тестировать юзабилити

1. Определить, что будет тестироваться

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

2. Знать своих пользователей/клиентов

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

3. Выбрать методы

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

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

Модерированное юзабилити-тестирование

Сессия выполняется в присутствии тестировщика, или удалённо. Тестировщик представляет тест участникам, отвечает на их вопросы, и задает уточняющие вопросы. Нужно подобрать время, удобное обеим сторонам, локацию, и методику отслеживания и анализа ответов/результатов. Такие тесты удобнее выполнять в специализированных помещениях (лабораториях), что дает прекрасные результаты, но они могут быть довольно дорогими в подготовке и проведении.

Немодерированное тестирование

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

Удаленное тестирование

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

«Герилья»

Проводится в публичных местах, например кофешопах или парках. Такое тестирование позволяет быстро оценить продукты. Конечная цель: не «обозначить присутствие», то есть не рекламная, не улучшить узнаваемость/продажи бренда, а для прототипирования, то есть для проверки, как прототип приложения работает с реальными пользователями.

Интервью по телефону

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

Также могут быть дополнительные методы тестирования:

• Лабораторное тестирование
• Запрос по контесту
• Немодерированное удаленное тестирование
• Оценка экспертами по юзабилити
• Сравнительное тестирование (сравнение с конкурентами в нише)
• Исследовательское тестирование
• «Сортировка карт» — специфический тип тестирования юзабилити, при котором эксперты/пользователи сами пытаются сформировать лучший дизайн, с их точки зрения, из готовых карточек-блоков
• Трее-тестирование, в дополнение к предыдущему, для формирования удобной структуры меню
• Социологические опросы
• Запись пользовательских сеансов тестирования

4. Запись сценариев

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

5. Анализ результатов и коррекция UI/UX

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

Чек-лист тестирования UX

• Навигационные элементы везде, как в основном модуле (странице) так и в дополнительных (вложенных)
• Кликабельность кнопок наверху и в «подвале»
• «Продающие» CTA-элементы
• Редиректы и все ссылки
• Производительность и плавность
• Является ли приложение mobile-friendly, приспособленным к экрану смартфона
• Является ли контент читабельным и четким
• Все кликабельные элементы
• Проверить сообщения об ошибках / успешном выполнении операций
• Не допускать «нагромождения» элементов

Чек-лист тестирования UI

Чтобы проверить плавность взаимодействия пользователя с интерфейсом, предполагается чек-лист UI-тестирования:

• Элементы интерфейса — позиционирование, размер, длина и ширина всех UI-элементов
• Шрифты — размеры, интервалы и гарнитуры
• Иконки и цвета, их сочетания
• Поля пользовательского ввода
• Ввод в поля цифр, текста, специальных и невалидных символов
• Поведение UI-элементов на экранах разного размера
• Скроллинг (особенно в таблицах)
• Прогресс-бары
• Самые Главные Кнопки (Сохранить, Изменить, Удалить, Расшарить и т.п.)
• Выпадающие меню
• Предупреждения
• Шорткаты и элементы меню

Инструменты

Часто применяемые инструменты юзабилити-тестирования:

GTmetrix

Создание финальных отчетов по страницам, рекомендации по устранению проблем

Ссылка

Lool11

Мощная платформа пользовательского тестирования. Модерируемые и немодерируемые тесты на отдельных фреймворках

Ссылка

Optimizely

Задание условий, при которых растет прибыль, регистрации, загрузки, и потребление контента

Ссылка

Crazy Egg, Hotjar

Хитмапы, как пользователи работают с приложением

Ссылка на CrazyEgg, вот на Hotjar

BrowserShots

Инструмент семейства BrowserStack. Скриншоты сайта в разных браузерах и ОС, через онлайн-сервис

Ссылка

Maze

Инструмент прототипного тестирования UI/UX. Интеграция с инструментами дизайна типа Figma и Adobe XD

Ссылка

Zurb

Оценка, нравится ли пользователям дизайн сайта, что запомнилось

Ссылка

UXPunk

Позволяет построить иерархию контента на сайте, самые важные страницы (полезен, но не всегда доступен)

Ссылка

Автоматизация UI/UX

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

Например, можно автоматизировать ввод данных и анализ, пользуясь платформами для UX-тестирования и вспомогательными инструментами, получая более-менее надежные данные из приложений типа Hotjar или UserReport. Однако нельзя наблюдать в реальном времени за поведением реальных пользователей в любом из перечисленных инструментов. Поэтому в юзабилити принято ручное тестирование.

Сколько пользователей нужно?

Некоторые научные исследования говорят, что всего 5 пользователей достаточно, чтобы определить 80% проблем с юзабилити. Для небольших проектов этого достаточно; в зависимости от продукта, это число может быть больше на порядки.

Советы

• Тестировать раньше в жизненном цикле, чтобы получить результаты раньше
• Позаботьтесь, чтобы направленность приложения была яснее пользователям
• Задавайте пользователем вопросы, предполагающие подробные ответы. Начинайте с простых, завершайте сложными
• Опирайтесь на пользователей, которые дают ясные четкие ответы
• Внимательно наблюдайте за поведением и внимательно слушайте
• Не пытайтесь решить все сразу, сначала устраняйте самые важные проблемы
• Включайте в процесс всю команду, разные точки зрения и разный бекграунд поможет лучше понять проблемы
• Просите участников размышлять вслух в процессе тестирования