Введение в понятие юзабилити, обзор основных принципов

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

• юзабилити что это такое;
• каким образом оно влияет на успешность сайта;
• каким образом мы сможем с ним работать.

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

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

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

Почему юзабилити ценно? Почему это стоит делать?

По двум причинам:

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

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

Самое главное — это цели и задачи пользователя. Они определяют:

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

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

Пример Табуретки Нормана

Одним из главных принципов построения продуктов является Табуретка Нормана.

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

• задачи бизнеса;
• потребности пользователей;
• ограничение и ресурсы технологий.

Что будет, если не учесть потребности бизнеса при проектировании?

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

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

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

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

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

Human Centered Design

Human Centered Design — это принцип, по которому работают юзабилити-компании во всем мире.

Четыре главных этапа этого процесса:

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

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

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

Почему нельзя сделать стандартный магазин?

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

Одним из самых важных показателей являются пользователи.

У всех магазинов разные пользователи. Поверьте, у вас и у ваших конкурентов покупают одни и те же люди, или разные люди. Люди делятся, тем более для разных областей. В разных ситуациях людям нужно разное. То есть мы не можем применить одни и те же критерии пользовательского взаимодействия, например, к сайту спорттоваров или к сайту детских товаров. Нужно всегда помнить о том, что людьми что-то движет. Почему-то для них стало важно сегодня что-то купить. Или не сегодня… Это нужно выяснять, об этом нужно думать. Нужно понимать, что лежит в основе их потребности и в основе их желания зайти к вам в магазин и получить какой-то товар.

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

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

Резюме

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

Методика персонажей

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

Что нам важно знать про персонажей вашей целевой аудитории?

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

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

Типы задач

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

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

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

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

Это был первый блок. В конце первого блока я подведу некоторые итоги. Юзабилити — это не магия, это только удобство. Юзабилити — это сложный комплексный подход, в ходе которого мы понимаем, что нужно работать не только на повышение эффективности работы магазина, но и над повышением лояльности пользователей и их удовлетворенности взаимодействием. Мы понимаем, что у каждого интернет-магазина разные пользователи. У них есть различия в целевой аудитории, в ситуациях и в потребностях, которые эти магазины удовлетворяют. На основании своей целевой аудитории, вы можете сделать конкретных персонажей, представляющих ее. Эти персонажи помогут вам определить конкретные задачи, которые они будут выполнять на сайте, и конкретные требования к страницам и шагам, которые они предъявляют к взаимодействию с сайтом.

Методы оценки и анализа юзабилити

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

• Оценка с пользователями:

• Тестирования;
• Фокус-группы;
• Карточная сортировка;
• Исследование мнений

• Экспертная оценка:
  • Эвристическая (по чек-листам);
  • Сценарная;
  • Веб-аналитика.

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

Оценка аудитории

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

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

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

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

Виды экспертной оценки юзабилити 

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

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

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

Всегда стоит вопрос: что оценивать?

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

Экспертная оценка юзабилити

Эвристическая и сценарная оценка юзабилити

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

Эвристическая оценка Якоба Нильсена

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

Наглядность текущего состояния системы

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

Связь с реальным миром

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

Управляемость и свобода действий

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

Предотвращение ошибок

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

Узнавание против запоминания

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

Гибкость и эффективность использования

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

Эстетика и лаконичный дизайн

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

Предвидение ошибок, восстановление после них

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

Справочная система и документация

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

Веб-аналитика

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

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

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

Какие инструменты предпочитают использовать. Это, конечно, Google Analytics, который позволяет достаточно широко и достаточно гибко вытаскивать данные взаимодействия. Это Яндекс.Метрика, которая обладает отличными инструментами качественной оценки, то есть это карта кликов, карта скроллинга, карта заполнения форм и т.д. Конечно, нам необходимо настраивать статистику о транзакции для e-commerce, чтобы понимать не просто в страницах, а в деньгах, насколько успешно взаимодействие и в каких моментах его можно подправить

Зачем для юзабилити нужна веб-аналитика ?

Что мы можем получить из веб-аналитики? И что из этого нам может помочь исправить наш интернет-магазин?

• Информация по демографии:
  • География;
  • Пол;
  • Возраст.
• Технологии:
  • Разрешение экрана;
  • Браузер;
  • Мобильные устройства.
• Посадочные страницы и источники:
  • Откуда и куда приходят пользователи.
• Контекст и поведение:
  • Периодичность и время посещения;
  • Поиск по сайту;
  • Популярные пути к целям;
  • Конверсионные воронки и страницы выхода;
  • Мультиканальные последовательности.

Демографическая информация

Очень хорошо помогает для определения целевой аудитории вашего сайта. Есть ограничения Яндекс.Метрики, и есть ограничение сегментации, но мы, в принципе, можем представить мужчина или женщина является основным посетителем и покупателем вашего интернет-магазина. Иногда демографические характеристики серьезно меняются в зависимости от этапа взаимодействия с магазином.

География

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

Технологии

Разрешение экрана, браузер, мобильные устройства) помогут нам понять, как люди воспринимают ваш магазин. Если мы замечаем, что с нашим сайтом работают много мобильных устройств, нам нужно придумать, как упростить процесс взаимодействия и восприятия. Это может быть адаптивная верстка, это может быть мобильный сайт. Мы должны понимать, с каких устройств пользователи пользуются сайтом. В том числе люди могут пользоваться разными браузерами. Например, на некоторых сайтах доля Internet Explorer доходит до 50–60%. Это накладывает определенные технические ограничения на работу, на отображение контента и т.д.

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

Самыми важными качественными показателями, которые мы можем вытащить из веб-аналитики — это контекст использования и поведения.

Периодичность и время посещения

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

Мы можем понять популярные пути к целям, то есть популярные пути к подпискам, популярные пути к покупкам. Например, работает ли у нас на сайте кнопка «Купить в один клик», которая была внедрена, но пока не очень понятно, как оценить ее эффективность.

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

Мультиканальные последовательности

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