Из графического дизайнера в UI/UX: полный гайд по переходу


07.10.2021 Время чтения - 9 минут 1099

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

При переходе в UI/UX или Product Design графические дизайнеры часто ссылаются на желание углубиться в свою работу. Желание создавать менее субъективный дизайн, а более подкрепленный данными и анализом поведений.

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

Зачем изучать UI/UX?

График роста продакт-дизайна

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

В индустрии дизайна и технологий рабочие места UI/UX связаны с дизайном продукта, а сама область UI/UX считается самой быстрорастущей. Отчет показал, что за последний год 70% менеджеров увеличили штат своих дизайнеров.

Что касается зарплаты UI/UX дизайнеров, по данным Invision 84% дизайнеров получили повышение за последние 1-2 года! По сравнению с зарплатой графического дизайнера, UX и продакт-дизайнеры имеют гораздо большее количество предложений. А с таким разнообразием рабочих мест, ролей и обязанностей по дизайну в этой сфере есть возможность сосредоточиться на областях, которые интересуют вас больше всего.

84% дизайнеров получили повышение зарплаты

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

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

Blue background with pink text showing 81% recruiter interest
81% дизайнеров получили обратную связь от рекрутера

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

Графический дизайн vs UI/UX

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

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

Возможно, вы уже достаточно опытны в использовании программного обеспечения для дизайна, вроде Adobe Photoshop и Illustrator, но не так гибки в Figma или Sketch. У вас может быть сильное чувство визуального баланса, белого пространства, иерархии типографики и цвета. Но вы можете столького не знать о компонентах, состояниях, атомарном дизайне, информационной архитектуре или пользовательских потоках.

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

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

Думайте в динамической графике вместо статической

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

Scroll carousel of coral and green graphic designs
Пример графического дизайна

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

Два темных мобильных экрана
Пример прототипирования

Вы должны думать о компонентах и ​​состояниях и задавать такие вопросы, как: 

  • Как должен выглядеть этот элемент, когда он выключен или включен?
  • Где разместить подпись?
  • Что делает система, когда компонент находится в выключенном состоянии по сравнению со включенным, и * что должен видеть пользователь, чтобы понять происходящее?
  • Как можно организовать надлежащую обратную связь по этому поводу, будь то изменение визуального состояния или обмен сообщениями?
  • К какой категории стоит отнести эту вещь?
  • Даже нужно ли использовать в этой ситуации переключатель или все-таки чекбокс?
  • Как лучше разместить или сгруппировать с другими этот элемент?
  • Какие существующие паттерны я могу позаимствовать?

Проанализируйте собственный опыт

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

  • Что в первую очередь побудило вас скачать или подписаться на продукт?
  • Что вы сделали сразу после того, как открыли его в первый раз?
  • О чем вы думаете, когда используете его?
  • Сколько времени вам понадобилось, чтобы понять, что делать дальше, прежде чем читать справочную документацию?
  • Что вам в нем нравится?
  • Удалось ли вам выполнить свою задачу?
  • Почему или почему нет?

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

Ищите совпадения и восполняйте пробелы в своих знаниях

Диаграмма Венна - оранжевый (дизайн), желтый (стратегия), фиолетовый (бизнес) навыки дизайна продукта
Диаграмма Венна навыков продакт-дизайна

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

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

Поймите реальность дизайна продукта

Редакция (графика) против итерации (продукт) - коралловый текст на синем фоне
Ревизия против итерации

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

«Важнее решить правильную проблему, чем правильно решить не ту», – Элизабет Алли.

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

People (UX) over Process (Business) - Coral text on blue bg
Люди важнее процесса (бизнеса)

Один из лучших способов сделать это – создать сквозной (end-to-end) цифровой продукт с нуля, принимая во внимание бизнес-цели и соответствующую продуктовую стратегию.

Получите больше опыта в нужных областях

Разноцветные круги с дизайнерскими этикетками дисциплины - на синем bg
Дисциплины дизайна

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

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

Постарайтесь изучить эти дисциплины дизайна:

  • Пользовательское исследование
  • Дизайн пользовательского опыта
  • Информационная архитектура
  • Дизайн пользовательского взаимодействия
  • Принципы юзабилити
  • Дизайн пользовательского интерфейса

Станьте узконаправленным

Coral bullseye on light blue bg
В яблочко

По мере того, как вы начинаете развивать свои навыки и приобретать опыт, также неплохо начать сужать фокус. Большинство начинающих UI/UX дизайнеров попадают в ловушку рекомендации себя как универсальных дизайнеров. «Я делаю логотипы, брендинг, графику и UI/UX». Однако иногда это может работать против вас, когда компании пытаются сопоставить ваш набор навыков со своими конкретными потребностями. Парадокс специфики гласит: «Чем конкретнее ваша цель, тем больше возможностей вы создадите для себя. Сузьте свой кругозор, чтобы расширить свой кругозор». Это не означает, что вам нужно полностью занять нишу и быть специалистом. Речь идет о передаче четкого фокуса и согласованности.

Продавайте рентабельность инвестиций, а не свои навыки

Рентабельность инвестиций важнее навыков - Coral texxt на голубом фоне
Рентабельность инвестиций важнее навыков

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

«Таким образом, задача состоит в том, чтобы превратить свои хобби, интересы и таланты в долгосрочную и устойчивую карьеру. Найти пересечение всего этого – ваша скрытая суперспособность. Задействуйте этот колодец силы, и вы будете парить так, как могли только мечтать», – Крис До.

Поэтому вместо того, чтобы говорить что-то вроде:

  • Хорошо разбираюсь в различных программах для дизайна
  • Представительный
  • Понимаю типографику и цвет
  • Умею хорошо писать и коммуницировать
  • У меня налаженный процесс, который я умею объяснять
  • Очень прилежный и готов учиться

Вы должны говорить что-то вроде:

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

Не просто показывайте свой процесс, а и рассказывайте о нем

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

Один из лучших способов создать убедительное тематическое исследование – дать ему мотив повествования. Вовлечь людей в процесс, а не просто показать шаги.

Это похоже на старую поговорку: «Не говори им, что ты смешной, рассмеши их».

Если вы хотите улучшить свое портфолио или создать будущие тематические исследования, один из лучших советов, которые я могу дать, – это вести рабочий дневник. Выделяйте всего 10 минут в конце каждого дня, чтобы записывать то, над чем вы сегодня работали. Кроме этого, записывайте мысли, чувства и идеи, которые у вас возникали по ходу работы. Как будто вы объясняете, как прошел ваш день близкому другу.

Когда будете готовы собрать или обновить портфолио, возьмите этот дневник, чтобы рассказать историю своего процесса и создать более естественное повествование. Портфолио почти всегда труднее делать в ретроспективе, так что приступайте к работе и задокументируйте ее заранее!

Одна из вещей, которые помогли мне упростить переход от графического дизайна к UI/UX, заключалась в следующем:

«Продакт и UI/UX дизайн – это не то, что вы могли бы сделать. Это о том, что вы должны делать. Существуют процессы, позволяющие понять это. Это не просто витание в облаках и чистые холсты», –Элизабет Алли.