UX/UI дизайн для создания идеального продукта. Полный и исчерпывающий гид

В чем разница между UX- и UI-дизайном?

Выступая перед студентами, я часто задаю им такой вопрос и получаю совершенно разные ответы. Вот самые распространенные:

• «UI-дизайн – про красоту, а UX-дизайн – про удобство»;

• «UXD (UX design) – это рисование прототипов, а UID (UI design) – рисование макетов»;

• «UXD – это проведение исследований, а UID – создание финального интерфейса»…

Давайте попробуем разобраться.

Очевидно, что если у продукта есть пользовательский интерфейс, то он влияет на качество пользовательского опыта. Но он не всегда выступает точкой касания; иногда взаимодействие осуществляется через интерфейс другого продукта (когда продукты связаны через API[11 - Application Programming Interface – программный интерфейс приложений. API позволяет приложениям общаться между собой. Подробнее об API, как о факторе пользовательского опыта, рассказано в главе 4.]) или через пуш-уведомление, в таком случае на качество опыта сильно влияют скорость отклика и сообразительность поискового алгоритма под капотом. Помимо этого, есть масса других факторов, которые влияют на качество опыта и притом не связаны с интерфейсом.

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

Чтобы студентам было проще разобраться, я предлагаю им заполнить пропуски в шаблоне:

Ужасный интерфейс, но я ЛЮБЛЮ продукт, потому что ______________________.

Или как вариант:

Прекрасный интерфейс, но я НЕНАВИЖУ этот продукт, потому что ______________________.

Хотя задача касается только тех UX-факторов, что не относятся к пользовательскому интерфейсу (UX без UI), студенты часто вспоминают UI-факторы, и они тоже фиксируются на доске.

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

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

Глава 4

Факторы UX

Фактор 1. Брендинг

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

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

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

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

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

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

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

Уже перейдя во владение покупателя, идентификатор бренда выступает как коммуникативный инструмент – демонстрирует принадлежность к особому классу людей и удовлетворяет таким образом потребность в доминировании. Это касается не только дорогих брендов одежды и часов; можно показывать свое превосходство, отказываясь от дорогих брендов и лейблов или выбирая брендовые товары, потребление которых «спасает мир».

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

• идентификация продукта;

• упрощение сравнения продуктов;

• упрощение распространения информации о продукте;

• передача информации о дополнительных свойствах продукта;

• удовлетворение потребности в демонстрации принадлежности к сообществу,

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

Часто параллельно с разработкой прототипа, минимально жизнеспособного продукта (Minimal Viable Product, MVP, подробнее см. главу 5), создается идентификация бренда.

Наблюдая за пользователями, можно убедиться, что от варианта брендинга зависит не только субъективная удовлетворенность клиента (измеряемая, например, с помощью метрики SUS[12 - System Usability Scale – шкала удобства использования системы; унифицированное исследование субъективной удовлетворенности от взаимодействия, построенное на десяти типовых вопросах. Подробнее о применении SUS см. раздел о юзабилити-исследования в главе 6.]), но и время решения задач.

То, что ныне широко известный Стив Пирс (Steve «Buzz» Pearce)[1 - https://twitter.com/stevebuzzpearce (https://twitter.com/stevebuzzpearce)] сделал для продукта Skype, сильно повлияло на становление термина «цифровой брендинг». Эта работа была одной из наиболее ярких.

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

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

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

Фактор 2. Функциональность

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

Функция – способность объекта выполнять работу.

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

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

К функциям продукта применимо свойство многосоставности.

Предположим, функция управления списком пользователей выполняет следующие задачи:

• просмотр списка пользователей;

• добавление пользователя;

• удаление пользователя;

• редактирование информации о пользователе;