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

В этой статье мы ответим на самые популярные вопросы на тему UX/UI дизайна, расскажем, с чего начать обучение на профессию дизайнера, и с нами поделится опытом практикующий дизайнер Денис Линник из коллектива New Line Technologies. Устраивайся поудобнее, и добавляй страничку в закладки, чтобы не потерять важные инсайты 😉

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

Для начала давай разберём, что такое UX, а что такое UI, и в чём их отличие. 

UX («user experience») — опыт, который получает пользователь при взаимодействии с продуктом или услугой.

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

Ситуация в пример: надпись на входной двери в магазин “от себя” и “на себя”. Функции у двери две: вход и выход. UX-дизайнер решает, как правильно расположить и обозначить, предоставить верное руководство, сделает ее удобной высоты и ширины, чтобы легко и быстро открыть дверь, не перепутать, и не вызвать приступ раздражения.

* Фото Twitter @crazy_kutas

UI («user іnterface») — пользовательский интерфейс: кнопки, поля ввода и другие способы взаимодействия пользователя с IT-сервисом.

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

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

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

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

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

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

Задача дизайнера — создать интерфейс, понятный на интуитивном уровне, чтобы у пользователя не возникало вопросов «А как это сделать?» или «А где это находится?», и, в то же время, чтобы мог привести его к желаемому результату, будь то заказ пиццы на дом или установка будильника.

И никогда не забывай простое правило: «Хороший дизайн – это дизайн, который ты не замечаешь»!

Денис, что ты считаешь важным в дизайне интерфейса?

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

Стоит ли выделять бюджет и силы на дизайн интерфейса, так ли уж он важен?

Излишняя экономия на UX/UI в дальнейшем выливается в затраты на техподдержку, регулярное исправление багов, не говоря уже о подпорченном рейтинге продукта на рынке. Красивая обертка в виде современного дизайна – не есть человечный интерфейс; ключом к этой человечности служит проектирование под реального пользователя.

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

UX/UI дизайн: с чего начать, если нет опыта?

Тебе интересна тема разработки дизайна, но ты не знаешь, с чего начать изучение темы? 

Если ты в своё время не выбрал нужный факультет в университете, это не повод отчаиваться 😉 Профессию дизайнера можно освоить в любом возрасте, а опыт зависит от желания! В современном мире существует 2 способа освоить новую профессию: курсы и самообучение.

Курсы по UX-UI дизайну бывают офлайн и онлайн.

Офлайн-курсы.

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

Онлайн-курсы.

Можно проходить несколько курсов одновременно, в любое удобное время и в любом месте. Среди них много бесплатных. Возможный недостаток – нет обратной связи, и не всегда “есть у кого спросить”. К тому же риск бросить онлайн-курс, особенно бесплатный, выше по сравнению с офлайн-занятием, которое заплачено заранее.

Курсы не сделают из тебя дипломированного специалиста, которого сразу захотят принять на работу лучшие компании. Но такие занятия дают основные знания и вектор для дальнейшего развития. Цель любого обучения – освоить базовые знания и стать более “гибким” для адаптации к процессам. В каждой компании есть свои особенности, привычный ритм работы, и человек должен быть готовым к тому, что что-то в этом процессе будет отличаться от того, что он уже знает. Нужно уметь быстро подстраиваться.

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

Как и в любой профессии, ценен специалист, для которого его сфера деятельности не просто работа “по часам”, а образ жизни. 

Денис, можешь дать пару полезных советов начинающему UX/UI дизайнеру?

Я бы посоветовал больше обращать внимание на работы других дизайнеров. Это не обязательно должны быть шоты на Dribbble или кейсы на Behance, дизайн всегда окружает нас. Например, можно анализировать как дизайнер скомбинировал цвета на упаковке печенья или как работал с текстом на обложке журнала.

Как начать изучать UX/UI дизайн? Рекомендации.

Как и в любом деле, для начала стоит освоить теорию и практику.

Теория. Для начала изучите базовые понятия: что такое UX-дизайн, юзабилити и его принципы, UX-паттерны, гайдлайны и best practices. Пройдись по основам юзабилити-тестирования: что это, какие методы бывают, чем отличаются качественные от количественных и зачем они нужны. Подумай, что и для кого было бы интересно создавать: приложения, сайты, конкретные продукты, сервисы, для бизнеса (B2B) или конечных пользователей (B2С) и так далее.

Практика. Узнай, в чем отличие мокапа (mockup), структурной схемы (wireframe) и прототипа (prototype). Изучи, какие есть инструменты.

Рекомендации по программам и приложениям для UX/UI дизайнера.

Существует море направлений в дизайне и столько же инструментов. Хочется посоветовать, не зависимо от того, в каком приложении вы работаете, постараться выучить как можно больше функций вашего инструмента. Гораздо проще работать, когда ты знаешь весь функционал, тогда даже не появляется мысли «А как это сделать?». Я большую часть времени работаю в Figma и использую мобильное приложение Figma mirror как помощник, если проектирую мобильный интерфейс. Но иногда функционала Figma недостаточно, и приходится работать в Illustrator или Photoshop, поэтому советую ознакомиться с данными инструментами на базовом уровне. Из посмотреть/послушать, канал на YouTube – «Disarto», там есть много полезных роликов с объяснением базовых функций  инструмента Figma. Что касается теории, то я крайне советую оформить подписку на PRJCTR и смотреть/слушать всё, что есть во вкладке – «Interface design».

Во время обучения периодически просматривайте вакансии по UX/UI дизайну — они помогут сориентироваться, что требуют разные компании от дизайнера, и оценить, какие знания у тебя уже есть, а что нужно подтянуть. Учитывай, что вакансии на дизайнера называются по-разному: UX/UI designer, UX expert, Product designer, UX analyst, Lead designer, Strong UX designer, UX developer, UX architect, UX researcher, UX consultant. Просматривай их для расширения понимания областей ответственности.

Ну и наконец, не бойся проходить пробные собеседования! Законспектируй вопросы, которые задавали, не стесняйся задавать свои вопросы в ходе собеседования, чтобы понять реальные требования. 

Спасибо нашему коллеге Денису за участие!