Да куда ты кликаешь? Какие задачи дизайна интерфейса решает метод First Click

При работе над интерфейсом неизбежно возникают вопросы: куда разместить кнопку, какой фон выбрать, как назвать раздел. И тут выручает First Click — наиболее наглядный и простой метод UX/UI исследования. В статье расскажу о возможностях метода и тонкостях применения.

Создатели метода Боб Бэйли (Bob Bailey) и Кери Вольфсон (Cari Wolfson) в 2006 году на основе десятков исследований впервые сформулировали идею: ключевой показатель эффективности интерфейса — это то, насколько успешно пользователь начинает решать задачу

По результатам исследований, если первый клик был верным, то вероятность успешного завершения пользовательского сценария составляет 87% (от 72 до 100). Участники, которые при первом нажатии попадают не туда, выполняли задачу лишь в 46% случаев (от 29 до 70).

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

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

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

Пример: Банк запустил мобильный оператор связи.

Бизнес задача: за n времени на XX% увеличить конверсию на заказ сим карты с сайта банка.

Исследовательская задача: оценить, какой процент людей с первого раза найдет информацию об операторе на главной странице банка.

При просмотре тепловых карт иногда возникает вопрос: 72% успешных кликов это много или мало? В таких случаях помогает сравнение с похожим вариантом или бенчмарком. Метод подходит и для этой задачи.

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

Тестируем старый и новый интерфейсы, себя и конкурентов. Чем больше образцов для сравнения, тем проще дальнейшая интерпретация результатов.

Сравнивать тепловые карты одно удовольствие. Только задание должно быть одинаковое.

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

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

First Click позволяет тестировать пользовательские сценарии (user flow). Принцип все тот же: даем одно задание, последовательно показываем экраны с уточнениями, фиксируем на каждой странице первый клик. По тепловым картам видим, сколько людей теряется на каждом шаге сценария.

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

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

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

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

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

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

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

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

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

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

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

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

Есть 3 подхода проведения First click

First Click количественный метод, эффективен на выборках респондентов более 50 человек. Подходит для тестирования, сравнения отдельных экранов и для проверки пользовательских сценариев.

Метод не требователен к устройству, на котором тестируется экран. Результаты наглядны. Если хотите вкатиться в UX/UI исследований, то First Click - лучший выбор.

Добавляйтесь в друзья в Facebook. Задавайте вопросы про UI тесты на Fastuna.