Всё что вам следует знать о UX дизайне. Почему стоит инвестировать в UX? UX дизайн не является визуальным или UI дизайном

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

UX, или пользовательский опыт (user experience), охватывает все аспекты взаимодействия конечного пользователя (end-user) с компанией, ее услугами, и ее продуктами. Он представляет собой совокупность всех ощущений человека во время этих взаимодействий.

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

Ключевые понятия UX

1. Проектирование взаимодействия

Под взаимодействиями понимаются все клики, скроллы и действия, предпринятые пользователем на сайте. Они являются неотъемлемой частью пользовательского опыта: если человек не может успешно взаимодействовать с сайтом, его опыт нельзя назвать положительным. Проектирование взаимодействия (interaction design) стремится раздвинуть границы простого функционала, так чтобы каждое действие пользователя вызывало у него восторг, и, в конечном счете, формировало вовлекающий пользовательский опыт.

2. Пользовательский интерфейс

Понятия UI и UX часто путают и используют (ошибочно) как синонимы. Тем не менее, (user interface) — это то, что видит пользователь и с чем взаимодействует, в то время как пользовательский опыт (user experience) — это все аспекты ощущений во время использования вашей системы.

3. Визуальный дизайн

Не последнюю роль в построении положительного опыта играет (visual design). Среднестатистический посетитель вашего сайта, вероятно, не заметит все нюансы проектирования взаимодействия или информационной архитектуры, тщательно продуманные вами, но они точно обратят внимание на визуальную составляющую. Под визуальным дизайном подразумевается все, что вы видите на странице, начиная от изображений и структуры страницы, заканчивая шрифтом под иллюстрациями и пустым пространством (whitespace). По статистике, первое впечатление на 94% зависит от дизайна, а выводы о доверии к сайту на 75% основываются на его общей эстетике.

4. Типографика

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

5. Юзабилити

Юзабилити (usability) — это обязательный минимум вашего UX. Если люди не могут использовать ваш продукт, они, естественно, не будут этого делать. Основной целью юзабилити является достижение простоты и удобства. Чем меньше внимания человек уделяет тому, как пользоваться системой, тем легче ему осуществить имеющуюся у него задачу.

6. Информационная архитектура

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

7. Контент

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

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

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

6 шагов проектирования UX

1. Изучить пользователей

Первым делом, необходимо понять, для кого именно вы проектируете. Существует много методов получить информацию о ваших пользователях. Сочетайте количественные и качественные данные аналитики и отзывов. Только поняв цели, потребности и желания ваших пользователей, вы сможете создать для них эффективный дизайн. Составьте профиль посетителя (persona) — собирательный образ всех ваших клиентов. Кто они? Какие у них цели? Каковы их «болевые точки»? Мотивы? Постарайтесь как можно более подробно описать ваших пользователей.

2. Определить сценарии

Далее, основываясь на результатах ваших исследований, четко определите, чего вы (а точнее ваши пользователи) пытаетесь достичь. Создайте идеальную « » (journey map) вашего клиента и выявите любые возможные барьеры на его пути. Определите как можно больше сценариев и способов применения вашего продукта/сервиса. Существуют ли какие-либо технические ограничения? Согласуется ли то, что вы собираетесь делать, с видением продукта/сервиса?

3. Сформулировать идею

Соберите воедино всю собранную информацию и приступайте к мозговому штурму. Создайте раскадровку (storyboard) или «доску настроений» (moodboard) для визуальной передачи проблемы, которую вы пытаетесь решить. Это также отличный способ представить свою идею всем заинтересованным лицам, участвующим в процессе принятия решения.

4. Создать прототип

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

5. Провести тестирование

Тестирование имеет жизненно важное значение для проектирования UX. Это не обязательно должен быть долгий, трудоемкий процесс. Согласно Nielsen Norman Group, 85% всех проблем на вашем сайте может быть выявлено всего 5 пользователями. Попросите ваших коллег произвести удаленное (remote user testing) или же предложите клиентам испытать новые функциональные возможности до их полного внедрения.

6. Повторить шаги при необходимости

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

Почему стоит инвестировать в UX?

1. Повышение лояльности к бренду

