Дизайн UI и UX: что это и в чем разница между этими понятиями

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

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

Почему разграничивать эти понятия важно. Путая UI и UX дизайн между собой и/или неверно применяя эти термины, вы рискуете:

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

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

UX: пользовательский опыт — что это и с чем его едят

UX (англ. User Experience, пользовательский опыт) — если дословно, это впечатления пользователя, которые он получает от взаимодействия с сервисом, услугой, продуктом. UX-дизайн — разработка полезных, функциональных, адаптивных и удобных продуктов (веб-сервисов, десктопных и мобильных приложений).

Задача UX-дизайнера — максимально упростить использование продукта для потребителя и ускорить получение им искомого результата. Грубо говоря — сократить путь о точки «А» в точку «Б». Для этого специалисту необходимо умение анализировать и высокий уровень эмпатии (способность ставить себя на место другого, видеть продукт глазами пользователя).

Обязанности UX-дизайнера:

Портретирование аудитории (User Profiling) — сбор и анализ личных данных для понимания потребностей, предпочтений, «болей» — возраст, пол, страна, регион, круг интересов и т.д.
Создание/ оптимизация информационной архитектуры (структуры) продукта — чтобы все было понятно и последовательно (разделы, кнопки, блоки на страницах были на своих местах).
Мониторинг поведения пользователей для поиска узких мест — как быстро и просто люди находят кнопку «Купить»/ «Помощь менеджера» и т.д., на каком этапе покидают страницу и почему, достигают ли цели, если нет, что мешает, etc.
Проверка юзабилити — удобно ли пользоваться продуктом с телефона, как долго грузятся страницы, информативны ли уведомления, решают ли они задачу пользователя или раздражают бесполезным спамом и т.д.
Оптимизация контента (пресловутое умение поиграть со шрифтами) — суть, подача, объем, оформление текста на главном экране, на кнопках, количество слов в строке, адаптивность форматирования на всех устройствах и прочее.

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

UI: пользовательский интерфейс — что это такое

UI (англ. User Interface, пользовательский интерфейс) — это об оформлении, собственно, интерфейса. Это работа с визуальной составляющей: стиль, цвет, концепция, оформление меню, системы поиска, фильтров и других элементов на сайте/ в сервисе/ приложении. Такой специалист занимается визуалом: от шрифта и цвета текста до способа анимированного перехода между экранами.

Обязанности UI-дизайнера:

Оценка и управление визуальным восприятием. Например, кнопка «Купить» — какого она должна быть цвета и размера, где должна находиться, какой стиль, шрифт, какие эффекты будут уместны при наведении на нее курсором конкретно на этом сайте и для этого продукта и т.д. — все эти детали продумывает и прорабатывает UI-дизайнер.
Разработка, подбор, создание графики. Картинки, иллюстрации, инфографика — концепцию, стиль рисовки и прочее подбирает также UI-специалист.
Проработка визуального единства (универсализация). Дизайнер интерфейсов отвечает за адаптивность дизайна, чтобы все выглядело стильно и одинаково на любых типах устройств, хоть десктопных, хоть мобильных. Сюда же относится единство оформления на всех частях сайта — эдакий корпоративный стиль.

Помните наш пример с тропинкой? Так вот UI-дизайнер отвечает за то, чтобы тропинка была привлекательной для тех, кто по ней ходит: высадить ли вдоль нее цветы, разбить сад камней или украсить стену рядом граффити — смотря что за аудитория.

Чем UX отличается от UI и зачем нужно это разделение?

Давайте сравним эти понятия на основе того, что уже выяснили:

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

Зачем нужно это отличие, почему бы не объединить UX и UI дизайн в одно понятие — спросите вы?

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

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

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

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

Кто такой UX/UI дизайнер — что он делает и почему существует

Да, да, всю предыдущую часть статьи мы объясняли, что это разные вещи. Это так, и разницу между ними критически важно понимать. Но. Чаще всего эти понятия используются в связке, так как они дополняют друг друга и по отдельности в принципе не существуют и не нужны — только в тандеме. Следите за руками: User Interface (UI) — это инструмент и составляющая часть User Experience (UX), то есть UX-дизайн — более общее понятие.

И вот вам информация к размышлению:

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

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

Подведем краткие итоги

UI и UX-дизайнеры выполняют разные задачи в работе над продуктом:

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

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

UI — составляющая часть UX, поэтому технически работа UX-дизайнеров важнее при создании сервисов и приложений. Качественно сделанный интерфейс будет хорошо работать и со средненьким дизайном (вспомните тот же Facebook), но негативный пользовательский опыт никакими рюшечками и красивым шрифтом не перекроешь. Условно: если человек не может найти на странице кнопку «Купить», он уйдет к конкурентам, у которых она на видном месте, и до вашего красивого фона и анимаций ему дела уже не будет.

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