×

Как стать UX/UI-дизайнером с нуля

Россия +7 (495) 139-20-33
Шрифт:
0 2666
Подпишитесь на нас в Telegram

Успех приложения зависит в том числе и от того, насколько комфортно им пользоваться. По данным исследования Google и MTM, 74% людей удаляют приложения ритейлеров из-за неудобного интерфейса. 

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

Рассказываем, как стать UX/UI-дизайнером с нуля и что входит в его обязанности. 

Прототип сайта креативного агентства

Прототип сайта креативного агентства. Работа студентки Contented

Чем UX отличается от UI

UX расшифровывается как user experience – «пользовательский опыт». 

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

UI – это user interface (пользовательский интерфейс). Проще говоря, это оформление сайта: сочетания цветов, шрифты, иконки и кнопки.

Чем занимается UX/UI-дизайнер

UX- и UI-дизайнеры тесно сотрудничают. Первый исследует целевую аудиторию (ЦА) продукта, анализирует пути пользователя (CJM). Второй визуализирует итоговую концепцию и воплощает идеи в жизнь.

Часто это зоны ответственности одного специалиста – UX/UI-дизайнера. Обычно его работа состоит из следующих этапов.

Концепт приложения Ozon с механиками персонализации

Концепт приложения Ozon с механиками персонализации. Работа студентки Contented

1 этап. Исследование ЦА

Чтобы как можно точнее представить себе будущего пользователя, UX/UI-дизайнер составляет портрет ЦА. В него входят такие показатели, как: 

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

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

Вот как выглядит портрет ЦА для маркетплейса одежды: 

 Пол: женщины.

Возраст: 18–55 лет.

География проживания: все регионы России.

Доход: низкий, средний, выше среднего.

Семейное положение: замужние, незамужние, с детьми и без

Интересы: мода, семья, активный образ жизни, карьера.

Цели использования приложения: покупка одежды с доставкой.

Эта ЦА слишком широкая и дизайнеру будет сложно на нее ориентироваться. Скорее всего, он разобьет ее на несколько маленьких.

Девушки в возрасте от 18 до 24 лет с невысоким доходом из городов-миллионников. Активно пользуются приложением во время скидок и распродаж. Покупают недорогую, но трендовую одежду. 
Женщины от 25 до 55 лет со средним доходом из регионов. Работают в офисе, замужние. Покупают одежду себе и детям. Любят закупаться про запас. 
Женщины от 25 до 40 лет с высоким доходом из Москвы и Санкт-Петербурга. Ведут активный образ жизни, занимаются спортом, путешествуют. Покупают люксовую одежду и спортивные товары. 

2 этап. Анализ конкурентов

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

3 этап. Создание структуры

На этом этапе определяется структура будущего продукта: разделы, порядок их расположения, взаимодействие друг с другом. Для этого нужно составить Customer Journey Map (CJM) – карту пользовательских путей.  

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

Каталог приложений SmartMarket

Каталог приложений SmartMarket. Работа студентки Contented

4 этап. Работа над прототипом

На этом этапе продукт обретает первые черты. Именно с прототипа начинается работа над UI-дизайном. Прототип показывают заказчикам и инвесторам, а еще его тестирует ЦА. 

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

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

5 этап. Тестирование

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

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

6 этап. Поддержка и развитие продукта

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

Приложение сервиса для доставки еды OKOLO

Приложение сервиса для доставки еды OKOLO. Работа студентки Contented

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

Сфера UX- и UI-дизайна требует многих знаний и навыков. Перечислим некоторые из них.  

Пользоваться визуальным языком дизайна

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

Знать основы диджитал-маркетинга

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

Владеть программами

Вот основные, которыми чаще всего пользуются UX-дизайнеры: 

  • Figma или Sketch – для макетов и прототипов. 
  • Adobe Photoshop – для работы с растровыми изображениями. 
  • Invision или Marvel – для кликабельных прототипов. 
  • After Effects или Principle – для анимации. 
  • Adobe Illustrator – для иллюстраций.

Прототип приложения онлайн-кинотеатра

Прототип приложения онлайн-кинотеатра. Работа студентки Contented

Быть эмпатичным 

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

Как стать UX/UI-дизайнером с нуля

Самостоятельно

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

Блоги про UX-дизайн:

  • Юрий Ветров об интерфейсах. 
  • Интерфейсы без шелухи. 
  • Альманах Redymag

Сайты про UX-дизайн:

  • Medium.com. 
  • ux.pub. 
  • ux-journal.ru.

Книги про UX-дизайн:

  • «Дизайн привычных вещей» Дональда Нормана. 
  • «Не заставляйте меня думать» Стива Круга. 
  • «Дизайн пользовательского интерфейса» Влада Головача. 
  • «Об интерфейсе» Алана Купера.

На курсах

На курсах по UX/UI-дизайну вы сможете освоить профессию с нуля. В Contented преподают специалисты из топовых агентств и IT-компаний – Cuberto, VK, Райффайзенбанк. 

