кто такой UX/UI дизайнер?

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

Чтобы определить, чем именно занимается UX/UI дизайнер, важно разделить понятия UX и UI:

UX (user experience)

Это пользовательский опыт — всё, что связано с исследованиями «болей» пользователей, анализом и планированием на основе всех этих данных структуры продукта.
UX-дизайнер анализирует пользовательский путь и продумывает структуру продукта.

UI (user interface)

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

Эти направления тесно связаны друг с другом, одно без другого не может эффективно существовать. Если создавать, например, сайт только ради красивого интерфейса — результата (лидов, продаж) не будет. А если сделать на сайте жёлтую плашку с нечитаемым белым текстом — испортится пользовательский опыт.

Поэтому отдельные UX- и UI-дизайнеры встречаются реже. Чаще это один человек.

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

Операционные задачи могут меняться в зависимости от компании, но чаще всего это:

Исследование аудитории, проведение пользовательских интервью (CustDev), составление портрета пользователя;
Анализ конкурентов;
Составление карты пути пользователя (CJM), а на её основе — определение структуры продукта;
Проектирование сценариев использования;
Создание интерфейсов: сначала чёрно-белые вайрфреймы, затем цветные макеты и в конце — интерактивные прототипы;
Участие или даже самостоятельное проведение тестирования прототипов — на широкой аудитории и фокус-группах. Доработка прототипов на основе обратной связи;
Работа с визуальным стилем продукта: цвета, стиль кнопок, графика, анимация, типография, инфографика, виджеты, поведение, отклики кнопок и так далее;
Передача этих прототипов команде разработки, согласование их;
Поддержка и развитие продукта, инициация улучшений и работа с ними по алгоритму, описанному выше.

Стек UX/UI дизайнера

Figma

Самый популярный сейчас сервис для разработки прототипов и тестирования, который подходит для командной работы.
Есть ещё подобные программы Adobe XD и Sketch, но ими пользуются всё реже.

Adobe Creative Cloud

Это достаточно большой пакет графических редакторов с разными функциями. Знать его целиком, конечно, круто. Но начинающему UX/UI дизайнеру достаточно изучить Adobe Photoshop — это редактор изображений, которые состоят из пикселей (растровые). Он пригодится для цветокоррекции картинок или вырезания объектов с фона, например.
Что можно изучить потом:
Adobe After Effects — редактор видео и анимации;
Adobe Illustrator — редактор векторных изображений.

Miro, Notion, Whimsical

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

Tilda, Readymag и Webflow

No-code инструменты, конструкторы для быстрого создания сайтов

T-shaped специалист

UX/UI дизайнер — пример T-shaped специалиста

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

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

Для такого дизайнера также очень важно понимание продукта и глубокое погружение в него. Работая в QIWI, вы будете не просто работать по ТЗ, а полноценно влиять на итоговый результат.

Куда расти

В любой профессии можно развиваться вертикально и горизонтально. Давайте посмотрим, куда расти UX/UI дизайнеру:

вертикальный рост

Здесь можно выделить 4 возможных ступени. Время перехода зависит от вашего опыта и кадровой политики компании.

Опыт работы: без практического опыта

Здесь вы находитесь, если только смотрите в сторону профессии дизайнера или пока проходите обучение, но ещё не сталкивались с реальными практическими задачами.

Как идти дальше

Самый простой способ перейти на следующий уровень — пройти стажировку. Многие ИТ-компании регулярно набирают к себе студентов и выпускников, чтобы «вырастить» крутых специалистов.
Второй вариант — работать над личным pet-проектом, который можно будет добавить в портфолио.

Опыт работы: ≈1 года

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

Владение основными инструментами (Figma)
Знание основ композиции, типографики, UI-визуализации, гайдлайны Material Design и iOS, и умение применять их на практике
Насмотренность
Базовое понимание, что вообще такое UX-исследования и путь пользователя

Пример задачи

Адаптировать экран веб-версии приложения под мобильную версию.

Как идти дальше

Оставаться в курсе трендов UX/UI, «набивать руку» на реальных задачах, приумножать знания и плотно работать в связке с наставником.

Опыт работы: ≈3 года

Мидл — самостоятельный специалист, который погружен погружён в процессы и исследования, и прототипирования, и тестирования. Чего ждут от специалиста на этом уровне:

Анализ аудитории и конкурентов
Владение аналитическими навыками и умение интерпретировать результаты исследований
Знание методик анализа бизнес-задач (например, JTBD)
Проектирование интерфейсов с нуля
Тестирование прототипов и их доработка

Пример задачи

Спроектировать интерфейс нового экрана в приложении.

Как идти дальше

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

Опыт работы: ≈5+ года

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

