Основы дизайна

Чем отличается WEB-дизайнер от UI-дизайнера и UX-дизайнера

Разберем разницу между веб-дизайнерами, UX-дизайнерами и UI-дизайнерами. Пригодится всем, кто интересуется карьерой в этом направлении. 🌿👇
Иллюстрация Agnieszka: https://dribbble.com/shots/10034855-Mobility

Разница между Веб, UX и UI — в том, что это разные уровни дизайна в одном диджитал-бренде.

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

Содержание:

Что это, Веб- UX- и UI- дизайн простыми словами

WEB (англ. World Wide Web — интернет, всемирная паутина), а веб-дизайнер — это архитектор комфортных, функциональных и выразительных веб-пространств: сайтов, блогов, интернет-магазинов, социальных сетей и рекламы. Если бренд как страна в диджитал, то именно веб-дизайнер помогает сделать так, что в ней было приятно находиться, ориентироваться, путешествовать и интересно возвращаться.

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

UI (англ. user interface) переводится как «пользовательский интерфейс». UI – охватывает не только графический интерфейс, а еще и тактильный, голосовой или звуковой.

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

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

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

Кто такой веб-дизайнер и чем он занимается?

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

Задача веб-дизайнера

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

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

Что нужно уметь делать Веб-дизайнеру

Основные инструменты:

Figma, InVision Studio, Tilda

Зарплата:

Junior/Middle/Senior — 40/60/80

Как стать веб-дизайнером:

Хочешь прокачаться в веб-дизайне? Собрала в 10 шагов все, что помогло мне прокачать навыки веб-дизайна, сделать проекты и собрать портфолио. Читать статью

Кто такой UI-дизайнер (дизайнер интерфейсов) и чем он занимается?

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

Что нужно уметь делать UI-дизайнеру

Задача UI-дизайнера:

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

Основные инструменты:

Figma, InVision Studio, Procreate

Зарплата:

Junior/Middle/Senior — 40/60/80

Как стать UI-дизайнером:

Хочешь прокачаться в UI-дизайне? Упаковала в 10 шагов все, что помогло мне освоить навыки UI-дизайна, выполнить проекты и собрать портфолио. Читать статью

Кто такой UX-дизайнер и чем он занимается?

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

Пример сценария (User Flow) по заказу комбо.

Что нужно уметь делать UX-дизайнеру:

Задача UX-дизайнера:

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

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

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

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

Модель и Интерфейс тесно взаимосвязаны. Чтобы понять разницу между Моделью и Интерфейсом, задайте вопрос: откуда вообще взялась корзина? Разве клиенты добавляют автомобили в тележку пачками, как в супермаркете? Или все-таки нужна модель не корзины/тележки из супермаркета, а тест-драйва в автосалоне?

То есть мы в приложении можем вместо корзины сразу при выборе автомобиля предлагать записаться на тест-драйв или начать оформление покупки (в том числе в кредит). А теперь задайте вопрос: как часто покупатели дорогого автомобиля готовы менять авто и вписывается ли мобильное приложение в их жизненный контекст?

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

Основные инструменты:

Figma, InVision Studio, Miro, Amplitude/Google Analytics 360, Google Docs/Notion, Screen/Audio/Video Recorder

Зарплата:

Junior/Middle/Senior — 80/120/160

Как стать UX-дизайнером:

Хочешь прокачаться в UX-дизайне? Упаковала в 10 шагов все, что помогло мне освоить навыки UX-дизайна, выполнить проекты и собрать портфолио. Читать статью

Вывод и рекомендация

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

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