Закладки дизайнера: детальное пособие для джунов (и не только) – в супергайде от CEO AffArts Игоря Фроловского. Часть II

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

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

Во второй части разберемся с UX/UI: здесь я рекомендую стоящие курсы, даю лайфхаки по составлению CV, общению с HR и поиску работы. И, конечно, читаю короткую мантру про то, почему нам всем необходимо развивать soft skills!

Курсы по UX/UI-дизайну: куда пойти учиться?

Что вообще по UX, CX, UI?

UX [user experience] и CX [customer experience]

UI [user interface]

Зачем нам, всё-таки, развивать soft skills?

Поиск работы: с чего начать, где искать и как не пасть духом?

Нетворкинг

Саммари

Сразу расставим все точки над i — я не сторонник Skillbox, Contented, «Нетологии» и прочих подобных образовательных платформ. Почему так?

Если нужна серьезная база, можно пойти в «Британку» (БВШД). Получишь как высшее, так и дополнительное образование — там все серьезно, но и спрос будет соответствующий. Так что взвесь все «за» и «против». Если тебе не нужны «корочки», не трать время зря и изучай контент самостоятельно, формируй траекторию обучения, ищи образовательные каналы и выстраивай свой путь в UX/UI.

Если все-таки ищешь школу, посмотри Bang Bang Education. Там преподают действующие эксперты из мира дизайна. Никакой воды и рассуждений о вечном — только полезный и применимый на практике контент. У нас в AffArts оформлена постоянная подписка — ребята пользуются и довольны, потому что всегда важно прокачивать скиллы и быть в теме, даже если ты в дизайне давно. Сегодня все меняется очень быстро и, если ты не развиваешься, есть риск покрыться паутиной.

Что еще? Сложно, но классно и эффективно учиться у Миши Розова — никакой пощады, но скилл прокачаешь знатно. Я работал с такими дизайнерами, как с джунами, так и с мидлами, — машины. Школа дизайнеров Бюро Горбунова — тоже отличные ребята с мощным экспертным составом и хорошей базой знаний. Скажу сразу, учиться нелегко — и в плане временных затрат, и в плане теории и практики, но для профессионального роста и прокачки скиллов — вариант отличный.

Фрилансеры-менторы

Как ты понимаешь, это пункт со звездочкой*, то есть нужно быть внимательным, чтобы избежать факапов. Очень важно (очень!) изучить человека, к которому ты идешь. Кто он и как давно в дизайне? Есть ли у него программа обучения? Какой у него релевантный вашему запросу опыт? Понимает ли он, как учить других людей? Какие есть отзывы от выпускников? Адекватна ли стоимость его услуг? Лучше всего сразу пообщаться с теми, кто закончил курс. Так ты минуешь лишние этапы на ресерч информации и сразу перейдешь к сути.

Возвращаясь к тому, с чего мы начали, — заголовки типа «Научу зарабатывать миллионы на дизайне» или «Научу дизайнить за 1 месяц» и другие кликбейты — сразу мимо. Ты потратишь деньги, время, нервы и не получишь пользы. А может и хуже — деформируешь мышление негативным опытом.

Менторство — непростая тема, потому что слишком много площадок, где есть риск попасть к непрофессионалу. От себя могу порекомендовать Duosapiens или Helper. В остальном — держи ухо востро, чтобы потом не пожалеть, что влил кучу денег в никуда.

UX [user experience] и CX [customer experience]

UX — опыт, возникающий у пользователя при взаимодействии с конкретным продуктом или услугой. CX — более широкое понятие, это общее впечатление, которое формируется при взаимодействии пользователя со всеми направлениями деятельности бренда, в том числе с представленными ей продуктами и услугами. В самом начале надо будет найти ответы на такие вопросы, как:

Где брать информацию? Во-первых, если ты еще не прочитал(-а) книгу Алана Купера — вернись и прочитай! Как я уже писал, это альма-матер дизайнера, так что не трать время, а сразу вбивай в гугл «Интерфейс. Основы проектирования взаимодействия» и начинай изучать.

