UX/UI-дизайн — это увлекательная и востребованная профессия, объединяющая креативность с пониманием пользователя. Начать с нуля может быть непросто, но с чётким планом и правильными инструментами вы сможете освоить эту область. В этой статье мы рассмотрим основные шаги, с которых стоит начать путь в UX/UI-дизайне.
Что такое UX/UI-дизайн
Перед тем как углубляться в детали, важно понять разницу между UX и UI:
- UX (User Experience) — это опыт взаимодействия пользователя с продуктом. UX-дизайн отвечает за то, чтобы продукт был интуитивно понятным, удобным и полезным.
- UI (User Interface) — это внешний вид интерфейса, который взаимодействует с пользователем. UI-дизайн отвечает за эстетику, размещение элементов и их восприятие.
Задача UX/UI-дизайнера — создавать решения, которые одновременно красивы и функциональны. И чтобы быть успешным в своем деле, специалисту потребуется глубокое понимание законов человеческого восприятия, а не только понимание того, как выглядит хороший дизайн
Теоретическая база
Начинать изучение любой профессии следует, как обычно, с теоретической подготовки. Если не будет крепкого фундамента, создавать дизайн вы скорее всего будете по наитию, а вся работа пойдет нерационально и бессистемно. Что катастрофическим образом скажется на результате.
1. Книги и ресурсы
Начните с чтения книг и статей, чтобы заложить фундамент знаний о UX/UI-дизайне:
- «Дизайн привычных вещей» Дональда Нормана — одна из основных книг по UX, рассказывающая, как люди взаимодействуют с объектами и интерфейсами.
- «Don’t Make Me Think» Стива Круга — книга о том, как создавать удобные и понятные интерфейсы, ориентированные на пользователя.
Кроме того, полезно изучать статьи на таких платформах, как Medium, UX Collective и Interaction Design Foundation, UX Movement, Nielsen Norman Group, которые освещают новые тренды и практические советы. Разумеется, для этого придется хорошенько подтянуть английский язык, так как большая часть специальной литературы по UX/UI-тематике пишется и издается за рубежом.
Впрочем, есть и хорошие русскоязычные источники. Можно выделить, к примеру:
- UX Journal — крупнейший ресурс в Рунете по тематике исследования пользовательского опыта;
- TG-канал UX Live с референсами и тематическими материалами;
- VC.ru — агрегатор новостей сферы IT, где регулярно встречаются тематические статьи по UX/UI;
- Deadsign — специализированный портал для дизайнеров с подборкой актуальных статей.
2. Когнитивная психология и UX
Изучение основ когнитивной психологии поможет вам понять, как люди воспринимают и обрабатывают информацию. Как уже было сказано, понимание принципов человеческого восприятия — ключевой элемент в создании интуитивно понятных интерфейсов. Этим вам предстоит заниматься практически 2/3 своего рабочего времени.
Поэтому, приступая к освоению UX/UI, первым делом стоит углубиться в изучение поведенческой психологии.
Здесь можем порекомендовать такие книги, как «Дизайн-мышление. Все инструменты в одной книге» Оливера Кемпкенса и «Придумай. Сделай. Сломай. Повтори» коллектива авторов из США. В этих книгах рассказывается, как именно должен думать дизайнер, чтобы проектировать красивые, удобные и функциональные интерфейсы
Принципы дизайна
Данный кластер тоже можно отнести к теоретическим, однако, он имеет более прикладное значение — рассказывает, какие именно приемы работают при создании визуального облика будущего приложения.
1. Визуальные принципы
UX/UI-дизайн основывается на базовых принципах визуального дизайна. Чтобы создавать эстетичные интерфейсы, нужно овладеть следующими основами:
- Контраст — помогает выделять ключевые элементы на экране.
- Выравнивание — создает порядок и аккуратность в расположении элементов.
- Повторение — помогает поддерживать единый стиль интерфейса.
- Близость — упрощает восприятие группирования элементов.
2. Цвет и типографика
Цветовая палитра и типографика играют важную роль в создании визуального стиля продукта. Изучите основы цветовой теории, а также методы подбора шрифтов, чтобы интерфейс выглядел гармонично и легко воспринимался.
Инструменты для дизайна
Базовый софт для дизайнера советуют изучать практически с первых дней: чем раньше вы их начнете осваивать — тем лучше для практики. Здесь все, как с ездой на машине. Можно изучать устройство узлов и агрегатов, знать на зубок ПДД, идеально разбираться в марках и моделях, как надо трогаться с места и т.п. Но если ни разу не садиться за руль и не практиковаться, водителя из вас не получится.
1. UI-инструменты
Итак, чтобы научиться делать качественный UI, потребуются:
- Figma — облачный инструмент для совместного дизайна, используемый для создания интерфейсов и прототипов.
- Adobe XD — инструмент от Adobe для создания интерактивных прототипов и макетов.
- Sketch — программа для дизайна интерфейсов, популярная среди дизайнеров Mac.
Изучите основы работы с этими инструментами, так как они станут вашими основными помощниками в процессе создания дизайна.
2. Прототипирование и пользовательские интерфейсы
Научитесь создавать интерактивные прототипы. Это важный навык, который позволяет тестировать свои идеи и демонстрировать заказчикам внутреннюю логику приложения.
В качестве инструмента прототипирования можно использовать ту же Figma, однако, есть и более продвинутые системы, такие как InVision, где можно создавать наглядные презентации и логику работы.
3. UX-инструменты
Для исследования пользовательского опыта применяются всевозможные метрики и инструменты аналитики. Начать изучение стоит с Google Analytics — его используют повсеместно, когда речь заходит о проектировании веб-приложений.
Также стоит освоить Hotjar — популярный инструмент для анализа поведения пользователей с помощью тепловых карт (heatmaps), записи сессий, опросов и воронок конверсий. Позволяет понять, как пользователи взаимодействуют с сайтом.
Ещё можно изучить SurveyMonkey — популярный инструмент для создания и проведения опросов, который можно использовать для сбора данных о восприятии продукта пользователями.
Участие в профессиональных сообществах
Не стоит говорить, что любой специалист повышает свою ценность, когда связан с профессиональным коммьюнити и может учиться у лучших. Начать изучение UX/UI-дизайна с вливания в тусовку — полезный шаг. Но только в том случае, если вы уже что-то знаете, изучили и умеете.
1. Портфолио на площадках фрилансеров
Участие в таких платформах, как Behance, Dribbble, портфолио с работами, а также участие в конкурсах и хакатонах помогут вам учиться у опытных дизайнеров и находить вдохновение.
Кроме того, такие мероприятия — весьма полезный способ найти первых заказчиков или стажировку.
2. Блоги и подкасты
Подпишитесь на блоги и подкасты, посвящённые UX/UI-дизайну. Это позволит вам оставаться в курсе последних трендов и узнавать о новых подходах и инструментах.
3. Наставничество
Наиболее сложный, но при этом самый эффективный способ изучать UX/UI-дизайн — это найти себе ментора. Однако важно понимать, что прийти к нему стоит уже с некоторым бэкграундом. С совсем уж нулевым учеником вряд ли кто-то захочет связываться. Поэтому по меньшей мере стоит освоить базу и сделать пару-тройку учебных проектов. Так вы покажете наставнику свою готовность учиться, развиваться в профессии и впитывать информацию.
Искать менторов можно двумя способами:
- Знакомые — весьма здорово, если в наставники пойдет кто-нибудь из родных или хотя бы просто знакомых;
- Сообщества — вполне возможно, шефство над вами может взять опытный дизайнер с того же Behance. Например, если он будет делать какой-то масштабный проект, в котором не обойтись без помощников.
Ещё бывают специализированные сайты, ТГ-каналы и онлайн-курсы, где эксперты в UX/UI специально ищут учеников — встречаются они не так уж редко, нужно только поискать.
Развитие насмотренности
Ну и, наконец, не стоит забывать о том, чтобы нужно постоянно изучать чужой дизайн, анализировать его и сравнивать с лучшими образцами. Делать это также можно несколькими способами:
- Анализировать реальные программные продукты (веб, мобильные приложения);
- Изучать чужие проекты на Behance;
- Смотреть Youtube-разборы, ревью портфолио и подкасты на каналах опытных дизайнеров;
- Искать подборки свежих примеров дизайна на специализированных сайтах, таких как Awwwards, Pinterest, One Page Love и других.
В целом, визуальное вдохновение можно черпать откуда угодно — нас буквально окружают примеры удачного или неудачного дизайна. Главное, как вы примените их в своей практике. Здесь вам поможет несколько рекомендаций:
- Ищите красоту в нетипичных местах или предметах, природе, урбанизированном пространстве, предметах интерьера, визуальном оформлении;
- Старайтесь изучать примеры плохого дизайна;
- Стремитесь повторить чужие референсы, которые находите наиболее удачными;
- Изучая приложения, сайты или графику, всегда обращайте внимание на удобство и выбивающиеся детали;
- Всегда анализируйте, как можно улучшить плохой дизайн (на примере неудачных сайтов или приложений);
- Систематически повторяйте изучение чужих работ, будь то дизайн, графика, фотография, анимация и т.п.