Создание информационной архитектуры продуктов
Создание дизайн-системы
Ревью работы «младших» коллег

Пример задачи

Разработать визуальную концепцию нового приложения.

А что дальше?

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

Design Lead

Лидом, который отвечает за конкретную дизайн-команду в компании.

Head of Design

Лидом, который отвечает сразу за все дизайн-процессы.

Арт-директором

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

Горизонтальный рост

UX-исследователь

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

Продакт-менеджер

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

Тестировщик

Последний этап дизайна интерфейса — его тестирование. Если вам по душе этот процесс, можно погрузиться в него.

Разработчик

Проще будет уйти в Frontend или No-code, потому что дизайнер уже передаёт макеты в вёрстку и делает интерактивные прототипы.

Маркетолог

Анализ конкурентов и потребителей — супер важные навыки и в маркетингеа. Это фора для старта дизайнеру.

Скиллы

Харды для джуна

Свободное владение инструментами: Figma, Adobe CC
Владение основами типографики и композиции
Насмотренность, знание трендов дизайна
Понимание процесса прототипирования, в идеале — опыт прохождения этого процесса на учебных проектах
Отрисовка UI-элементов, иллюстраций, иконок
Знание гайдлайнов Material Design и iOSHuman Interface Guidelines
Способность генерировать и визуализировать интерфейсные решения
Понимание принципов usability и адаптивности веб-интерфейсов
Понимание UX-копирайтинга
Умение пользоваться инструментами Story Map, Customer Journey Map, User Story
Базовое понимание технологий frontend-разработки
Знание основ UX-исследований и аналитические навыки

Софты для джуна

Эмпатия

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

Креативность

Пожалуй, дизайн — самая креативная сфера в ИТ. Нужно уметь придумывать уникальные решения проблем пользователей, которые помогут выделиться на фоне конкурентов и повысить эффективность продукта.

Работа в команде

Базовый навык. Дизайнеру нужно будет много общаться с коллегами-разработчиками, тестировщиками, менеджерами.

Коммуникабельность

Дизайнер общается не только с командой, но и с пользователями — зачастую совсем с незнакомыми людьми. И тут важно найти общий язык и расположить к себе.

Словарик терминов

CJM (Customer Journey Map)

Карта пути клиента, который он проходит в продукте. Позволяет понять трудности, с которыми сейчас сталкивается пользователь.

JTBD (Jobs to be Done)

Краткая формулировка о намерении пользователя с учетом его контекста/мотивации, которая позволяет определить функционал продукта.

CustDev (Customer Development)

Процесс получения инсайтов от пользователей для создания, проверки и оптимизации идей развития продукта с помощью интервью.

User Story (пользовательская история)

Короткая формулировка намерения пользователя с учетом его роли, которая позволяет определить функционал продукта.

User Story Mapping (карта пользовательских историй)

Инструмент, позволяющий спроектировать по шагам действия пользователя в продукте на основе его реального сценария.

CTA (Call-To-Action)

Элемент интерфейса, который мотивирует пользователя к действиям. Например, на странице товара вы можете увидеть большую кнопку с надписью «КУПИТЬ» — это и есть призыв к действию.

Material Design

Дизайн-система, которая была создана Google, для создания интерфейсов под Android

Адаптивность

Способность сайта «подстраиваться» под различные технические условия, к любому размеру экрана (компьютер, планшет, телефон), обеспечивая удобство для пользователей.

Plugins (плагины)

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

Usability (Юзабилити)

Уровень удобства использования сайта для его посетителей. Большую роль для юзабилити играет навигация на сайте.

Вайрфрейм

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

Макет

Статичная отрисованная страница или экран, готовый к передаче в разработку.

Прототип

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

Дизайн-система

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

Компоненты

Многократно используемые части пользовательского интерфейса

Информационная архитектура

Организация информации, наименования, навигация и поиск на сайте или в приложении

Плюсы и минусы работы

плюсы

Востребованность
Высокая оплата
Удалённая работа и выгодные условия от компаний (необходимая техника как минимум)

минусы

Высокая конкуренция на старте после обучения
Широкий спектр сфер, в которых нужно разобраться
Приходится часто сталкиваться с критикой от пользователей, нужно уметь не воспринимать её на личный счёт

Вам здорово подойдёт профессия, если

У вас одинаково развиты аналитические способности и креативность
Несмотря на развитую креативность и творческую составляющую, вы не боитесь рутинных задач. А такие будут и в работе дизайнера (например, сделать большое количество адаптивов или иконок)
Вы любите людей, общаться с ними, разбираться в их проблемах и делать их жизнь удобнее и понятнее
Постоянно изменяющиеся условия и необходимость постоянно учиться новому для вас скорее плюс, чем минус