Содержание статьи
Когда вы открываете приложение и за секунду понимаете, куда нажать, за этим стоит работа двух специалистов сразу: того, кто продумал логику, и того, кто нарисовал экран. Первую половину закрывает UX, вторую UI. Разберу, чем они отличаются, кому это пригодится и как войти в профессию, если вы начинаете с нуля.
Что скрывается за буквами UX и UI
UX расшифровывается как user experience, то есть опыт пользователя. Это про то, как человек проходит путь внутри продукта: находит нужную кнопку, оформляет заказ, регистрируется без раздражения. UI, user interface, отвечает за внешний слой: цвета, шрифты, отступы, иконки, состояния кнопок. Одно без другого работает плохо. Красивый экран, по которому непонятно, как двигаться, бесит не меньше, чем удобная логика в сером неряшливом оформлении.
Проще всего представить дом. UX это планировка: где кухня, как пройти в спальню, удобно ли открывается дверь. UI это отделка: обои, свет, ручки на дверях. Жить хочется там, где и планировка продумана, и глазу приятно. С цифровыми продуктами ровно так же.
Хороший дизайн интерфейсов напрямую бьёт по деньгам бизнеса. Удобный экран повышает шанс, что человек дойдёт до оплаты и вернётся снова. Запутанный отпугивает даже при отличном товаре. Поэтому компании готовы платить тем, кто умеет делать понятно и аккуратно.
Ещё один частый вопрос новичка: чем UX отличается от юзабилити и веб дизайна, о которых тоже все говорят. Юзабилити это узкая штука внутри UX, про то, насколько интерфейсом легко пользоваться. Дизайн сайтов ближе к визуалу конкретной страницы. UX шире всех: он держит в голове весь путь человека, от первого клика в рекламе до повторной покупки через месяц. Держите эту иерархию в голове, чтобы не путать понятия на собеседовании.
Кому эта профессия реально подходит
Круг людей, которым пригодится дизайн интерфейсов, шире, чем кажется. Очевидно, это будущие дизайнеры. Но базовое понимание UX выручает и разработчиков: они перестают спорить с макетами и начинают понимать логику экранов. Маркетологу это помогает собирать посадочные страницы, которые продают. Предпринимателю, который запускает свой сервис, экономит бюджет на переделках.
Отдельно скажу про тех, кто меняет сферу. В эту профессию приходят из смежных областей и вообще из далёких: бывшие бухгалтеры, педагоги, менеджеры. Порог входа ниже, чем в программировании, а спрос на рынке стабильный. Если вам нравится наводить порядок, замечать неудобства вокруг и думать про людей, вам сюда.
Даже если карьера дизайнера вам не нужна, азы всё равно полезны. Вы начнёте лучше объяснять задачи подрядчикам, точнее формулировать, что не так с сайтом, и перестанете принимать слабые решения за норму.
Два взгляда на работу дизайнера
Внутри профессии есть разные подходы к тому, как принимать решения. Стоит разобраться в двух основных, потому что дальше вы будете выбирать между ними на каждом проекте.
Дизайн вокруг пользователя
Первый подход строится вокруг человека. На английском его называют user centered design, сокращённо UCD. Суть в том, что вы изучаете тех, для кого делаете продукт, ещё до первой линии на макете. Проводите интервью, наблюдаете, задаёте вопросы, а уже потом рисуете. Так вы попадаете в реальные потребности, а не в свои догадки о них.
Минус очевиден: это долго и стоит денег. Интервью, тесты, обработка ответов забирают время. Зато вы резко снижаете риск сделать красиво, но мимо цели.
Опора на цифры
Второй подход опирается на данные. Вы смотрите, как люди уже ведут себя внутри продукта: где кликают, где бросают корзину, на каком шаге уходят. Дальше принимаете решения по этим цифрам и проверяете гипотезы тестами, сравнивая варианты экрана между собой.
Такой путь быстрее и дешевле, но у него своя слабость. Цифры показывают, что происходит, но молчат про причину. Человек ушёл с шага оплаты, а почему, из отчёта не видно. Тут снова выручает разговор с живыми людьми.
Как выбрать между подходами
На практике никто не держится за один метод намертво. Выбор зависит от задачи, аудитории и того, сколько у вас времени и денег.
Если продукт новый и вы плохо знаете свою аудиторию, начните с исследований вокруг пользователя. Догадки на старте дорого обходятся: переделывать готовый интерфейс тяжелее, чем поговорить с людьми заранее. Если продукт уже работает и на нём есть трафик, опирайтесь на данные. У вас на руках готовая картина поведения, грех ей не воспользоваться.
Чаще всего два подхода идут в связке. Цифры показывают, где болит, а разговоры объясняют, почему. Хороший дизайнер переключается между ними свободно, а не молится на один любимый метод.
Приведу пример из жизни продукта. Аналитика показала, что люди массово бросают регистрацию на втором шаге. Голые цифры говорят «тут проблема», но не говорят какая. Дизайнер сажает пять человек за экран и просит зарегистрироваться вслух. Оказывается, форма требовала номер паспорта, а зачем, непонятно, и люди пугались. Данные нашли место, разговор нашёл причину. Вот так эти два подхода и работают вместе на практике.
Пошаговый план входа в профессию
Теперь к самому нужному: как начать с нуля и не бросить через месяц. Вот маршрут, который работает.
- Соберите базу. Разберитесь, что такое UX и UI, изучите основы композиции, работы с цветом и шрифтами. На старте хватит бесплатных материалов и пары толковых книг.
- Освойте инструмент. Возьмите Figma, сегодня это стандарт в профессии. Sketch и Adobe XD тоже встречаются, но новичку удобнее стартовать с Figma: она бесплатная и работает прямо в браузере.
- Рисуйте руками. Теория без практики выветривается за неделю. Перерисуйте пару экранов знакомого приложения, соберите свой первый простой макет. Пусть кривой, зато ваш.
- Собирайте обратную связь. Показывайте работы другим дизайнерам, слушайте разбор. Свежий взгляд ловит то, что вы уже не замечаете.
- Соберите портфолио. Три или четыре сильные работы значат больше десятка слабых. Именно портфолио, а не диплом, решает на собеседовании.
Двигайтесь по порядку и не перепрыгивайте через ступени. Частая ошибка новичка: сразу лезть в сложные инструменты, пропустив основы композиции. Потом такой макет выглядит богато по эффектам и беспомощно по сути.
Отдельно про инструмент. Не пытайтесь выучить сразу всё, что умеет Figma. На старте вам хватит рамок под экраны, работы с текстом, заливки, выравнивания и простых компонентов. Остальное подтянется само, по мере задач. Гнаться за каждой кнопкой редактора бессмысленно, вы утонете в возможностях и забросите практику. Гораздо полезнее собрать один экран целиком, чем прочитать про сорок функций и не открыть ни одну.
Про портфолио стоит сказать подробнее, потому что новичков тут заносит. Не выкладывайте всё подряд. Соберите работы, за которые не стыдно, и к каждой добавьте короткий рассказ: какая была задача, что вы решали, почему сделали именно так. Работодатель смотрит на ход вашей мысли, а красивая картинка без объяснения его не убеждает. Учебный проект с внятным разбором ценится выше эффектной пустышки без слов.
Ошибки, на которых спотыкаются почти все
Первая и самая дорогая: делать интерфейс под себя, а не под пользователя. Вам понятно, где кнопка, потому что вы её рисовали. Живой человек видит экран впервые. Проверяйте догадки на реальных людях, а не на своём вкусе.
Вторая: пропускать тесты. Дизайнер собрал экран, залил в продукт и удивляется, почему люди не находят нужное. Дайте макет паре человек со стороны до запуска, и половина проблем всплывёт сразу.
Третья: усложнять. Новичка тянет добавить побольше: тени, градиенты, анимации, редкие иконки. В итоге экран давит и путает. Простота и понятность почти всегда выигрывают у богатого оформления. Если элемент не помогает пользователю, он лишний.
Четвёртая: забивать на доступность. Бледный серый текст на белом фоне читается тяжело, а людям со слабым зрением просто недоступен. Держите достаточный контраст и не заставляйте человека щуриться.
Пятая, тихая, но частая: гнаться за трендами вслепую. Увидели модный приём в чужом приложении и тащите к себе, не спросив, решает ли он задачу вашего пользователя. Тренд ради тренда старит макет через полгода и путает людей, которые пришли за конкретным делом. Сначала польза, мода потом.
Привычки, которые ускоряют рост
Слушайте тех, для кого делаете продукт. Отзывы, вопросы в поддержку, записи того, как люди пользуются экраном, дают больше любой теории. Дизайн живёт для пользователя, а не для строчки в вашем портфолио.
Смотрите по сторонам. Разбирайте удачные приложения и сайты: почему тут удобно, за счёт чего экран не раздражает. Насмотренность копится незаметно, а потом сама подсказывает решения.
Учитесь постоянно. Инструменты и тренды в профессии меняются, вчерашний приём сегодня выглядит устаревшим. Отведите пару часов в неделю на новое, и через полгода вы заметно вырастете.
Прокачивайте не только руки, но и умение объяснять. Дизайнер постоянно защищает свои решения перед заказчиком и командой. Если вы можете внятно сказать, почему кнопка стоит именно тут и почему форма короткая, вам верят и берут в работу ваши макеты. Если только пожимаете плечами и говорите «так красивее», решения режут, а вас правят. Учитесь аргументировать не вкусом, а пользой для человека по ту сторону экрана.
Как вариант, курс по UX/UI дизайну: там всё разложено по шагам, с практикой и обратной связью.
Частые вопросы
Обязательно ли уметь рисовать?
Нет. Дизайн интерфейсов ближе к логике и структуре, чем к художественному рисунку. Вы работаете с готовыми элементами: прямоугольниками, текстом, иконками. Чувство композиции важнее умения рисовать от руки, а его можно натренировать.
Сколько времени занимает старт с нуля?
Собрать базу и первое портфолио реально за несколько месяцев плотной практики. Скорость зависит от того, сколько часов в неделю вы вкладываете и есть ли рядом человек, который разбирает ваши работы. Регулярность решает больше, чем врождённый талант.
UX и UI это одна профессия или две разные?
На старте чаще всего их совмещают в одной роли, и вакансии так и называют: дизайнер интерфейсов. В крупных командах роли иногда делят: один отвечает за логику и исследования, другой за визуал. Новичку полезно понимать обе стороны, а специализацию выбрать позже.
Нужен ли диплом, чтобы взяли на работу?
Работодатель смотрит на портфолио и умение решать задачи, а не на корочку. Сильные работы и понятный разбор своих решений на собеседовании весят больше формального документа.