Практика тоже будет. Студенты тренируются на реальных брифах от партнеров. К моменту выпуска в их портфолио появляются несколько крепких работ – интерфейсов сайтов и приложений. 

Центр карьеры помогает с трудоустройством. Чтобы получить долгожданный оффер, каждый выпускник проходит несколько этапов. 

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

Лендинг проекта СБЕР ЗОЖ

Лендинг проекта СБЕР ЗОЖ. Работа студентки Contented

На стажировке

Конечно, куда больше вам будут рады там после курсов. В Contented по желанию студент отправляется на стажировку в IT-компанию и может получить оффер в случае успеха. 

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

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

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

Друзья, теперь вы можете поддержать SEOnews https://pay.cloudtips.ru/p/8828f772
Ваши донаты помогут нам развивать издание и дальше радовать вас полезным контентом.

Есть о чем рассказать? Тогда присылайте свои материалы в редакцию.


Новые 
Новые
Лучшие
Старые
Сообщество
Подписаться 
Подписаться на дискуссию:
E-mail:
ОК
Вы подписаны на комментарии
Ошибка. Пожалуйста, попробуйте ещё раз.
Отправить отзыв
ПОПУЛЯРНЫЕ ОБСУЖДЕНИЯ НА SEONEWS
Примеры использования ChatGPT в SEO-стратегии
Гость
1
комментарий
0
читателей
Полный профиль
Гость - Если кто то хочет протестировать Cat GPT в SЕО проектах на базе нашего агенства, приглашаем наудалкнную работу Tg: @thegoodlink
'SEO глазами клиентов 2023'
Валерия Власова
2
комментария
0
читателей
Полный профиль
Валерия Власова - Приветствую! На момент проверки сайтов клиентов получились такие показатели. Возможно, самостоятельно вы проверяете свои проекты по другим параметрам. Поэтому получились разные результаты.
Эффективное продвижение сайтов: 10 лет опыта в SEO в Рунете и Буржунете
Павел Горбунов
11
комментариев
0
читателей
Полный профиль
Павел Горбунов - Вы учтите, что за такие водные статьи хейтеры повалят жесткие. Сеошники воды не любят.
Особенности внутренней перелинковки для крупных сайтов
Злобная булочка
1
комментарий
0
читателей
Полный профиль
Злобная булочка - Ну это ж ингейт)
Как онлайн-магазинам получать максимум трафика с помощью Поиска по товарам Яндекса
Гость из Тюмени
1
комментарий
0
читателей
Полный профиль
Гость из Тюмени - Производим пиломатериалы под заказ, от 1 до 14 дней. Яндекс постоянно банит наш яндекс фид по причине отсутствия товара на складе во время своих тайных проверок. Не возможно донести до модератора, что мы работаем под заказ, поэтому товара нет на складе, т.е. пришёл заказ - мы изготовили.
Rush Analytics обновил инструмент для анализа позиций
Rush Analytics
4
комментария
0
читателей
Полный профиль
Rush Analytics - Виктор, добрый день. Благодарим за Ваш отзыв. Мы проверим ситуацию по сбрасыванию дат при переключении вкладок.
Увеличили трафик в 4 раза с помощью узких ключей и контентного SEO: кейс ОТП Банка
Бурлуцкий Сергей
1
комментарий
0
читателей
Полный профиль
Бурлуцкий Сергей - В работе по ссылочному делаем упор по получению естественных ссылок в сочетании с краудом. Более подробно об этом мы рассказывали на нашем недавнем митапе - www.youtube.com/watch?v=dbl_vFHWqWQ (Второй доклад).
Что такое Яндекс Советник, и кому от него жить хорошо
Мама Стифлера
1
комментарий
0
читателей
Полный профиль
Мама Стифлера - Вызывает сожаление, что вы не осознаете, что Яндекс.Советник может быть рассмотрен как форма рэкета, которая заставляет компании, размещающиеся в Яндекс.Маркете, выплачивать дополнительные финансовые средства, повышая в конечном итоге прибыль Яндекс.Маркета, но не принесет пользы для посетителей сайта.
Как быстро улучшить рейтинг компании на сайтах отзовиков
Zorgy Rihard
2
комментария
0
читателей
Полный профиль
Zorgy Rihard - давай я
Самые быстрорастущие доменные зоны в 2023 году. Исследование RU-CENTER
Станислав
1
комментарий
0
читателей
Полный профиль
Станислав - С 2019 года количество доменов в зоне .ru остается на одном и том же уровне - около 5 млн. Все изменения на уровне 1% от этого объема в плюс или минус
ТОП КОММЕНТАТОРОВ
Комментариев
910
Комментариев
834
Комментариев
554
Комментариев
540
Комментариев
483
Комментариев
386
Комментариев
373
Комментариев
262
Комментариев
249
Комментариев
171
Комментариев
156
Комментариев
141
Комментариев
121
Комментариев
119
Комментариев
100
Комментариев
97
Комментариев
97
Комментариев
96
Комментариев
80
Комментариев
77
Комментариев
74
Комментариев
67
Комментариев
64
Комментариев
60
Комментариев
59

Отправьте отзыв!
Отправьте отзыв!