Что еще посмотреть? Переходи на сайт Nielsen Norman Group, а лучше сразу закрепи ссылку в браузере, чтобы было под рукой 24/7. Это буквально твой путеводитель в мире пользовательского опыта. Там ты найдешь расширенные статьи по теме, исследования, курсы, короче, целая куча международной практики и образовательного контента. Затем изучи эвристики, всего их 10. Это общие принципы проектирования взаимодействия от Якоба Нильсена, основателя компании Nielsen Norman Group. Они называются «эвристическими», поскольку представляют собой широкие правила, а не конкретные рекомендации по юзабилити. Со временем ты поймешь, как их применять на практике.

Чтобы было понятнее, приведу пример — закон Хика. Этот закон отражает время, необходимое для принятия решения. Оно увеличивается с количеством и сложностью выбора. Мы ведь и правда не любим слишком долго выбирать, а потом уходить с чувством, что все-таки нужно было выбрать что-то другое? Часть рекомендаций, которые дает закон Хика:

Про интерфейсы и то, как они устроены, сначала читай Бирмана, а потом можно почитать Нира Эяля, преподавателя Стэнфордской школы бизнеса, который круто рассказывает про то, как создавать продукты, которые формируют привычки. Если книжки пока для тебя слишком сложно и долго, то вот рекомендации телеграм-каналов, например, этот и этот. Оба русскоязычные, так что проблем с восприятием не должно быть ни у кого.

Human Centered Design

Не забывай, для кого и для чего ты делаешь дизайн. Очень легко начать удовлетворять свои профессиональные цели, например, внедрять сложную инфографику или необычные шрифты, чтобы получилось круто, но всегда держи в голове вопрос, удобно ли будет конечному пользователю? Дизайн, ориентированный на человека, — это решения, которые ставят реальных людей в центр процесса. Только так можно создавать продукты и услуги, которые резонируют аудитории. Почитай об этом вот здесь, пожалуйста, и главное — не путай с User Centered Design. Чтобы лучше в этом разобраться, почитай вот здесь хорошую статью по теме.

Общие паттерны

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

Дарк паттерны

Тёмный паттерн, или dark patterns — по сути, это ловушка, когда пользовательский интерфейс заставляет вас делать то, чего обычно вы бы не сделали. Например, подписаться на рассылку или купить премиум-версию вместо бесплатной демо. Такие паттерны используют осознанно, чтобы заставить сбитого с толку человека ошибиться. Знать о них полезно, но применять — не нужно. Мы же не хотим навредить пользователю, да? Если тебе говорят, что в этом нет ничего плохого, не ведись.

Исследования и проектирование

Во-первых, научись отличать вайрфреймы, прототипы и мокапы. Об этом можно почитать здесь. Есть заказчики, которые скажут, что надо уметь строить CJM, JTBD. Забей и не обращай на это внимание. Даже дизайнеры с мощным опытом работы и классными проектами зачастую не умеют делать поведенческие исследования. Все, что нужно знать и уметь на ранних этапах работы, — проектировать на высокой детализации и делать карты сайтов. Достаточно понимать, как в целом может повести себя пользователь и какая у него конечная цель. То есть нужно понимать путь пользователя — последовательность шагов, которые он предпринимает для достижения цели.

Клиентский опыт

Один из самых частых вопросов, которые возникают у джунов, являются ли клиентский (CX) и пользовательский опыт (UX) одинаковыми? Ответ — и да, и нет одновременно. Самое понятное объяснение, в чем различие между CX и UX, конечно же, у NNGroup. Если кратко, клиентский опыт (Customer experience, CX) — это термин, который обычно используется для определения UX в течение длительного времени. Наши отношения с продуктом или брендом могут быть короткими и длительными, все прямо как у людей. Если это «короткая интрижка», то речь идет об уровне одного взаимодействия для выполнения конкретной задачи. Если все более серьезно, то мы переходим на уровень отношений, то есть связь между человеком и компанией на протяжении многих лет. Поэтому важно формировать положительный фидбек не только после первого взаимодействия, но и на протяжении времени укреплять связь, которая формируется с пользователем. По сути, выстраивать с ним отношения.