Люди взаимодействуют с вами, чтобы решить какую-то свою задачу. Если они удовлетворены опытом взаимодействия с вашим продуктом, они с большей вероятностью продолжат пользоваться им и будут рекомендовать своим знакомым. Благодаря хорошему UX пользователи становятся «адвокатами» вашего бренда (brand advocates).

2. Увеличение прибыли

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

3. Экономия времени, денег и ресурсов

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

• 

Сразу договоримся, что UX от UI - не синонимы. Это, если хотите, - разные стороны одной монеты.

В общих чертах

User Experience - опыт взаимодействия пользователя с устройством или приложением.

User Interface - пользовательский интерфейс, посредством которого это взаимодействие происходит.

Все перечисленные понятия тесно связаны и, так или иначе, переплетаются при создании дизайна приложения. Поэтому возникает двусмыслица. Очень часто эти понятия путают между собой или с другими, например, User Experience с Usability.

Usability (удобство использования) - это и часть, и следствие UX-дизайна.

Также UX и UI - это разные области дизайна, которые не существуют друг без друга.

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

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

Иными словами, результат UI мы видим, UX - понимаем. От всего вместе - ощущаем удобство использования.

Соответственно UX и UI-дизайнеры выполняют разные задачи общего проекта. Теперь можно и подробнее разобраться.

UX-дизайн

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

Да, если взаимодействие позитивное, о нём не говорят, потому что это воспринимается как должное. В противном случае - сразу прокомментируют.

Пять уровней User Experience Джесса Гарретта

1. Определение стратегии проекта (задачи бизнеса и пользователя).

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

3. Проектируется информационная архитектура и общее построение приложения.

4. Компоновка и прототипирование страниц.

5. Проработка блоков каждой страницы и расстановка акцентов на информации.

User Experience решает такие задачи, как:

• общая архитектура и последовательность страниц приложения;

• расположение и важность отдельных элементов (например, предусмотреть их для размеров экрана iPhone и iPad);

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

• обновление экранов существующего приложения.

UI-дизайн

Это работа над визуальной составляющей дизайна приложения. Иными словами, привлекательная «упаковка».

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

User Interface - это визуальная реализация User Experience. Все, что заложено в приложении на этапе разработки UX, пользователь воспринимает в том виде, который отображен посредством UI.

Задачи User Interface:

• обеспечить должное взаимодействие пользователя с приложением;

• олицетворять компанию, быть частью её фирменного стиля;

• эмоциональное удовольствие пользователя от работы;

• привлечение клиента внешней эстетикой;

• обновить внешний вид интерфейса в готовом приложении (например, с выходом новой версии iOS или Android).

В целом работа над UX-дизайном более обширная, а над UI-дизайном - не менее важная.

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

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

UX дизайн (UX design )

User Experience Design в переводе означает «опыт взаимодействия» и включает в себя различные UX -компоненты: информационную архитектуру, проектирование взаимодействия, графический дизайн и контент.

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

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

Основные вопросы, решаемые UX дизайном:

• Постановка целей и задач - чего в итоге нам необходимо достичь?
• Подбор подходящих UX инструментов для реализации целей
• Разработка продукта, максимально удобного и легкого в восприятии целевой аудиторией
• Анализ конечного результата - соответствует ли продукт ожиданиям заказчика и насколько высок уровень удовлетворенности пользователей.

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

UI дизайн (UI design)

User Interface Design или пользовательский интерфейс - это более узкое понятие, включающее в себя определенный набор графически оформленных технических элементов (кнопки, чекбоксы, селекторы и другие поля). Его задача - помочь пользователю организовать взаимодействие с программой/сайтом. На сегодняшний момент существуют некоторые правила UI дизайна :

1. Организованность элементов интерфейса. Это означает, что они должны быть логически структурированы и взаимосвязаны.
2. Группировка элементов интерфейса. Подразумевает объединение в группы логически связанных элементов (меню, формы).
3. Выравнивание элементов интерфейса . Сложно представить, что плохо выровненный интерфейс может быть для кого-то удобным!
4. Единый стиль элементов интерфейса. Стилевое оформление играет не последнюю роль, ведь именно оно сохраняется в памяти пользователя.
5. Наличие свободного пространства. Это позволяет разграничивать информационные блоки, сосредотачивая внимание на чем-то одном.

Разработанный по все правилам пользовательский интерфейс значительно повышает эффективность ресурса и дает ему конкурентные преимущества.

Информационная архитектура (ИА)

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

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