что означает понятие юзабилити
Интерфейсы и юзабилити: кто, зачем и как проектирует UX
Совсем недавно мы рассказывали о том, каким будет новый Печкин-mail. Переход на новый движок, который произойдет уже совсем скоро, затрагивает и улучшения пользовательского опыта.
Аарон Уолтер, директор по UX в сервисе email-рассылок MailChimp, однажды сформулировал ключевой принцип его команды:
«Наша цель – сделать ПО функциональным, надежным и готовым к использованию, чтобы люди могли решать с его помощью свои задачи. Но мы считаем, что разработка ПО, которое просто готово к использованию – все равно, что приготовление шеф-поваром еды, которая «просто съедобна». Чтобы привлечь людей, надо выйти за рамки базовой практичности. Мы хотим, чтобы вещи, с которыми мы взаимодействуем, пробуждали в нас эмоции».
Сегодня мы поговорим о предназначении UX, его целях и задачах, а также расскажем о том, как выйти за вышеупомянутые «рамки» и какими качествами и навыками нужно обладать проектировщику интерфейсов.
Так что же такое UX и юзабилити
Официальное определение UX (User eXperience) звучит следующим образом:
«Восприятие, возникающие у человека при использовании и/или предполагаемом использовании продукта, системы или при получении услуги» (ISO 9241-210:2010, подраздел 2.15).
Русскоязычным аналогом User eXperience является выражение «пользовательский опыт». Своим появлением и дальнейшему распространению словосочетание «пользовательский опыт» обязано Дональду Норману, который на момент введения термина (1995 г.) занимал пост вице-президента разработки перспективных технологий в Apple:
«Я «изобрел» этот термин поскольку считал, что «интерфейс для человека» (human Interface) и «юзабилити» были слишком узкоспециальными. Я хотел задействовать все аспекты пользовательского опыта взаимодействия с системой, в частности промышленный дизайн продукта, его графику, интерфейс и аспекты физического контакта с устройством».
Считается, что «положительный пользовательский опыт» – это результат адекватного сочетания 5 нижеприведенных основополагающих принципов «идеального» UX, где центральным пунктом является «юзабилити»:
Проектирование интерфейса и проектирование UX: где связь
Рассмотрим основополагающие методы работы над проектированием пользовательского интерфейса:
Но как проектирование интерфейса связано с проектированием UX? К примеру, википедия определяет проектирование UX как:
«Процесс повышения уровня удовлетворенности пользователя от взаимодействия с продуктом за счет повышения его удобства, простоты использования и доступности».
Ключевая задача проектирования UX заключается в том, чтобы сделать пользовательский опыт настолько успешным, насколько это возможно, исходя из того, что разработчик UX по большому счету обязан взаимодействовать с создаваемым им продуктом, ПО или иным объектом в первую очередь как пользователь.
«UX – не то, что можно просто внедрить, это – основа базовой системы ценностей», – говорит Уолтер.
Проектирование UX – это деятельность, направленная в первую очередь на людей, а значит, ключевое умение проектировщика UX – это способность понимать потребности и поведение пользователей сайта, приложения или продукта. Он должен стремиться к тому, чтобы эти потребности и желания соответствовали бизнес-целям компании, на которую он работает.
Однако конечной целью проектирования UX является не только удовлетворение запросов пользователя, но и помощь продукту в достижении поставленных бизнес-целей. Одной из сложнейших задач, возникающих в ходе работы над UX, является соотнесение целей бизнеса с целями пользователя.
Рассуждая о проектировании UX и проектировании интерфейса, следует провести едва различимую, но по своей сути значимую черту: проектирование UX возможно без дизайна интерфейса, но проектирование интерфейса неосуществимо без понимания итогового пользовательского опыта.
Профессия UX-проектировщика
Итак, первое, о чём думает проектировщик UX [для простоты здесь и далее будем считать термины «проектировщик UX» и «юзабилист» синонимами] – как объединить цели пользователя с целями бизнеса. Например, если целью пользователя является покупка продукта, то компания должна сделать эту покупку полезной, удобной и приятной.
На сегодня все. В следующих сериях мы подробнее рассмотрим суть работы проектировщика.
Что такое юзабилити или 7 основных правил юзабилити сайта
Приветствую тебя, Искатель драгоценного клада «Юзабилити сайта»! С помощью этой статьи ты станешь на пару шагов ближе к достижению своей цели – получению представления о юзабилити, а заодно получишь максимально понятные ответы на вопросы: Что такое юзабилити, Зачем тебе это знать, Почему этот параметр считается важным, Как он влияет на конверсию и Какие действия можно предпринять для улучшения твоего сайта. Итак, погнали навстречу приключениям!
ЧТО такое юзабилити?
*Сразу оговорюсь – речь здесь идет о сайтах в целом. Многостраничник, лендинг, подписная страница или интернет-магазин – для каждого отдельного подвида сайта нижеописанные правила будут адаптироваться по-своему.
Юзабилити веб сайта оценивается по 5 основным качественным компонентам:
— Полезность: показатель функциональности сайта для юзера: дает ли вебсайт пользователю то, что он ищет.
Вообще, юзабилити и полезность – это два самых главных векторных направляющих для определения практичности чего-либо. Но при определенных условиях:
Полезность сайта — обладает ли сайт ответами на ваши вопросы.
Юзабилити — насколько легко и удобно управлять сайтом.
Практичность сайта = юзабилити + полезность.
ПОЧЕМУ юзабилити так важно?
Показатель юзабилити напрямую влияет на конверсию сайта. В интернет-сфере данный критерий является необходимым условием выживания в веб-джунглях. Если сайт сложно использовать – посетитель его закроет. Если главная страница не демонстрирует сферу деятельности сайта или то, что юзер может получить, то юзер закроет сайт. Если в течение первых 5 секунд посетитель не сориентируется, где он находится, – он закроет сайт. Если информацию на сайте сложно воспринять и прочесть, или она не отвечает на ключевые вопросы юзера – юзер закроет сайт.
Тенденция видна? Посетитель ни за что не будет читать мануал (инструкцию по использованию навигации сайта, которой в реальности и нет) или проводить много времени, пытаясь разобраться в интерфейсе. Вокруг него много сайтов такой же тематики, поэтому юзер будет руководствоваться своими первобытными инстинктами: он покинет страницу, т.к. сбежать с места неизвестности-опасности-дискомфорта – это первое желание спасти себя, чувствуя сложность в чем-то. Просто запомни одно простое правило — первое правило электронной коммерции: если пользователь не может найти товар – он не сможет его купить.
Опираясь на описанные выше принципы юзабилити, ученые выделили 7 основных правил юзабилити сайта:
Помимо этих 7 общих правил существуют ещё несколько канонов, которые группируются в 3 огромных критерия аудита юзабилити сайта. Проводится аудит с целью выявления косяков и недочетов интернет-проекта, чтобы внести изменения и увеличить производительность интернет-ресурса. Более подробно я поведаю тебе в следующей статье, а пока после парусекундного перекура, погнали в дебри Юзабилити-джунглей глубже. Ещё глубже…
КАК повысить юзабилити сайта?
Ответ прост: провести аудит сайта, получить оценку юзабилити, внести изменения согласно показаниям, провести тестирование. Звучит легко. Но на самом деле это упорная работа. Тем не менее, не бойся, читатель, все эти 4 пункта вполне можно провести самостоятельно. И сейчас я немного расскажу тебе, как это можно сделать.
Существует несчетное множество способов улучшения юзабилити сайта, но основным и самым результативным считается юзабилити тестирование сайта, которое состоит из 3 компонентов:
Это очень важный момент, на который стоит обращать внимание – проводить тестирование на каждом испытуемом по-отдельности и наблюдать за их действиями и решениями проблем самостоятельно. Но! Наблюдающий должен сидеть ниже травы, тише воды. Помощь или советы со стороны внедрят в их голову другое направление и изменят траекторию мысли и действий. В результате – получится сфабрикованный результат тестирования, т.е. ложный показатель, недостоверная информация.
Для выявления наиболее важных проблем сайта достаточным количеством является 5 человек для юзабилити тестирования. Вместо того, чтобы проводить один дорогостоящий сложносочиненный тест, организуй несколько простых последовательных тестов. Опираясь на результаты которых, можно будет внести исправления в контент сайта, и, по мере возникновения новых сложностей у юзеров – постоянно улучшать свой сайт. Метод повторного тестирования – самый выгодный и ресурсоэкономный способ улучшить юзабилити сайта. Чем больше версий сайта ты протестишь – тем лучше.
КОГДА начинать работать над юзабилити сайта?
Всегда. Постоянно. Ни в коем случае не упускать из головы этот критерий и помнить его как пароль от ВКонтакте. Юзабилити – критерий, который стоит учитывать на всех стадиях разработки сайта. И именно вследствие этого стоит проводить тестирования быстро и просто. Вот несколько обязательных условий для достижения верных показателей оценки юзабилити разных этапов создания сайта:
Не откладывай юзабилити тестирование на самый последний момент, т.к. многие погрешности будет очень сложно скорректировать ввиду несостыковок между «видением дизайнера»-маркетинговыми целями-кодами и скриптами верстальщика и позиционированием товара на рынке.
ГДЕ проводить юзабилити-тестирование?
Если твои тестирования походят хотя бы раз в неделю, лучше будет создать или арендовать специальную юзабилити-лабораторию. Но большинство компаний обходятся обыкновенным офисом или попросту переговорной комнатой, Главное – изолировать помещение от внешних раздражительных факторов. Основными условиями проведения юзабилити тестирования являются наличие правильно подобранного испытуемого и присутствие наблюдателя, который будет отслеживать процесс тестирования. Про наличие компьютера, ручек, распечатанных макетов сайта, я думаю, упоминать не стоит.
Заключение
Итак, читающий, давай подытожим, что ты узнал о юзабилити:
Бон аппети, читатель, переваривай информацию!
Юзабилити сайта: что это, анализ, примеры и чек-лист
Реклама, контент-маркетинг, многоэтапные воронки. Какими бы средствами вы не привлекали клиента, рано или поздно он остается один на один с вашим веб-ресурсом. И в этом момент юзабилити сайта определяет, оформит он заказ или закроет страницу.
Вас встречают по одежке. А точнее — по тому, как выглядит ваш сайт и насколько он удобен для пользователей. И порой даже небольшие улучшения юзабилити способны весомо повысить доход.
Например, Nature Air получили ошеломляющий рост конверсии с 3% до 19%, просто разместив кнопку call-to-action рядом с прайсом и продающим текстом. А Underwater увеличили конверсию в три раза, сделав анализ юзабилити и убрав все лишнее с целевой страницы.
Как добиться таких результатов? Прочесть эту статью до конца и внедрить рекомендации
Юзабилити сайта: что это такое
Юзабилити — ( англ. use ability — возможность пользоваться) термин, который означает удобство использования. Простой, удобный и интуитивно понятный для пользователя сайт = сайт с высоким юзабилити.
Как юзабилити влияет на конверсию
Кстати, юзабилити — важный критерий успеха не только сайта, но и любого продукта. К примеру, согласно исследованию Latirman, 58% мужчин, живущих в Великобритании, не пользуются стиральными машинами, потому что считают их слишком сложными. Дизайнер Питер Фабор даже выпустил специальные наклейки, которые помогают мужчинам постирать вещи. 
Инструкция Питера Фабора для стиральной машины, чтобы ей могли пользоваться даже мужчины.
Конверсия и доход бизнеса напрямую зависят от того, насколько просто и удобно человеку совершать покупку. Поэтому так важно регулярно проводить анализ юзабилити сайта и улучшать взаимодействие во всех точках касания с клиентом.
Как провести анализ и улучшить юзабилити сайта
Анализ юзабилити — это тестирование и поиск моментов, которые мешают пользователю комфортно взаимодействовать с ресурсом. Вы анализируете пользовательский опыт (user experience, UX), который человек получает на вашем сайте — и стремитесь сделать его более комфортным.
Какие же элементы сайта важно анализировать и как их улучшить? Давайте разбираться.
Навигация
Структура сайта должна быть максимально простой и предсказуемой. Попадая на сайт, пользователь должен сразу интуитивно понять, куда нужно нажать и что он прочтет на странице, на которую перешел. Грамотно проработанная структура поможет пользователю не «ходить» из раздела в раздел, а быстро узнать все нужное и оформить заказ. 
Пример простой и интуитивно понятной структуры сайта — разработка для наших клиентов GoIT
Если у вашего сайта сложная структура (например, крупный информационный ресурс или интернет-магазин), обязательно используйте «хлебные крошки». Они показывают, как соотносятся между собой страницы сайта и помогают быстро вернуться в любой раздел. 
Хлебные крошки в магазине Цитрус
И если ценовая политика это отдельная тема, то путь оформления заказа — как раз вопрос юзабилити. Только вспомните, как бесит обязательная регистрация, подтверждение через е-мейл, четыре шага «Да, я точно хочу оформить заказ». так и хочется бросить корзину!
Путь от добавления товара в корзину до страницы «Спасибо за заказ» должен быть максимально простым и коротким. В то же время, не стоит утрировать процесс заказа до максимума. Согласно исследованию Джошуа Портера, желание пользователя отказаться от результатов не увеличивается с ростом числа кликов. 
Результаты исследования Джошуа Портера
Фокусируйтесь не на минимальном количестве кликов, а на том, чтобы сделать путь клиента проще. Например, заказывая еду, удобнее полностью оформить заказ онлайн и не общаться с продавцом по телефону. Поэтому Domino’s Pizza автоматически ставит галочку в поле «Не перезванивать для подтверждения заказа». Это освобождает клиента от бесполезного разговора, где он произносит только «Да, правильно» и экономит ресурсы пиццерии.
Согласно Web site design survey, 83% посетителей покидают сайт, если почувствуют, что им приходится слишком долго искать товар. Например, в этом случае клиенту придется отыскивать часы в нужном диапазоне стоимости. 
Неудачная реализация фильтров в магазине часов и ювелирных украшений
А здесь посетитель вынужден вручную считать, на каком ряду он приобретает билет. Снова трата нервов и времени. 
При покупке билетов не видно, какой ряд вы выбираете
Обязательно следите за тем, насколько легко и быстро покупатель может найти желаемый продукт и оформить заказ.
Упрощая поиск товара, вы помогаете пользователю быстрее оформить заказ и тем самым повышаете конверсию. Например, компания Waterfilters.net, добавив опцию поиска по сайту, увеличила конверсию на 11%.
Бытует мнение, что поисковой механизм нужен только крупным ресурсам и интернет-магазинам с тысячами товаров. Однако, поиск может быть полезен и для небольших сайтов: например, если вы ведете блог, читатель может искать материалы на интересную для него тему.
Выделенное поле поиска: строку поиска хорошо видно на странице, ее не нужно выискивать взглядом.
Информация
Многие говорят о том, что люди устали читать лонгриды. Но, согласно отчету аналитической компании Clicktale, длина страницы не влияет на вероятность того, что пользователь прокрутит страницу вниз. 
Сколько же текста готов прочесть потенциальный клиент? Это зависит только от качества вашего контента. Мало кто согласен выискивать суть в «простыне» текста, но гораздо больше людей прочтут грамотную и хорошо структурированную статью.
Проведите аудит всех текстов на вашем сайте — уберите устаревшую и неточную информацию, отследите орфографические ошибки и дайте посетителю все, что ему нужно знать для заказа.
Ваш потенциальный покупатель хочет узнать о товаре\услуге как можно больше: как выглядит, какие у него характеристики, сколько стоит, где используется и чем полезен в решении его проблемы. Помогайте ему в этом.
К чему стоит стремиться: максимальное количество фото, видео, отзывов и информации. Кстати, Розетка дает 100 грн. на бонусный счет за распаковку товара, чтобы будущие покупатели получали как можно больше информации о продукте. 
Некоторые онлайн-магазины выдают информацию о себе так скупо, что самый наивный покупатель поневоле заподозрит неладное. Их «Контакты» — это е-мейл, под которым расположена форма обратной связи. Где находится офис, как туда позвонить — непонятно.
Покажите, что вы готовы к живому общению с клиентами. На каждой странице в заметном месте размещайте телефон, иконки мессенджеров, адрес или другую важную информацию для связи. По возможности добавьте кнопку обратного звонка.
Интерфейс
Распространенная ошибка — уделять много внимания красоте и дизайну сайта, забывая при этом об удобстве пользователей. Так получаются очень красивые, но слишком запутанные сайты, на которых сложно оформить заказ. Словно женские туфли на высоком каблуке, которые годами пылятся в шкафу, такие сайты становятся тупиковой ветвью развития веб-дизайна.
Обратная сторона медали — полное невнимание к дизайну, интерфейс из 90-тых. Если человек попадет на такой сайт, он может подумать, что компания уже давно не работает, и поэтому не обновляла дизайн. 
Дизайн сайта, давно утративший актуальность
Чтобы ваш сайт был приятен глазу пользователя, его интерфейс нужно регулярно обновлять в соответствии с современными тенденциями.
Поисковые алгоритмы не жалуют сайты с низкой скоростью загрузки — и все же такие еще бывают. Согласно Якобу Нильсену, человек согласен ждать загрузки страницы всего 3 секунды. Если каждая ваша страница загружается гораздо дольше, посетителям быстро надоест ждать — быстрее уйти к конкурентам, где страницы грузятся по щелчку пальцев.
Согласно StarCounter, два года назад произошел поворотный момент — количество мобильного трафика впервые превысило десктопный. При этом Cisco прогнозирует, что к 2021 году мобильный трафик превысит показатели 2016 года в семь раз.
Еще одна приятная новость: мобильная аудитория готова совершать покупки максимально быстро. Например, один из самых популярных утренних запросов — «отправка в тот же день».
Сегодня в мобайл-версии ушли все: существуют даже русский Tinkoff-банк и украинский Monobank, которые работают исключительно в приложениях. Поэтому важность адаптивной версии сайта и (если в этом есть надобность) разработки приложения сложно переоценить. Проверьте, логично ли отображается ваш сайт на мобильных устройствах и планшетах и удобно ли им пользоваться даже с маленького экрана.
Самая худшая 404 — та, которая ведет человека в никуда. Страница, которой нет на сайте, должна быть настроена таким образом, чтобы посетитель мог вернуться на главную или сделать другой выбор. Это поможет удержать пользователя на сайте, даже если он ошибся с URL. 
Информативная 404 страница Facebook
Инструменты для анализа юзабилити
Кроме мануального анализа, для аудита юзабилити можно использовать специальные сервисы. Самые популярные среди них — Google Analytics, Яндекс.Метрика, Liveinternet. Все эти инструменты схожи по функционалу: вы можете посмотреть, сколько пользователь находился на сайте и на какие страницы переходил, какой процент пользователей захотел вернуться и т.д.
Также существуют сервисы, способные заранее оценить, насколько привлекателен для пользователя сайт. Для сравнения вкратце рассмотрим Google Аналитику и два сервиса из второй категории.
Google Analytics
Usability Hub
Вашим сервисам дают оценки реальные люди, которые дают комментарии и делают скриншоты. Вы получаете детальные отчеты со статистикой и тепловыми картами.
Feng-GUI
В отличии от предыдущего сервиса, здесь ваш сайт тестируют не реальные люди, а программный алгоритм. Он автоматически и бесплатно генерирует карту внимания посетителей на вашем сайте. Для этого достаточно просто ввести URL и нажать клавишу Analyse. 
Чек-лист юзабилити сайта
И напоследок. Генри Форд сказал:
«Если бы я спросил людей, чего они хотят, они попросили бы более быструю лошадь».
Но Форд вышел за рамки привычного и все мы знаем, к чему это привело. Даже если вам кажется, что ваш сайт прекрасен (как лучшая беговая лошадь), всегда стремитесь к тому, чтобы создать автомобиль.
10 правил юзабилити. Разбираемся на примерах
С каждым днем все больше услуг, начиная от сферы образования и до медицины, переходят в онлайн. Растет спрос, растет предложение, и конкуренция среди онлайн-площадок также стремится вверх. Грамотное и удобное оформление систем необходимо не только чтобы привлечь пользователей, но и чтобы их удержать.
Совместно с UI/UX дизайнерами Forte Group мы решили разобраться в 10-ти правилах эвристики, на которых зиждется весь User Experience, а значит весь опыт взаимодействия с онлайн-системами.
UX дизайн или User Experience — это любой опыт, который пользователь получает при взаимодействии с объектом. Это может быть как опыт использования приложения, так и дверной ручки.
Чтобы продемонстрировать важность UX, обратимся к статистике от ведущего в мире UX агентства — Intechnic:
— 70% пользователей могут уйти с сайта, если им не понравится дизайн интерфейса;
— 62% из них поделится своим негативным опытом с другими пользователями;
— 79% никогда не вернутся на сайт, если им было трудно его использовать в первый раз.
Чтобы ваш сайт или приложение не превратилось в головоломку, проверьте свой продукт 10 правилами юзабилити. Сформулировал их еще в 90-х годах Якоб Нильсен и назвал правилами эвристики. Не смотря на то, что эти правила были придуманы порядка 30-ти лет назад, они актуальны до сих пор.
Давайте пройдемся по каждому из них отдельно и рассмотрим примеры, где они работают, а где нет. В дальнейшем вы сможете использовать этот список, как чек-лист при создании интерфейса. Погнали!
Пользователь всегда должен понимать, что происходит в данный момент в системе (на сайте, в приложение и тп). Производя какие-то действия, пользователь должен понимать, есть у системы отклик или нет. Интерфейс может реагировать через прелоадеры, сообщать о статусах загрузки, объяснять через прогресс бары, счетчики и тд. Кроме этого, статус может сообщаться через окна успешных действий и ошибках. В общем, все элементы, которые помогают понять пользователю, что система работает. Обратная связь интерфейса должна быть своевременной, осмысленной и простой для понимания, чтобы пользователи знали, что их действия замечены системой.
Например, Facebook был одной из первых компаний, которая сделала мобильное приложение и решила кастомизировать прелоадер, значок загрузки при каждом запуске приложения. Но пользователям это не нравилось, они отправляли жалобы о том, что Facebook стал слишком медленно работать.
Система должна быть очень простой и не превращать взаимодействие с ней в головоломку. Символы внутри системы тоже должны быть простыми и схожими с теми, которые мы используем в реальной жизни.
Система должна быть понятна пользователю не только визуально, но и вербально. Говорите с вашим пользователем на одном языке. Например, на банковских сайтах от слов «лизинг», «факторинг» и «переуступка долга» у пользователя могут разбегаться глаза. Сложные конструкции словно обвиняют в пропуске пар по курсу экономики в университете. В таких случаях иконки становятся более информативными, чем сам текст.
Классный пример можно найти у компании Spotify (музыкальный стриминговый сервис). Когда ты случайно лайкаешь песню, а потом убираешь лайк, внизу выскакивает фраза «Let’s pretend that never happened»(Давай притворимся, что ничего не произошло). Пользователю приятно, так как система дает лаконичный и по-дружески шуточный фидбек.
Действие отмены — самое частое действие, которое совершает пользователь во всех онлайн-системах. Поэтому третье правило звучит так, чтобы любая система предлагала возможность дублировать или отменить последнее совершенное действие.
Это настолько важно, что команда IOS разработала отдельное действие отмены для смартфонов: встряхнуть телефон.
Несмотря на то, что система должна развязывать руки пользователю, до сих пор не все мессенджеры активировали опцию редактирования отправленных сообщений.
Вот еще один неудачный пример, где во время использования сайта магазина одежды, достаточно агрессивно выныривает реклама их мобильного приложения. При просмотре товара, рекламный pop-up закрывает важную кнопку назад. Чтобы вернуться, пользователю нужно искать кнопку назад в браузере и есть вероятность, что после таких игр в кошки-мышки пользователь вообще не вернется на сайт.
Есть стандарты однотипных систем, которых стоит придерживаться. Любые отклонения могут привести пользователей в заблуждение. Будет странно, когда ваши подразделы будут кардинально отличаться от подразделов конкурентов. Пользователь просто не сможет их сравнить.
Все знакомы с навигацией интернет-магазинов: меню слева, сверху разделы и поля для логина и пароля, корзина. Это все стандартизировано. Очень сложно найти интернет-магазин, который кардинально отличается от конкурентов.
Еще пример — меню почтовых агентов. Мы уже привыкли, что первыми в списке всегда будут входящие, а в конце списка будут папки Спам и Корзина.
Плохой пример. На сайте BBC есть секция, где люди оставляют комментарии, за которые можно голосовать. Рейтинги Highest обозначены стрелкой вниз, а Lowest стрелкой вверх, (здесь нет логики). Логичнее сделано на Stackoverflow (сайт вопросов\ответов о программировании).
Лучше использовать интуитивно понятные стандарты, чем изобретать велосипед и пытаться переучивать пользователей.
В дизайне любой системы стоит придерживаться одной цветовой гаммы. В примере ниже указана кнопка «Купить», отрисованная разными цветами. Пользователь сразу начинает сомневаться, одну и туже функцию выполняют эти кнопки или нет.
Если система дает сигнал пользователю, что большая красная кнопка выполняет важные действия, она должна выполнять их во всей системе. Ни зеленая или серая, а красная. Должна прослеживаться однородность системы.
Лучше предупредить о возможности ошибки, чем придумывать красивые и содержательные сообщения о последствиях. Всегда продумывайте сценарии, в которых может возникнуть ошибка, и старайтесь ее предотвратить.
Например, наши гаджеты, которыми мы пользуемся каждый день, предупреждают нас push-уведомлениями, звуковыми сигналами или вибрацией о низком заряде батареи.
Понятно, что ничего не произойдет, если твоя зубная щетка будет разряжена и ты не сможешь почистить зубы. Но, если речь идет о каком-то серьезном оборудовании, где на кону стоит жизнь человека или его здоровье, предупреждающие сигналы очень важны.
Еще пример. При оплате картой онлайн, система сразу подсказывает в полях для заполнения, какую информацию ожидает от пользователя: номер карты, срок действия, имя. Или, когда мы придумываем пароль для регистрации аккаунта, сайт показывает, какие условия для пароля выполнены, а какие нет. Например, в пароле нет заглавной латинской буквы.
Нельзя заставлять пользователя слишком много думать. Всё взаимодействия должны происходить на интуитивном уровне. Например, всем знакомый знак.
А теперь представьте: вы пошли в бар, выпили коктейль, решили сходить в туалет и видите вот такое.
И не понимаете, в какую вам дверь. Это очень креативно, но заставляет пользователя думать. В итоге, он может не найти то, что искал, либо найти, но поздно:)
Ниже еще пример с эскалаторами, как одна мелкая деталь может полностью изменить восприятие пользователя.
Иконки всё чаще заменяют текст и упрощают нам жизнь, но стоит их использовать аккуратно. Ведь метафоры на иконках могут быть не так очевидны.
Если ты сомневаешься, что твоя иконка считывается правильно, лучше используй текст.
Мы никогда не знаем, с каким опытом придет пользователь на наш сайт или приложение, поэтому всегда выигрывают системы, в которых есть ускорители и возможность настраивать действия. Ниже вы найдете поп-ап, у которого есть минимум 4 способа закрытия. Все нашли?
Если система может предоставить пользователю несколько способов совершения одного действия, то пусть сделает это. Если убрать кнопку Close и крестик, то пользователи, у которых не было опыта взаимодействия, с клавишей Esc или с правилом «кликнуть по свободному пространству вокруг поп-апа», растеряются и не сразу смогут закрыть окно.
Еще пример — лайки в инстаграме. Поставить лайк публикации можно не только, кликнув на иконку сердечка, но просто два раза нажав по экрану.
Работа ускорителей хорошо представлена на сайтах покупки билетов. В поле, где вы начинаете вводить желаемое направление маршрута, система сразу начинает вам предлагать варианты на основе уже введенных данных. Если вы ищите маршрут туда-обратно, курсор сам перескакивает из поля туда, в поле обратно, когда вы определяетесь с выбором направления.
Восьмое правило — это эстетика минимализма в дизайне. Чем проще сайт визуально и функционально, тем быстрее пользователь достигнет своей цели на нем. Ниже пример очень перегруженного британского сайта для покупки машин в лизинг.
Обратный пример — поисковик Google. Здесь всё просто, лаконично и интуитивно понятно.
Невозможно избежать ошибок при работе системы. Главное — это правильно объяснить пользователю, почему произошла ошибку и что с этим делать дальше.
Например, при регистрации нового пользователя система подсветит поле ввода, если пользователь с таким именем уже существует. А еще система может предложить варианты свободных имен на основе введенных ранее данных.
Еще пример: сайты для поиска работы. Любой пользователь может опечататься при вводе данных, но система все равно понимает его, обрабатывает запрос и выдает результат. Если бы система не поняла запрос, то поиск не дал бы никаких результатов. Пользователь мог не перепроверить свои действия и уйти с негативным опытом.
Почти 10% пользователей читают справочные материалы или проходят туториал для использования системы. Чаще всего пройти туториал система предлагает при первом скачивании или регистрации. У пользователя должен быть выбор: проходить обучение или нет. Справочные материалы всегда должны быть легко доступны, даже если пользователь при первом визите в систему отказался проходить туториал.
Хороший пример туториал от IOS по использованию мышки. Здесь показывается не только ее функционал, но и как она взаимодействует в интерфейсе. Сам туториал можно включить и выключить.
Для знакомства пользователей с масштабными и сложными сайтами чаще всего используют FAQ или часто задаваемые вопросы.
На этом всё. Надеемся, вы найдете эти советы и примеры полезными и в дальнейшем будете использовать их при работе с системами. Творите:)