UX-writing

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

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

Что почитать, чтобы научиться хорошо писать? Например, классную книгу «Этой кнопке нужен текст». Или вот еще парочка книг, о которых ты, наверняка, уже слышал — «Пиши, сокращай» и «Ясно, понятно», также можно подписаться на канал Киры, которая работает в Ozon, руководит UX-редакторами и рассказывает много всего интересного.

Эстетический интеллект

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

Насмотренность

Продолжая тему с визуалом, отдельно акцентирую внимание на насмотренности. Можно быть экспертом в Figma, но абсолютно не понимать, что красиво, а что — нет. Чтобы не предлагать шаблонные решения, учись анализировать удачные работы и замечать красивое вокруг себя, банально, но это работает. Насмотренность — это не точка к которой ты придешь, когда побольше «насмотришься», это постоянный и непрерывный процесс. Если ты хочешь всю жизнь заниматься дизайном, то смирись с мыслью, что качать насмотренность нужно будет всегда.

Сейчас будет ряд полезных ресурсов, приготовься. Самое эффективное — смотреть реализованные кем-то проекты. Если ты делаешь мобайл, загляни в Mobbin. Для классного SaaS сайта и интерфейсов сервиса можно углубиться в SaaS App Design Inspiration и SaaS landing page examples. Давай не будем забывать про Awwwards, там есть контент на любой вкус и цвет. Если делаешь лендинги, есть классная коллекция тут.

Еще можно просто смотреть на красивые картинки, чтобы привыкать к хорошей композиции, цветовым сочетаниям и в целом уметь видеть прекрасное во всем. Если пользуешься *соцсетью с картинками*, то сформируй свою ленту так, чтобы она была визуально привлекательна и ее скроллинг приносил хоть какую-то пользу. А вообще красивые фотографии, графику или иллюстрации лучше смотреть не на Бехансах, Пинтерестах и Дриблах, а, например, на Arena или Dprofile. Кстати, вот тут можно найти самую подробную коллекцию айдентики, логотипов и брендинга. Подсмотрел у Юры Ветрова.

Гайдлайны для мобайла

Гайдлайны, по сути, набор правил, которые позволят сделать приложения максимально удобными для пользователей. Это что-то вроде списка рекомендованных параметров, благодаря которым людям комфортно взаимодействовать с мобильным интерфейсом. Чтобы создавать классный дизайн для приложений, которые будут залетать в топ и на которые будут равняться, изучи гайдлайны Apple — Human Interface Guidelines, не забудь про Android и Google Material 2 и Google Material 3. Вдогонку поделюсь еще одним сайтом — вот здесь (Mobile App Design Guidelines (2023)) вышли неплохие подробные рекомендации по гайдлайнам за 2023 год.

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

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

Короче, выучишь новые слова и получишь плюсы к карме. Мои рекомендации:

Понимаю, информации уже ту мач, но… я не договорил! В этом разделе хочу остановиться на последних рекомендациях. Изучай типографику, потому что работать с текстом и шрифтами на практике не так легко, как кажется, а испортить корявыми начертаниями классный дизайн можно очень легко. Помимо книг, про которые я писал выше, почитай эту статью и почитай вот тут, как можно и нельзя сочетать шрифтовые пары. Дальше — композиция и цвет. Для работы с цветом можно использовать Coolors и Color Hunt, разберись с контрастностью вот по этой ссылке. Чтобы освоить базу по композиции, можно начать с этого материала.

Дополнительные ресурсы, которые точно пригодятся в работе

Иконки можно брать тут и тут. На Streamline есть большая коллекция векторных иллюстраций — есть и платные, и бесплатные коллекции. Шрифты ты можешь найти здесь и здесь, и не забывай про Google Fonts. Чтобы экономить себе время, используй плагин. Мы собрали подборку из огромного количества плагинов Figma на своем сайте, ищи вот здесь.

