Что представляет собой UI- и UX-дизайн? Почему UX-дизайнеров не существует в природе?


Поделиться

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

Почему использовать понятие «UX-дизайнер» не верно?

Чтобы разобраться с данным вопросом, придётся копнуть поглубже и выяснить, что такое UX и UI. Для удобства и наглядности мы внести эти два понятия в таблицу.

Из вышесказанного выходит так, что дизайнер не может контролировать субъективные переживания пользователей. Более того: каждый из них имеет свои, сугубо индивидуальные предпочтения, которые невозможно учесть в комплексе, который относится к UX-дизайну. Так правильно ли говорить о UX-дизайнере как таковом?

Руководитель отдела по дизайну британского финансового конгломерата “Lloyds Banking Group” считает, что UX-дизайна не может быть по одной простой причине: опыт пользователя – это его личное переживание, которое находится вне власти дизайнеров. В то же время, по его словам, специалисты, располагающие соответствующими знаниями и опытом, конечно же, могут оказать на него определённое влияние… Но здесь есть одно хоть и небольшое, но очень весомое «но»: таких специалистов может быть немало. К ним можно отнести:

  • Web-разработчика, который реализует проект, создавая привлекательный дизайн, продумывает удобство навигации;
  • Авторов текстового контента и редактора, которые обеспечивают необходимую информацию и доступность на сайте;
  • Специалисты на заводе-производителе разрабатывают и изготавливают качественный товар, который будет представлен в онлайн-магазине;
  • Операторы call-центра отвечают на вопросы пользователя, помогают ему определиться с выбором, а также обсуждают время и условия доставки;
  • Специалисты отдела доставки правильно формируют заказы, аккуратно их пакуют и отдают перевозчику.

Как видите, влияние на то, какой именно опыт от взаимодействия с онлайн-ресурсом получит пользователь, оказывает целый ряд специалистов. Можно ли кого-то из них назвать UX-дизайнером? От кого зависит слаженность действий всей этой команды? Кто влияет на то, насколько вежливы операторы call-центра? От кого зависит уровень подготовки менеджеров по продажам и их знание особенностей того или иного товара? Кто определяет правила упаковки товара и организует эту работу? В зависимости от размеров предприятия это – владелец или руководящее звено, а также специалисты по маркетингу.

Влияние UI-дизайна на опыт пользователя от взаимодействия с продуктом

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

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

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

Атрибут “Alt”

Его используют для тэга “img”, устанавливая альтернативный текст для того или иного изображения. Последний отображается в том случае, если загрузка графической составляющей в web-обозревателе отключена. Благодаря этому пользователи с нарушениями зрительной функции, задействовав скринридер, имеют возможность понять, что именно изображено. Положительно ли это влияет на их опыт взаимодействия с сайтом? Несомненно!

Атрибут “Autofocus”

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

Информативные анкоры

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

Проверка правильности заполнения полей формы

Практически любой пользователь сталкивался со следующий ситуацией: после заполнения полей формы со многими пунктами она не отправляется и появляется сообщение об ошибке. Приходится тратить время на заполнение снова. Решить проблему (а заодно – и положительно повлиять на пользовательский опыт) поможет автоматическая проверка правильности заполнения. Так, если в процессе пользователь допустил ошибку, форма покажет ему это – и он своевременно исправит её, сэкономив себе время.

Асинхронная загрузка

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

Визуальный отклик

С помощью него можно сделать пользование web-сайтом более приятным, что положительно скажется на опыте взаимодействия. Решения данной направленности включают в себя различные эффекты. Например:

  • Красивый предзагрузчик, который меняет цвет по мере загрузки сайта;
  • Изменение внешнего вида кнопки при наведении на неё курсора;
  • Изменение цветового решения полей формы при их правильном заполнении.

Модули, содержащие рекомендации

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

Не заполненное пространство

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

Удалите sidebar

Sidebar (или «боковая панель») сегодня считается лишним элементом, который лучше всего удалить. Её отсутствие на сайте положительно влияет на опыт пользователя, что подтверждено рядом исследований.

Итоги: UI – важная составляющая UX

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

Читайте также


Как определить, что Ваш сайт устарел, и что с этим делать?

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


Каким должен быть дизайн сайта, чтобы его можно было назвать отличным?

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