UX vs. UI – на чем стоит сосредоточиться в веб-дизайне

(Приглашенный писатель: Тариф Кан)

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

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

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

Сравнение UX и UI в веб-дизайне

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

Традиционные элементы пользовательского интерфейса включают следующее:

• Меню
• Навигация
• Интерактивные ссылки
• Полосы прокрутки
• Флажки
• Формы лидогенерации
• Панировочные сухари
• Кнопки
• Карусели и слайдеры изображений
• Фильтры
• Панели поиска
• Ящики для комментариев
• Погрузчики
• Модальные окна
• Уведомления

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

• Эстетическая привлекательность сайта в целом и отдельных элементов
• Выбор шрифта, цвета и графики
• Размер, интервалы и использование отрицательного пространства в макете
• Насколько легко пользоваться сайтом и насколько он приятен
• Легкость поиска необходимой информации / выполнения необходимого действия

В целом хороший UX смотрит на реакции, основанные на эмоциях. Автор Стив Круг перечисляет элементы хорошего UX как в том числе:

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

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

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

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

Цель хорошего пользовательского интерфейса

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

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

Цель хорошего UX

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

По сути, хороший UX определяется тем, есть ли у пользователя хороший опыт – короче говоря, UX точно назван!

Описание разницы

К настоящему времени должно быть очевидным совпадение между UX и UI. Но все же может быть трудно объяснить, в чем разница между ними.

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

Например, Крэйг Морризон, младший креативный директор Truvani, говорит: “Нет никакой разницы между UX и UI-дизайном, потому что это две вещи, которые не сопоставимы друг с другом … пользовательский интерфейс состоит из множества различных компонентов, дизайн пользовательского интерфейса является лишь одним из них, которые в сочетании друг с другом создают повысить удобство использования.“

В конечном счете, UI – это компонент UX, который может сильно повлиять на более широкую цель.

Как UI влияет на UX

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

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

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

Итак, теперь, когда мы прояснили все сходства и различия, как насчет главного вопроса: на каком из них следует сосредоточить внимание дизайнера?

Сужение внимания к дизайну

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

Или, скорее, на каком из них сосредоточиться в первую очередь – и когда – и в какой степени. UI против UX может показаться сценарием «курица или яйцо»: какой из них заслуживает внимания в первую очередь? Но это скорее случай логической работы над дизайном, при этом все время следя за конечной игрой.

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

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

(Этот гостевой пост написан Тарифом Каном для Hongkiat.com. Тариф – руководитель отдела дизайна в Logo Design (logodesign.net), который любит делиться своими разнообразными знаниями в области графического дизайна, веб-дизайна и разработки, а также полиграфического дизайна. Он любит экспериментировать с новыми технологиями и умеет фотографировать. Его можно найти в Твиттере по адресу: @Кантариф)