Принципы UX дизайна, которые понравятся вашим пользователям  

При создании продуктов компания должна учитывать множество важных принципов UX дизайна. Они служат дополнением к процессу дизайн-мышления и при этом ставят пользователя в центр принятия решений.

1. Направьте внимание на пользователя

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

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

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

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

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

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

1. Эмпатия — понимание своих потенциальных клиентов
2. Выявление проблемы
3. Генерация идей
4. Прототипирование
5. Тестирование и итерации на основе результатов тестирования

Узнайте больше о дизайне, ориентированном на человека, здесь.

2. Обеспечьте наличие согласованности

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

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

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

У вас нет дизайн-системы? Ознакомьтесь с нашим процессом создания дизайн-системы с нуля, который состоит из 7 этапов.

3. Создайте удобный для восприятия продукт

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

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

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

4. Не заставляйте пользователей думать

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

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

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

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

5. Разберитесь в визуальной грамматике: точки, линии и плоскости 

Впервые определенные школой Баухаус (прим. архитектурная и художественно-промышленная немецкая школа, которая обозначила основные принципы архитектуры ХХ века) в начале 1900-х годов, основные составляющие дизайна состоят из трех ключевых элементов: точек, линий и плоскостей.

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

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

6. Сначала определите проблему

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

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

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

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

7. Пишите простым языком

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

Удобство восприятия может существенно повлиять на когнитивную нагрузку даже для высокообразованных пользователей. Мы возвращаемся к пункту номер 4: «Не заставляйте пользователей думать».

Согласно широко известному сервису Grammarly (прим. онлайн-сервис, который работает на основе искусственного интеллекта и помогает в написании текстов на английском языке) для своего повествования вам следует использовать язык уровня восьмого класса (в США он соответствует 13-летнему возрасту).

8. Поставьте себя на место вашей аудитории

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

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

• Видят
• Слышат
• Думают
• Чувствуют

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

9. Обеспечьте обратную связь

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

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

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

10. Не забывайте о ценности для бизнеса

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

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

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

Эвелина Лющек (Ewelina Łuszczek) из польского агентства HERODOT резюмирует обязательство дизайнера в отношении ценности для бизнеса в одном лаконичном предложении: «Хороший UX дизайнер сможет объединить цели пользователя с бизнес-целями, чтобы и люди, и компания получили выгоду».

Ниже мы рассмотрим четыре отличных примера из исследования INFRAGISTICS от 2014 года «Ценность опыта взаимодействия для бизнеса»:

Bank of America

Действие дизайнера: редизайн процесса регистрации, ориентированный на человека

Результат: количество регистраций выросло на 45%.

Anthropologie (бренд одежды)

Действие дизайнера: UX редизайн процесса оформления заказа

Результат: продажи выросли на 24%.

GFK (консалтинговая фирма)

Действие дизайнера: редизайн кнопки “купить”

Результат: продажи выросли на 500 миллионов долларов.

United Airlines

Действие дизайнера: исследование пользователей

Результат: онлайн-продажи билетов выросли на 200%.

Здесь вы можете прочитать полное 12-страничное исследование INFRAGISTICS для получения дополнительной информации о создании ценности для бизнеса с помощью UX-дизайна.

11. Тестирование с пользователями

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

Тестирование юзабилити предоставляет UX командам ценную обратную связь и мнение пользователей в следующих направлениях:

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

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

В этой статье содержится больше информации на тему: «Что такое тестирование юзабилити и как его провести».

12. Визуальная иерархия

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

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

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

Прочтите информативную статью на эту тему от Nielsen Norman Group, которая называется «Визуальная иерархия в UX: определение».

13. Доступность

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

Некоторые ключевые аспекты доступности включают в себя:

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

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

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

14. Предоставьте пользователю контроль

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

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

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

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

15. Передача дизайна в разработку

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

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

UXPin Merge способствует преодолению разрыва между дизайном и разработкой. Во-первых, Merge позволяет дизайнерам синхронизировать компоненты с репозиторием (через интеграцию с Git или Storybook), чтобы проектные группы могли создавать полностью работающие прототипы с высокой степенью детализации. Это позволяет улучшить результаты тестирования и минимизировать проблемы юзабилити.

Во-вторых,  UXPin’s Spec Mode позволяет разработчикам получить подробную информацию о проектах, что значительно упрощает процесс передачи дизайна в разработку.

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

Узнайте о возможностях UXPin Merge и о том, как подключить нужную технологию, с помощью нашей интеграции  Git integration for React или Storybook для других популярных интерфейсных библиотек.

16. Проводите проверку и переоценку 

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

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

• Как работает продукт, когда им пользуются тысячи или миллионы людей?
• Используют ли пользователи продукт по назначению?
• Выбирают ли они короткие пути, которые вы им предлагаете для улучшения опыта взаимодействия?
• Что говорят вам тепловые карты о поведении пользователей?
• Куда они уходят и почему покидают сайт/приложение на этапе подписки или регистрации? 

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

Заключение

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