Тестирование визуального дизайна: узнаёт ли пользователь в айдентике сайта идею бренда

Перевод материала менеджера по цифровой стратегии Nielsen Norman Group Кэтрин Уайтентон.

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

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

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

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

Согласно исследованию Гитте Линдгаард и её коллег, пользователям достаточно десяти секунд, чтобы оценить дизайн. Но если дизайн кому-то нравится, это ещё не значит, что он правильно передаёт черты бренда. Ни вы, ни члены команды, ни руководящий состав не являетесь пользователем продукта.

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

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

Ваш «тестируемый материал» (визуальное представление дизайна) легко адаптировать к различным типам исследований. При очной оценке визуального дизайна можно просто показывать участникам статичную картинку на бумаге или на экране. Страницы на бумаге должны быть реалистичного размера.

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

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

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

1. Пятисекундный тест: во время такого теста вы показываете материал в течение пяти секунд (или другого короткого промежутка времени). Это лучший способ точно зафиксировать инстинктивную реакцию пользователей. Время просмотра в пять секунд — этого слишком мало, чтобы прочитать текст или заметить детали, например, шрифты или цвета, но хватит, чтобы сформировать впечатление, которое точно отражает визуальный стиль.
2. Тестирование first-click: вы даёте участникам конкретные указания (например: «узнайте больше об этой организации») до того, как они увидят дизайн, и останавливаете их, когда они кликнут на нужную область экрана, где завершат задание. У большинства пользователей этот тест займёт всего несколько секунд — они будут не разглядывать страницу, а искать функциональность или ссылку, которая относится к полученному заданию. Остальная часть дизайна будет восприниматься вскользь. Этот тест лучше использовать, если вы предполагаете, что пользователи впервые зайдут на ваш сайт уже с конкретной целью.

Эти два теста легко проводить удалённо с помощью таких сервисов, как 5 Second Test и Userzoom (для пятисекундных тестов) или Chalkmark (для тестирования first-click).

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

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

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

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

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

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

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

• Открытое объяснение предпочтения: попросите пользователей объяснить, почему им понравился дизайн.
• Открытый выбор слов: попросите пользователей перечислить от трёх до пяти слов, чтобы описать дизайн.
• Закрытый выбор слов (тестирование желанности): предоставьте пользователям список слов и попросите выбрать подходящие.
• Численные показатели: соберите численные показатели того, насколько хорошо дизайн отражает конкретные качества бренда.

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

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

Недостаток этого подхода в том, что вы можете получить короткие или неактуальные ответы, если участник немотивирован или просто не умеет выражать свои мысли. Такой метод особенно рискованный в немодерируемом удалённом формате (как, например, опрос), так как у вас не будет возможности уточнить детали с помощью дополнительных вопросов, если кто-то даст расплывчатый ответ вроде «неплохо».

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

Вы можете выяснить, что не учли какие-то факторы, имеющие большое значение для аудитории. В ответе можете получить множество ключевых слов. Их придётся тщательно проанализировать, чтобы разобраться, что важно пользователям.

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

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

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

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

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

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

Самый контролируемый подход — это сбор численных показателей того, насколько хорошо каждая характерная черта бренда выражена в дизайне. Чтобы не затягивать время тестирования, выберите от трёх до пяти наиболее важных качеств бренда и попросите людей оценить, насколько хорошо каждое из них передаётся дизайном (чем больше вопросов у вас будет, тем сложнее анкета и выше шансы на получение случайных ответов).

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Методы, описанные в этой статье, можно использовать отдельно при условиях:

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

#дизайн