Как стать веб-дизайнером: UX, UI, рост в профессии и зарплаты
Результат работы дизайнеров окружает нас повсюду. У сайтов — дизайн. У ноутбука или телефона — тоже дизайн. У чайной кружки, стола, одежды, книг — дизайн есть у всего. Отсюда и множество отдельных дизайнерских профессий: графический дизайнер, дизайнер мобильных приложений, веб-дизайнер.
Интересно и то, что у многих дизайнерских профессий появились свои ответвления. Например, в digital-мире есть UX-дизайнер и UI-дизайнер. В рамках этих должностей специалисты решают разные задачи, но по сути объединены одной корневой профессией — веб-дизайном.
В статье расскажем о UX/UI-дизайнерах: в чем их отличие, какие они решают задачи, сколько зарабатывают и что умеют делать. В конце поделимся списком, где учиться веб-дизайну.
UX vs UI: в чем отличие?
UX и UI часто путают или воспринимают как одно целое, не вдаваясь в подробности.
Разведем понятия на простом примере. Как выглядит ваш смартфон — это UI. Как расположены внутри телефона функции, насколько быстро вы сможете их найти и сколько пришлось совершить шагов для достижения этих целей — это UX.
UX и UI тесно взаимосвязаны. Оба дизайнера трудятся для одного веб-продукта, и у обоих есть цель — сделать его интерфейс удобным и интуитивно понятным.
При проектировании интерфейсов удобство взаимодействия так же важно, как и внешний вид
UX-дизайнер продумывает сценарии поведения пользователей. То, как они будут взаимодействовать с интерфейсом, какие шаги предпримут для достижения цели.
UI-дизайнер, в свою очередь, продумывает, как эти шаги увидит пользователь.
Пример грамотного веб-дизайна, UX + UI — интернет-магазин Asos Marketplace. Сайт удобен покупателям: отличные изображения, внятные описания в разговорном стиле, ясные призывы к действию с переходами в каталог и очевидные выгоды, например, бесплатная доставка. При этом сайт стильный и презентабельный — сохранен фирменный стиль бренда Asos, а шрифты, цвета и визуал сочетаются между собой.
На Asos Marketplace выполняются все задачи дизайна: пользователям интуитивно понятно и видно, куда нажимать для просмотра женской коллекции, как сделать заказ, где ответ на его вопросы и сколько надо заплатить за понравившуюся вещь.
Терминология:
-
UX — User eXperience — Пользовательский опыт. Цель UX — сделать продукт удобным.
-
UI — User Interface — Пользовательский интерфейс. Цель UI — сделать продукт красивым.
Какие инструменты используют дизайнеры
Для разработки эффективного веб-дизайна недостаточно владеть только Adobe Photoshop. Чем больше инструментов и платформ вы покорили, тем выше шанс грамотно спроектировать рабочий дизайн. Разные программы подходят для решения разных дизайнерских задач.
-
Для разработки структуры
Если задача сложная, требует построения сложных логических связей используйте mindmap-сервисы — XMind, FlowMapp, MindMeister.
-
Для концепт-решений
Макеты концептов можно рисовать где удобно. Для этих целей подходят Photoshop и Sketch.
-
Для интерактивных прототипов
Для создания интерактивных прототипов можно использовать Figma, InVision, Axure, Adobe XD.
-
Для анимации в интерфейсе
Если хотите проработать анимацию в интерфейсе, можно использовать Framer и UXPin.
Аналитическая сторона работы
Веб-дизайнеры всегда анализируют и буквально встают на место пользователя. Они копают глубоко и постоянно задают вопрос «Почему так?».
Например, веб-дизайнеры интернет-магазина ZARA предположили, что большой выбор сбивает с толку, а при его ограничении покупатель почувствует себя уверенней.
Поэтому главными фишками сайта стали минимализм и интуитивно-понятная структура.
Ещё UI и UX дизайнеры создают эмоции и отслеживают их влияние на продукт. Хорошие дизайнеры понимают, что пользователь приходит на сайт или работает с приложением для решения конкретной задачи. Поэтому нужен удобный интерфейс, где пользователь решит свою задачу, не отвлекаясь ни на что больше.
Рассмотрим на примере. Вы только прилетели из путешествия и вспомнили, что у подруги сегодня день рождения. Открываете переписку — праздник сегодня, вы приглашены. Срочно нужен подарок! По пути на мероприятие вы смотрите на карте ближайший цветочный магазин — отлично, есть прям рядом с ее домом. Открываете сайт цветочного — картинки четкие, на товарах стикер «В наличии», букеты разделены по цене и есть удобная кнопка для заказа, которая при нажатии открывает чат в Whatsapp. Вы написали продавцу, забронировали букет и со спокойной душой успели на праздник с подарком.
Когда человек закрыл свою боль быстро — он счастлив. Если бы на сайте была неразбериха — пришлось бы долго разбираться. А времени и желания разбираться, когда болит, — нет. Поэтому человек бы испытал злость и раздражение. Для положительных эмоций как раз нужны веб-дизайнеры.
Soft skills
Работать веб-дизайнером будет проще, если вы владеете навыкам коммуникации, умеете расставлять приоритеты и не боитесь ошибок и экспериментов. Также эффективно решать задачи помогут логическое мышление, самостоятельность и внимание к деталям.
Сколько зарабатывают веб-дизайнеры
Российский портал rbc.ru составил список востребованных профессий за 2019, в его топ вошли UX и UI-дизайнеры. Но спрос на кадры растет не только в России. Например, в Google Trends за последние 5 лет интерес к запросу «UX-дизайн» в Европе, США, Канаде и Австралии удвоился и продолжает увеличиваться.
Диапазон зарплат зависит от обязанностей, скиллов и места работы: на фрилансе или в студии. По данным hh.ru, средняя предлагаемая зарплата в 2019 году была вот такой:
5 советов для тех, кто хочет стать веб-дизайнером
-
Обращайте внимание на все интерфейсы и задавайте себе вопросы. Почему они поставили логотип сюда? Почему кнопка одна и в конце, а не в начале? Почему использовали этот цвет? Отвечайте на них и прокручивайте варианты в голове. Так вы начнете не просто использовать сайт, а оценивать его с профессиональной точки зрения.
-
Окружите себя дизайном. Рекомендуем погрузиться полностью в дизайн и каждый день смотреть чужие работы. Такая практика просмотров чужих портфолио поможет вам видеть, как и что делают другие. Вы будете в курсе модных тенденций и сможете вдохновляться. Посмотреть работы других дизайнеров можно на Behance, Dribbble или Awwwards.
-
Пройдите курсы. Так ваш труд быстрее окупится, и вы сможете сэкономить время на старте в новой профессии. На курсе веб-дизайна от Бруноям вы получите заботливого наставника, вдохновленных одногруппников и проекты для готового портфолио. Практика начнётся с самого первого занятия. На курсе обязательно расскажем, где искать работу, как набраться опыта, составить резюме и пройти собеседование. А еще дадим сертификат и научим находить первых клиентов.
-
Читайте. Литературы, статей, материалов для веб-дизов создано очень много. Поделимся подборкой книг, которые вдохновили нас и наших студентов — Остин Клеон «Кради как художник» и «Покажи свою работу!», Майкл Джанда «Сожги своё портфолио!», Брайан Трейси «Выйди из зоны комфорта. Измени свою жизнь».
-
Практикуйтесь до упора и не бойтесь ошибаться. Попробуйте начать работать над важным для вас проектом еще на этапе обучения на курсах и во время обучения инструментов. Старайтесь все время делать какой-нибудь проект. Лучший способ учиться — тут же делать то, что вы читаете и слушаете. Конфуций как-то сказал: «Скажи мне — и я забуду, покажи мне — и я запомню, Дай мне сделать — и я пойму!».
Остались вопросы? С удовольствием ответим на все по телефону 8 (800) 551-39-04 или в онлайн-чате на сайте. Не забывайте подписываться на нас в Instagram и ВКонтакте. Будем дружить!