Можно быть классным специалистом и делать свою работу качественно, с закрытыми глазами собирать и разбирать компоненты, предлагать крышесносные решения, но если ты не умеешь общаться, все «перестает работать». Опираясь на опыт, я понял, что коммуникация — это база, на которую ложатся все последующие хард скиллы. Неважно, кто ты, дизайнер, разработчик, менеджер, продажник, маркетолог, преподаватель — всегда развивай гибкие навыки и эмпатию. Тут, как завещали русские классики, можно завершить так: «Поэтом можешь ты не быть, но гражданином быть обязан!» (и ведь не поспоришь).

Как всегда, вот несколько полезных рекомендаций:

Поиск работы — всегда сложно. Причем сложно на всех уровнях: физическом, психологическом, финансовом. Некоторым везет, и они быстро находят работу, кто-то — ищет ее по полгода и не может найти. Почитай 6 мыслей про собеседование, а после зайди в комментарии и проникнись реальными историями, которые рассказывают ребята, включая истории о том, как они справляются с отказами (которых, кстати, никому не избежать), и что про это все думают HR, которые, согласно статистике, секунд 5 смотрят каждое резюме.

Если какой-никакой опыт есть, собирай портфолио и откликайся. Как это сделать, напишу ниже.

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

Про портфолио, фриланс и отклики

Если портфолио слабое и небольшое, загружай на «Дрибл» или «Беханс», но ни в коем случае не делай архивы с картинками или ссылки на облачные хранилища. Никто не будет это смотреть. Если портфолио классное, и ты хочешь его оформить в лучшем виде — используй Dprofile, а еще круче — собери свой сайт на Readymag, Webflow, Notion, там расскажи о себе и своем опыте, покажи несколько работ, которыми гордишься (лучше меньше, но качественнее). В качестве рекомендации лови большую подборку ноушенов от крутых дизайнеров, изучи их и лучшее забери себе. Если нечего показывать, придумай. Придумай задачу и реши ее.

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

Как откликаться?

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

Так, с последнего Design Prosmotr я нашел себе двух дизайнеров. Еще можно ездить на дизайн-выходные, а на G8 кроме общения можно и свою авторскую работу за $1 подать, вдруг повезет. Ежегодно Тинькофф проводит свою конфу, там классные спикеры и полезные знакомства. Короче, вариантов много, я перечислил лишь малую часть того, что можно найти.

Если говорить про профессиональные чаты, то можешь для начала вступить в эти:

Если ты прочитал обе части материала — поздравляю, ты реально крут(-а). Хочется подарить промокод или что там обычно дарят в такие моменты. Но я и так подарил тебе крутой бесплатный гайд! А если серьезно, то сейчас ты сделал(-а) свой первый большой шаг в UX/UI-дизайн, потому что в статье собрано все. Буквально. От момента, когда ты впервые задумываешься о UX/UI до каждого последующего шага твоего профессионального пути — написания CV, поиска работы, прокачки хард и софт скиллов, ресерча ресурсов для обучения, как платных, так и бесплатных, и нетворкинга.

Все, что здесь описано, — мой профессиональный путь и личный опыт, все источники, которыми я делюсь в статье, я сам изучал и на их основе строил карьеру. Начинал с фриланса, после — стартапы, был дизайнером, дизайн-лидом, одним из основных дизайн-подрядчиков компании e-legion, а еще руководил командами на таких проектах, как Burger King, Ситимобил, Теле2, Yota, внутренние продукты Сбера, «Тинькофф» и других больших компаний.

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

Обо всем, что происходит в мире UX/UI в целом и в AffArts в частности, пишу здесь —

Подписывайся, чтобы быть в теме и стать частью нетворкинга. Также буду рад, если поделишься своим опытом карьеры в UX/UI: можно не стесняться писать в личку в телеге (@ifrolovskiy) или оставить комментарий под статьей.

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