Применение UX при разработке вашего веб-сайта
05.02.2019
Термин UX возник в 1993 году в недрах корпорации Apple, расшифровка звучит как User eXperience. С ростом популярности мобильных устройств это понятие вошло в моду и стало использоваться повсеместно. Но даже сейчас не все могут ответить с уверенностью, что же такое UX-дизайн, чем он отличается от UI-дизайна и почему эти вещи часто упоминаются в связке. Мы поможем разобраться.
Что такое UX-дизайн
По-русски UX-дизайн — это дизайн пользовательского опыта. Он является одной из первых ступеней в создании продукта и служит для того, чтобы приложение было логичным, удобным и полезным. UX-дизайн мобильных приложений и сайтов определяет, какие впечатления получит человек от их использования, как именно он будет пользоваться данными продуктами. Где лучше разместить вход в личный кабинет? Сколько шагов должен пройти пользователь, чтобы подписаться на рассылку или сделать заказ? Как он поймет, что операция прошла успешно? Именно такие
вопросы решает UX-дизайнер.
- UX-дизайнерам важно уметь:
- проводить исследования пользователей;
- создавать вайрфреймы и прототипы сайтов и приложений;
- проектировать взаимодействие;
- тестировать продукт;
- заниматься аналитикой.
- UX-дизайн включает в себя разные компоненты:
- информационную архитектуру;
- интерактивный дизайн;
- юзабилити (показатель простоты, удобства и эффективности продукта в глазах пользователей).
Чтобы достичь хорошего пользовательского опыта для вашего приложения, прислушайтесь к этим советам.
Внимание пользователя очень ограничено — если в 2000 году человек мог посвятить одному предмету в среднем 12 секунд, то в 2015 только восемь. Мобильные устройства приучили нас мгновенно переключаться между задачами, поэтому быстро и в понятном виде покажите нужные функции приложения и его контент, а всё остальное отодвиньте на второй план. Совершенство достигается не тогда, когда нечего добавить, а когда нечего убрать.
Навигация — это жизнь вашего мобильного приложения в руках пользователя, его путешествие от возникновения задачи к её решению. Не запутывайте пользователя непонятной и/или нестандартной навигацией — если никто не доберётся до нужной функции или контент будет трудно найти, то вы разом потеряете большую часть клиентов.
О навигации можно написать ещё десяток статей, но если говорить в общем, то позаботьтесь, чтобы ваша навигация:
- наследовалась от платформы — использовала все доступные в ней метафоры и навигационные элементы, чтобы не пришлось ничего объяснять;
- была последовательной — одинаковой для всех частей приложения;
- объясняла пользователю, где он находится.
Приведём в пример «гамбургерное» меню. Решение очень заманчивое и удобное для дизайнера: не нужно переживать из-за ограниченного экранного пространства, просто спрячьте всю навигацию в выдвигающийся экран, который по умолчанию скрыт. Однако эксперименты показывают, что когда опции меню находятся на виду, растёт и увлеченность, и удовлетворенность пользователей, и даже доход. Именно поэтому все крупные игроки сейчас переходят от «гамбургерного» меню к отображению ключевых опций навигации на основном экране.
Что лучше — таббар или «гамбургер» — дизайнеры Лайв Тайпинг решали при работе над мобильным приложением ИЛЬ ДЕ БОТЭ. Целью клиента было дать пользователю в любой момент зайти в любую категорию магазина. Ассортимент товаров для красоты огромен, категорий много, а внутри некоторых категорий есть несколько вложенностей. И если раньше проблему быстрого доступа к категориям решил бы «гамбургер», то сегодня его вытесняет эстетичный и удобный таббар. Это подтвердилось тестированием приложения на будущих пользователях: тянуться пальцем из нижнего правого угла в верхний левый оказалось проблемой.
Вывод из первого совета можно сделать такой: уменьшите то количество действий, которые нужны пользователю, чтобы добиться желаемого. Создавайте каждый экран только для одной и исключительно одной вещи. Это может быть даже только призыв к действию. Это проще понять, проще использовать, проще создавать.
Еще один из основополагающих принципов — наличие обратной связи для действий пользователя. Людям нравится чувствовать, что у них всё под контролем, что приложение откликается на их действия и что они понимают этот отклик. Поэтому давайте обратную связь и объясняйте происходящее (если это не до конца понятно). На уровне дизайна используйте разные цвета и состояния, анимацию. На уровне пользовательского опыта — «пустые состояния», подсказки, сообщения внутри приложений, демонстрацию того, «что будет, если», скелеты интерфейсов (например, Instagram или Facebook показывают вам контуры контента ещё до того, как он на самом деле загружен).
Для улучшения пользовательского опыта важно адаптировать дизайн интерфейса под управление одним пальцем. Убедитесь, что вашим приложением можно управлять одним пальцем, разместите элементы навигации в доступном месте — лучше всего снизу слева.
Да, размеры экранов смартфонов растут, однако они всё равно остаются сравнительно маленькими. Поэтому хороший пользовательский опыт для приложений — это большие кнопки с достаточными промежутками между ними, крупный контрастный текст, видимый даже на солнце и на заметном расстоянии, возможно, ночной режим, если вашим приложением предполагается пользоваться вечером (например, читалку для книг).
Большие формы заполнять на маленьких мобильных устройствах очень непросто. Поэтому сокращайте до минимума количество данных, которые вы запрашиваете у пользователя. Если у вас есть регистрация — используйте социальные сети (Банк Тинькофф делает даже подсказку для фамилии, для этого есть открытые библиотеки); если нужно запросить возраст — используйте выпадающий список или, максимум, цифровую клавиатуру; если адрес — автодополнение, карту и геолокацию; если вам нужен индекс — используйте определение по адресу. Ищите самые удобные способы ввода и автозаполнение, а не просто наследуйте ввод данных с декстопов — сведите печатание к минимуму.
Не надо думать о мобильном дизайне и опыте в отрыве от всего остального. Бесшовное переключение между сайтом, смартфоном или планшетом крайне важно для пользователей. Возьмите, например, Apple Music. Вы можете создать плейлист на декстопе и он тут же появится в вашем смартфоне, а внешний вид приложений схож на всех платформах.
Пользовательский опыт — дело каждого в вашей компании
Приложения и сайты часто являются лишь одним из способов для взаимодействия клиента и вашей компании, а настоящее обслуживание происходит в оффлайне. В этом случае стоит помнить, что в создании качественного пользовательского опыта участвую все: маркетологи, менеджеры, служба поддержки, программисты, исполнители работ и, конечно, сами пользователи. Вам нужно получить входные данные от всех них и предложить лучший способ упаковки, позиционирования и общения внутри вашего продукта. Только так вы сможете создать хороший UX, привлекающий и удерживающий пользователей.
Оригинал статьи: https://livetyping.com/ru/blog/shto-takoe-ux-ui-dizajn
https://livetyping.com/ru/blog/printsipi-i-osnovy-ux-dizajna
Компания “КОРБАЙТ” оказывает услуги по разработке эффективных сайтов под ключ. Мы исследуем особенности вашего бизнеса и создаем не только дизайн корпоративного сайта, но и обеспечиваем положительный пользовательский опыт.
Обратившись к нам, вы получите интуитивно-понятный интерфейс, уникальный дизайн, повышение конверсии и продаж.
ООО «КОРБАЙТ» © 2018 — 2020
Все права защищены
г. Москва. Дербеневская набережная, 11
Бизнес Центр Полларс, метро Павелецкая