Возможно, вы замечали вакансии для дизайнеров и обращали внимание на их заголовки по типу «Ищем UI/UX-дизайнера». И если с UI тут всё довольно понятно, то термин UX у многих, кто ещё не работал дизайнером, вызывает вопросы.
В этой статье Владислав Громыко, участник программы VK Testers, расскажет об этом понятии, его важности и связи с тестированием.
UX и юзабилити: в чём разница?
Основная цель разработчика при создании веб-сайта, приложения или другого продукта — удовлетворить потребности пользователя. Поэтому главная задача состоит в разработке продукта для простого и удобного использования конечным пользователем. Второстепенная задача включает в себя продумывание стиля, который сделает продукт красивым, уникальным, восхитительным и так далее. Однако нельзя сказать, что простой в использовании продукт — гарант хорошего пользовательского опыта.
Рассмотрим случай неудачного UX-дизайна, который вводит в заблуждение на примере WhatsApp. Когда мессенджер вводил функцию удаления сообщений, то реализовал это не так, как пользователи привыкли видеть. После нажатия кнопки для удаления технически сообщение не удалялось в диалоге, а заменялось сервисной заглушкой. Сказать, что это убивало главную идею функциональности, — ничего не сказать.
Разумеется, это не единственный случай неудачного UX-дизайна. Несмотря на то, что подобные случаи выглядят нелепо, стоит учитывать, что проработать грамотный UX-дизайн — непростая задача.
Отчасти причина в том, что пользовательский опыт — крайне широкое понятие. Всему виной смешение конкретного определения с другими терминами, например, с юзабилити. Чтобы исключить подобные заблуждения, дадим определение юзабилити и пользовательского опыта и рассмотрим ключевые различия ниже.
UX (англ. User Experience) означает «пользовательский опыт» и относится ко всем аспектам взаимодействия пользователя с продуктом, услугами или брендом компании и его восприятия.
Под юзабилити (удобством использования) подразумевается то, насколько легко пользователь изучает и использует продукт для достижения конкретной цели. Может ли посетитель легко завершить оформление заказа в вашем приложении? Может ли он быстро и просто найти конкретный раздел на вашем сайте?
Поэтому если цель юзабилити — создать продукт, которым легко пользоваться, то цель UX — сделать пользователя счастливым до, во время и после использования продукта. Это немаловажная задача. Можно сказать, что пользовательский опыт — пирог, а юзабилити — его кусочек. Остальные же три кусочка — ценность, адаптируемость и желаемость.
Так мы и получаем четыре элемента пользовательского опыта. Поговорим подробнее о способах тестирования нашего кусочка пирога — юзабилити.
Что такое юзабилити-тестирование?
Можно сказать наверняка, что без обратной связи от пользователей проекту тяжело быть успешным. Именно поэтому процесс получения, обработки и своевременная реакция на отзывы пользователей необходимы при любых сценариях: будь то разработка ПО с нуля или улучшение уже существующего. В этом и помогает юзабилити-тестирование — метод оценки интерфейса с точки зрения удобства и эффективности использования. Чтобы её добиться, нужно привлечь представителей целевой аудитории программного продукта.
В юзабилити-тестировании выделяют два этапа: прохождение пользователем N-го количества задач (количественные или качественные тесты), а также беседу, заполнение опросников или глубинные интервью с пользователем (качественное исследование).
В ходе юзабилити-тестирования члены команды проекта наблюдают и анализируют, как пользователи выполняют задачи или проходят устный опрос, и делают заметки о том, где они сталкиваются с проблемами, испытывают замешательство или восхищаются функциональностью продукта.
Процесс тестирования занимает в среднем от одного до трёх месяцев. Срок тестирования зависит от множества факторов: наличия разных типов продукта, сложности сценариев и наличия их альтернатив, количества пользовательских ролей.
Существует множество инструментов для юзабилити-тестирования, которые могут помочь автоматизировать часть этого процесса или сделать его удалённым. Все эти инструменты помогут улучшить удобство использования вашего сайта или продукта. На основе результатов вы можете изменить структуру навигации, определить запутанные значки или скорректировать копию кнопок.
Возможно, вы замечали подобный экран, когда завершали звонок ВКонтакте. Это отличный пример того, как выглядит юзабилити-тестирование. Пользователь после разговора может дать оценку тому, как прошёл звонок, что позволяет разработчикам сделать необходимые выводы на основе оценок множества пользователей.
Или, скажем, вы захотели узнать ответ на очень важный вопрос в разделе «Помощь». После каждого ответа есть две кнопки «Это решает мою проблему» и «Это не решает мою проблему». Рассмотрим вторую кнопку: она помогает определить причину, почему ответ не помог, которую можно устранить посредством возможных уточнений. Если же пользователю не нравятся предложенные варианты, то кнопка «У меня остались вопросы» переводит на экран составления нового вопроса, где на помощь приходят агенты поддержки.
Опросники у ВКонтакте тоже есть: например, если зайти в «Управление VK ID», иногда можно заметить кнопку для прохождения опроса.
Хоть юзабилити и влияет на пользовательский опыт, это всего лишь его часть. Поэтому стоит также рассказать о способах тестирования UX.
Что такое пользовательское тестирование?
UX-дизайн — это повторяющийся процесс исследования, планирования, тестирования и уточнения каждой точки соприкосновения на пути пользователя. На каждом этапе этого процесса вам необходимо выполнить пользовательское тестирование.
Пользовательское тестирование требует от разработчика оценки того, что пользователи делают и как они себя чувствуют, используя продукт от начала до конца. Вот несколько вопросов, которые можно задать пользователям:
- Легко ли начать пользоваться продуктом?
- Является ли пользовательский интерфейс интуитивно понятным?
- Можете ли вы выполнять различные задачи с помощью продукта?
- Вовлечены ли вы при использовании продукта?
- Приятно ли пользоваться продуктом?
- Добавляет ли продукт ценность вашей жизни?
- Вы бы порекомендовали продукт?
Пользовательское тестирование включает в себя юзабилити-тестирование, о котором говорилось выше, а также A/B-тестирование, фокус-группы и бета-тестирование.
Существует множество инструментов пользовательского тестирования, которые позволяют собирать отзывы из разных источников. Например, решения для аналитики, которые позволяют разработчику видеть, как пользователи взаимодействуют с веб-сайтом, определять возможности конверсии и узнавать, возникают ли ошибки или сбои.
Какие бывают распространённые ошибки UX-дизайна и как их исправить?
Ошибки UX-дизайна — нормальная часть во время проектирования. Вместо того чтобы ждать, пока UX-промахи просто произойдут, профессионалы предвещают и стараются избежать их до момента, когда пользователи разочаруются в продукте.
Однако не везде работают дизайнеры-профессионалы, и в продукте могут появляться ошибки. Поэтому не будет лишним знать о нескольких распространённых ошибках, чтобы избежать подобного.
- Нарушение баланса между эстетикой и функциональностью
Чтобы предложить отличный UX, продукт должен отлично выглядеть и хорошо работать. Если слишком сильно склонить чашу весов в ту или иную сторону, появится риск разочаровать пользователей из-за плохой функциональности или ухудшить репутацию из-за некачественного визуального восприятия. Обычно функциональность должна быть немного важнее эстетики. Важно, чтобы продукт выглядел красиво, но ещё важнее, чтобы он работал.
Как правило, стоит убедиться, могут ли пользователи максимально эффективно выполнять то, что они пытаются сделать с продуктом. Начинать стоит с базовой структуры задач, которые необходимо выполнить в процессе проектирования. Если элемент дизайна отвлекает от этого процесса, его стоит удалить или откорректировать.
- Игнорирование потребностей и отзывов пользователей
Главная ошибка разработчика — думать, что он знает лучше, чем пользователь. Не всегда то, что очевидно создателю продукта, понятно конечному пользователю. Пользователи должны быть в центре всего, что вы делаете, и крайне важно серьёзно относиться к их отзывам, чтобы закрыть пробел в понимании потребностей.
Эту ошибку можно избежать с помощью опросов в юзабилити-тестировании. Собирайте отзывы, анализируйте их и принимайте решения по улучшению опыта использования.
- «Бомбардировка» всплывающими окнами
Ничто так не отпугивает пользователей, как множество различных всплывающих окон при открытии продукта. Пользователю приходится иметь дело с закрытием или переходами от кучи всплывающих окон, прежде чем начать использование продукта или веб-путешествие.
Посмотрим на тестовое приложение, которое убивает приятный опыт пользователя с самого начала. Вместо использования онбординга приложение заполняет экран множественными окнами, которые должны быть закрыты, прежде чем мы сможем начать работу в сервисе.
Нельзя говорить, что все всплывающие окна ужасны, но стоит помнить о неудачно размещённых и плохо спроектированных всплывающих окнах, а также о тех, которые нельзя легко закрыть. В примере выше гораздо лучше было бы использовать приветственный экран, который рассказывает всё на нескольких страницах и не портит начальное впечатление у пользователя.
Чтобы создать удобные всплывающие окна, необходимо подумать, сколько их будет вызываться и когда. Хорошая практика — придерживаться одного окна на страницу и убедиться, что оно не прерывает UX, занимая весь экран. Всплывающие окна должны быть простыми для закрытия, доступными всего за несколько кликов и размещёнными соответствующим образом.
- Игнорирование промежуточных состояний
В дизайне, как и в жизни, не всегда всё идёт по плану. Хороший UX-дизайн способен предвидеть не только идеальные сценарии, но и неожиданные обстоятельства.
Стоит учитывать весь опыт взаимодействия пользователей с продуктом на протяжении всего процесса проектирования. Это должно охватывать начало, конец и промежуточный этап.
Представьте, что пользователь подписывается на бесплатную пробную версию на вашем сайте. Если всё пойдёт идеально, два основных состояния, с которыми столкнётся ваш пользователь, — это начальная страница регистрации и страница успеха.
Но на пути происходят проблемы, и чаще всего придётся тратить время на рассмотрение промежуточных состояний, таких как:
- Что видят пользователи, вводя свои данные?
- Что видят пользователи, когда они отправляют свою информацию, но забывают заполнить поле?
- Что видят пользователи, когда они отправляют свою информацию, но уже использовали бесплатную пробную версию?
- Что видят пользователи при возникновении системной ошибки или ошибки подключения?
Всегда стоит учитывать полный пользовательский опыт, дизайн промежуточных состояний, основные состояния и оптимальные сценарии и создавать высокую отказоустойчивость, чтобы продукт по-прежнему обеспечивал отличный UX, даже когда случаются ошибки.
- Использование всех трендов дизайна
Так же, как мода, музыка и причёски, пространство дизайна полно тенденций UX, которые приходят и уходят. Хотя и важно быть в курсе тенденций, не нужно соглашаться со всем, о чём другие говорят, только потому что это модно.
Например, плоский дизайн (flat design) стал популярной тенденцией UX в начале 2010-х. Плоский дизайн — это ответвление минимализма, характеризующееся отсутствием трёхмерных визуальных элементов. Он в значительной степени вышел из моды из-за проблем с UX, которые представляет. Например, этот дизайн может сбивать пользователей с толку относительно того, какие элементы кликабельны, а какие нет.
При проектировании стоит всегда учитывать, как тенденция дизайна повлияет на пользователей:
- Упростит ли это навигацию по продукту и облегчит ли жизнь пользователям?
- Обладает ли это лучшей эстетикой и производит ли лучшее первое впечатление на новых пользователей?
- Делает ли это UX-текст более лёгким для чтения?
- Нагружение пользователей слишком большим количеством информации
Если вы работаете в команде разработчиков продукта или работаете в одиночку, вы являетесь экспертом своего продукта и страстно любите его. Поэтому может возникнуть соблазн перегрузить пользователей слишком большим количеством информации.
Такая перегрузка данными может быстро сбить пользователей с толку, если у них не будет времени, чтобы обдумать и переварить информацию, которую вы им даёте. В дело вступает так называемый закон Хика, который гласит, что время, необходимое для принятия решения, увеличивается с ростом количества и сложности имеющихся вариантов.
Первый экран приложения, который видят пользователи, не должен быть слишком подавляющим. Если он перегружен или содержит много различных элементов, пользователи не будут знать, с чего начать, и могут покинуть вашу страницу, так ничего и не узнав.
Чтобы избежать этой ошибки в дизайне, стоит начать с самого необходимого и быть внимательным к тому, сколько контента пользователь видит сразу. Отличный UX — это когда пользователи могут начать работу с новым продуктом интуитивно, без излишнего обучения на начальном этапе.
- Включение невосприимчивых элементов дизайна
Одной из наиболее часто обсуждаемых ошибок отзывчивого дизайна является проектирование с учётом настольных компьютеров и игнорирование мобильных устройств. Однако в наши дни большинство UX-дизайнеров понимают важность дизайна, дружественного к мобильным устройствам.
Однако при этом большой проблемой остаются дизайнеры, которые думают только о мобильном дизайне. На мобильный трафик приходится около 50% веб-трафика, но это означает, что 50% всё ещё поступает из других источников, таких как компьютеры и планшеты.
Часто элементы дизайна, ориентированные на мобильные устройства, оставляют желать лучшего при просмотре на больших экранах. Быстрый взгляд на Instagram (принадлежит Meta — организации, запрещённой и признанной экстремистской в РФ) на настольном компьютере — отличный пример. Большое количество пустого пространства и крошечные иконки дают понять, что этот интерфейс не был разработан с учётом использования на большом экране.
Отличный UX-дизайн является отзывчивым независимо от того, на каком устройстве он просматривается. Лучшим вариантом будет стремиться разрабатывать дизайн для большинства форм-факторов и убедиться, что команда разработки уделит время мозговому штурму и тестированию того, что лучше всего выглядит и работает на экранах разных размеров.
- Отсутствие надписей у иконок
Некоторые UX-дизайнеры либо забывают добавлять надписи к иконкам, либо просто считают, что в этом нет необходимости, отчасти из-за тенденций минимализма в дизайне.
Отсутствие надписи у значков является ошибкой по двум основным причинам:
- Часто используемые значки, такие как сердечки, галочки или смайлики, означают разные вещи на разных сайтах, что может запутать пользователей.
- Слишком подробные, незнакомые или сложные значки могут быть непонятны, поэтому пользователям приходится тратить лишнее время и силы на то, чтобы понять, что они означают.
Решение этой ошибки простое. Слова и изображения вместе — мощная сила, поэтому убедитесь, что ваши иконки снабжены надписями.
- Введение пользователей в заблуждение с помощью ссылок и кнопок
Когда пользователь нажимает на кнопку или ссылку на сайте, он верит, что ему будет предоставлена та информация, о которой было сказано на странице.
Например, если кнопка на сайте гласит: «Нажмите здесь, чтобы узнать больше о наших ценах», она должна вести на страницу с ценами и никуда больше. Не на страницу регистрации для получения бесплатной пробной версии, не на форму контактной информации. Только на информацию о ценах.
Точно так же стоит оставаться верным слову, когда речь идёт о различных видах контента. Если на веб-странице есть ссылка, которая ведёт на видео, будет неплохим решением убедиться, что это действительно так. Плохой практикой является введение пользователей в заблуждение, когда, например, им предлагают пост в блоге или целевую страницу, когда обещали именно видео.
Стоит тщательно проверять ссылки и кнопки, чтобы убедиться, что они обеспечивают только то, что они обещают пользователю.
Заключение
Есть десятки способов, с помощью которых люди пытаются различать юзабилити и пользовательский опыт:
- Юзабилити — наука, пользовательский опыт — искусство.
- Юзабилити — автострада, пользовательский опыт — извилистая горная дорога. И так далее.
Важнее всего понять, что юзабилити является подмножеством и важной частью пользовательского опыта. Но сосредоточение внимания только на нём также не обеспечит превосходного UX.
Надеемся, теперь понятия UX и юзабилити не выглядят такими загадочными, а распространённые ошибки UX-дизайна помогут смотреть на привычные вещи с другой точки зрения.
Тем, у кого появился интерес к UX после прочтения статьи, автор рекомендует прочитать книги «Законы UX-дизайна» Джона Яблонского и «Не заставляйте меня думать» Стива Круга. В них подробно описывается, как вызывать положительные отклики пользователей с помощью грамотного UX-дизайна и как довести юзабилити в продукте до максимума.
Не будет лишним прочитать и статьи на эту тему: «UX для начинающих: практическое руководство» (Часть 1 и Часть 2).
Что касается UX и юзабилити в сфере мини-приложений ВКонтакте, советую почитать документацию: Критерии модерации мини-приложений (есть отдельный пункт про внешний вид).
Спасибо за внимание!
Автор: Владислав Громыко
