Прежде чем перейти к статье, хочу вам представить, экономическую онлайн игру Brave Knights, в которой вы можете играть и зарабатывать. Регистируйтесь, играйте и зарабатывайте!
Начну с небольшой предыстории и представлюсь. Меня зовут Паша, за моими плечами более 9 лет опыта в проектировании интерфейсов. Я работал в разных дизайн-студиях, стартапах и банках, сейчас я являюсь главным дизайнером технологической платформы OpsNext в Группе «Иннотех».
Платформа распределяет задания на внутренних сотрудников банка с учётом их навыков, часового пояса и загруженности. Также она собирает и предоставляет руководителям полную отчётность по разбору всех имеющихся заданий, которые поступают на сотрудников. За время разработки платформы мы перестали быть маленьким стартапом и стали полноценным целевым проектом банка, в который интегрируются продукты других команд из разных подразделений по работе с юридическими лицами, физическими лицами, а также госструктурами.
Опираясь на весь свой опыт, поделюсь советами и наставлениями по развитию компетенций дизайнера, которые я бы дал самому себе, когда я был начинающим дизайнером. Таких советов я насчитал 12 штук, все они помогли бы мне развиваться гораздо быстрее, а многим начинающим дизайнерам, надеюсь, помогут прямо сейчас. Приступим!
Совет №1. Делай много различных вариантов дизайна
Первое твоё дизайн-решение будет плохим. Научись работать над количеством, а не над качеством. Заставь себя придумывать много дизайн-решений, которые будут отличаться. Установи планку для себя в 8–10 дизайн-решений, которые будут отличатся друг от друга. Не бойся экспериментировать. Тут твоя главная задача — научится придумывать различные виды дизайн-решений, когда решаешь поставленную задачу. А потом их можно показать своему ментору или старшему дизайнеру для валидации предложений, он как раз подскажет, какие лучше, а какие хуже и почему.
Если же ты работаешь один, как фрилансер, то старайся выписывать плюсы и минусы каждого решения, чтобы понять, насколько хорошее дизайн-решение ты придумал, отвечает ли оно всем требованиям, которым оно должно соответствовать, и решает ли поставленные задачи.
Помни, главное, что опыт и абстрактное мышление придут со временем, а пока у тебя нет опыта, ты можешь только пробовать различные способы отображения и компоновать информацию, объекты на странице. При этом тебе необходимо пользоваться интернетом и анализировать схожие и не только дизайны других опытных дизайнеров. Для этого найди и посещай сайты и группы, где дизайнеры публикуют свои работы. Пробуй анализировать работы других дизайнеров, задавай себе вопрос: «Почему тот или иной дизайнер сделал именно так, а не по-другому?»
Совет №2. Знай свой инструмент
Существует огромное количество программ для проектирования интерфейсов. Если покопаться в интернете, то их можно найти на любой вкус и цвет. Я бы разделил список приложений на три типа:
Популярные
Sketch
Figma
Непопулярные
Adobe XD
Affinity Designer
Blocs Website Builder
Framer X
Pixso
WebFlow
Старые или наоборот только появляющиеся
Все новые приложения, которые выпущены недавно и не набрали какую-либо достаточную аудиторию. Такие приложения можно найти на сайте https://www.producthunt.com
Adobe Illustrator (Часто использовали в 2010-2015 годах)
Adobe Photoshop (Часто использовали в 2010-2015 годах)
Все перечисленные мной приложения — лишь инструменты, которые должен знать дизайнер и постоянно совершенствоваться в одном или нескольких из них. У каждого инструмента есть как плюсы, так и минусы, которые нужно применять в определённых местах для решения поставленной задачи. В идеале нужно знать и применять как можно больше инструментов.
Приведу пример. Дизайнер проектирует интерфейс в приложении Figma, но при этом он рисует все иллюстрации и иконки в Adobe Illustrator. Почему так выходит? Всё банально — из-за возможностей, которые предоставляет Adobe Illustrator для рисования иконок и иллюстраций. В Figma тоже можно рисовать иконки и иллюстрации, но если говорить о профессиональной области, где необходимо рисовать сложные иконки или иллюстрации, то там важным параметром при выборе инструмента является время.
Каждый дизайнер должен максимально оптимизировать свою работу и не тратить большое количество времени впустую. Для этого как раз и нужно знать много различных инструментов, знать их плюсы и минусы, особенности, возможности, а также уметь их применять под конкретную задачу, чтобы не терять драгоценное время для реализации своей идеи.
Совет №3. Развивай умение гуглить
Умение находить информацию в интернете — одно из важнейших умений дизайнера. В интернете можно найти огромное количество информации, которая поможет дизайнеру улучшить свои навыки.
По моему опыту, если начинающему дизайнеру дать сразу какую-то подборку книг или статей для дизайна, он благополучно всё забудет и не будет их открывать. А если дизайнер сам будет искать и собирать полезные материалы, то шанс того, что он прочитает, вникнет и поймёт текст, многократно увеличивается. Если дизайнер ещё и будет самостоятельно собирать и агрегировать все найденные материалы, это будет самым лучшим решением для улучшения дизайнерских навыков.
Такой подход помогает лучше фильтровать всю найденную информацию, чтобы в голове оставалась действительно важная информация, а всё лишнее откидывалось.
Этот подход подойдёт не только для информации, а также для вдохновения т. к. дизайнеру нужно будет тренировать свою насмотренность, просматривать большое количество сайтов, оценивать их и фиксировать основные фишки или идеи, чтобы можно было их применить в своих будущих проектах.
Какими сервисами я пользовался, чтобы хранить ссылки на сайты, когда формировал свою базу:
https://getpocket.com
https://trello.com
https://www.pinterest.com
https://evernote.com
https://muz.li
Последнее — очень удобное расширение для браузера, в нём можно настроить себе ленту для вдохновения из огромного списка сервисов, и там же можно сохранить понравившиеся посты. Можно смело закладывать 30 минут перед началом работы на просмотр понравившихся сайтов в качестве вдохновения и для тренировки насмотренности.
Совет №4. Прототипируй идеи на бумаге
Ещё до начала построения интерфейса на графическом редакторе начинающему дизайнеру будет полезно все свои идеи отразить на бумаге. Это нужно для того, чтобы структурировать блоки, формы и объекты, чтобы в будущем использовать это как план в проектировании интерфейсов. Это будет полезно как для сложных платформ, так и для простых сайтов.
В прототипах можно писать что угодно, вплоть до описания каждого поведения элемента на странице или анимации блоков. Помимо этого, в прототипах можно сразу накидывать идеи для будущих иллюстраций или иконок. Также записывай возникающие вопросы, к которым нужно найти ответы.
Приведу пример. При проектировании приложения для iOS и Android такой подход поможет начинающему дизайнеру понять, каким образом пользователь будет переходить из одного экрана в другой, а каким — будет возвращаться на предыдущий экран. Также станет понятнее, какая функциональность будет на экранах, и как пользователь будет с ней работать.
Опытные дизайнеры тоже используют прототипы, они в основном их применяют при встречах с заказчиком или стейкхолдером. С помощью прототипа на бумаге можно достаточно быстро договориться о структуре, анимации, идеях иллюстраций, переходах между экранами и отображаемой информации. Также с помощью прототипа можно рассказать основную идею команде, которая оценит её по трудозатратам и скажет, насколько сложно или легко будет реализовать предложенную идею. При этом прототип можно будет легко изменить, расширить и, самое важное, это экономит время. Никому не хочется тратить большое количество времени впустую. Такой подход позволяет параллелить процессы при разработке продукта, сайта или приложения, в разработке которого могут участвовать несколько команд или даже отделов в компании.
Прототип на бумаге позволяют донести до всех участников процесса основную идею, которая будет служить как ориентир в работе при производстве отдельных функций.
Совет №5. Найди наставника
Для чего нужен наставник? Для систематизации знаний, а также он направляет результат работы в необходимое русло для достижения цели. Наставник обладает дальновидностью и сможет сказать, как сегодняшнее дизайн-решение повлияет на будущую работу на проекте. Кроме того, он объяснит мелкие нюансы и укажет на ошибки, которые начинающий дизайнер будет неизбежно допускать, расскажет о методиках решений поставленной задачи или отправит к коллеге, с которым можно проконсультироваться.
Расскажу про случай, который произошёл, когда я был начинающим дизайнером. Я работал в компании Fasten, и однажды арт-директор мне сказал: «Неважно, что ты делаешь: прототип, страницу сайта или экран приложения. Всегда делай это хорошо и красиво». Я запомнил его слова на всю жизнь и по сей день выкладываюсь на все 100%, даже если выполняю тривиальные задачи, а также всегда слежу за аккуратностью в макетах.
С наставником можно достаточно быстро развить свои навыки. Конечно, можно и одному, но это будет дольше. Самый простой способ найти наставника — это устроиться на работу в качестве стажёра или младшего дизайнера, к которому найдут опытного дизайнера для обучения.
Совет №6. Не бойся коммуницировать с коллегами
Нужно понять одну важную вещь, что никто не настроен, чтобы уволить тебя. Компании тратят огромные ресурсы и время, чтобы найти кандидата на открытую вакансию. Также компании нанимают сторонние HR-агентства для того, чтобы найти того самого уникального кандидата, с которым будет комфортно работать. Поэтому без веской причины никто и никого не будет увольнять т. к. весь этот процесс необходимо будет повторять заново, а это в свою очередь влечёт за собой потерю времени при производстве фич. Также придётся отвлекать опытных дизайнеров, которые и без того перегружены работой, на просмотр и оценку резюме кандидата, а потом ещё и собеседовать его.
Если тебе кажется, что с тобой никто не хочет общаться или все против тебя, гони такие мысли прочь. Продолжай налаживать контакт с коллегами, это естественное состояние, что для тебя все коллеги новые и незнакомые, к ним нужно найти подход точно так же, как к любому другому незнакомому человеку. Любые негативные мысли могут повлиять на качество твоей работы или могут возникать конфликтные ситуации, которые в свою очередь могут привести к увольнению из компании. Поэтому, чтобы такого не было, нужно быть всегда открытым к своим новым коллегам.
Процесс знакомства нового сотрудника с командой выглядит следующим образом:
Продуктовая команда. В ней присутствуют все сотрудники из разных областей, с которым тебе нужно будет взаимодействовать в процессе работы. Как правило, в таких командах знакомство происходит на утренней встрече, которая называется «daily» (название может отличаться), где каждый участник рассказывает, какими он задачами занимался вчера, какими задачами будет заниматься сегодня и есть ли у него проблемы. После того как все закончили свои выступления, отводится время для представления нового сотрудника. Участник команды, который представляет нового сотрудника, коротко рассказывает команде о новичке и о том, чем ему предстоит заниматься. Далее представляет всех участником команды и рассказывает, что делает каждый их них. После этого даётся минут десять на то, чтобы новый сотрудник рассказал о себе. Например, какие увлечения, какое было прошлое место работы, что ждёт от нового места и любую другую информацию. Далее, если остаётся время, то участники команды задают вопросы новому сотруднику.
Дизайн-команда. Она состоит из одних дизайнеров, которые распределены по разным проектам, и зачастую совместно не работают, могут встречаться на общих дизайн-мероприятиями, которые проводит ведущий дизайнер или арт-директор. На таких мероприятиях проводится синхронизация, каждый дизайнер делится, какими задачами он занимался в своей команде, какие фичи были реализованы и какие фичи команда планирует реализовать в будущем. При этом он показывает макеты, которые были разработаны, а ведущий дизайнер или арт-директор смотрит и оценивает на предмет единого визуального стиля, простоты решения, использования компонентов и по другим критериям. На этой встрече ведущий дизайнер или арт-директор также представляет нового дизайнера, коротко рассказывает о нём и его задачах.
В некоторых небольших компаниях могут вообще никак не представлять нового сотрудника команде т. к. все сотрудники могут быть загружены задачами, и просто нет времени, чтобы всех собрать и представить нового сотрудника.
Совет №7. Чаще разговаривай со стейкхолдером
Стейкхолдер — это лицо, которое непосредственно работают над проектом, может пользоваться результатами работы и влиять на продукт. Стейкхолдер может быть один или их может быть несколько.
Не бойся с ним разговаривать. Он твой друг, к нему нужно обращаться по любому поводу, будь то вопросы по предметной области или нужно сформировать техническое требование на проектирование дизайн-решения. Он поможет тебе, т. к. больше разбирается в предметной области, имеет богатый опыт и знает все нюансы. Стейкхолдер поможет тебе валидировать дизайн-решение и укажут на ошибки в нём. Также его можно привлекать для проведения исследований и последующей проверки решения. После этого уже можно выходить к пользователям со знанием дела и с правильной целью.
Совет №8. Читай профессиональную литературу
Все существующие знания записаны в тексте, как в книгах, так и в статьях. Причём все книги, статьи и другая полезная информация находятся буквально на расстоянии вытянутой руки. Осталось лишь задать запрос в поисковой системе, и подходящий сайт с подборкой лучшей литературы не заставит себя ждать. Я не буду рекомендовать какую-либо одну книгу к прочтению, так как считаю, что читать нужно все, если, конечно, хочешь развивать свои навыки дизайнера.
Помимо книг, также можно читать статьи, например я часто пользуюсь ресурсами:
https://medium.com (ENG, RU)
https://www.smashingmagazine.com/articles/ (ENG)
https://www.nngroup.com (ENG)
https://vc.ru (RU)
https://habr.com/ru/all/ (RU)
Также можно найти группы в различных соцсетях или каналы, в которых постят статьи или полезные ссылки. Обязательно вступи в них и регулярно просматривай в поисках нужной информации.
Совет №9. Пробуй себя в других направлениях
Почему стоит это делать? Таким образом ты сможешь развить полезные качества, которые пригодятся в любой команде по нескольким причинам.
Причина 1
Команды могут быть очень маленькими, и все участники вынуждены совмещать несколько ролей, чтобы команда могла полноценно охватить весь спектр специальностей, которые необходимы для разработки продукта. Часто совмещаемые специальности могут выглядеть так:
Frontend — Backend
UX/UI Designer — Frontend
Backend — QA
UX/UI Designer — Systems Analyst
Business Analyst — Systems Analyst
PO — Systems Analyst
и т. д.
Причина 2
Из-за «Bus Factor». Это такая мера сосредоточения информации среди отдельных членов проекта. Этот фактор показывает количество участников проекта, после потери которых проект не сможет быть завершён оставшимися участниками. По этой причине компании стараются нанимать сотрудников, которые имеют смежные компетенции, которые могут понадобится в случае экстренной ситуации.
Причина 3
Никогда не знаешь, чем будешь заниматься в команде и что тебе понадобится для достижения цели. Например, в любой момент может потребоваться нарисовать иллюстрацию, сделать анимацию, протестировать продукт или поправить вёрстку на сайте или в приложении. Лучше всего иметь несколько дополнительных компетенций, которые можно будет совмещать с основной, пусть даже у тебя нет глубокого понимая в специфике. Имея такие компетенции, можно решить поставленную задачу или помочь своим коллегам, что в свою очередь положительно скажется на продукте и его качестве.
Совет №10. Применяй UX-методологии
Есть такие замечательные книги: «The Design Thinking Toolbox» (ENG), «The Design Thinking Playbook» (ENG), «Придумай. Сделай. Сломай. Повтори» (RUS). В них приведены различные методики для проведения исследований, которые можно использовать уже на ранней стадии продукта. А также в этих книгах приведены методики для проверки функциональности продукта на пользователях, определения качества и полезности функциональности.
Активно применяй методики из книг, чтобы улучшить продукт для пользователей, найти и сгладить все острые углы, которые могут повлиять на впечатления и вызвать отторжение.
Зачастую бывает так, что компания не понимает, кто их пользователь, какие у него проблемы, какие из них нужно решить в первую очередь и как продукт может в этом помочь. Не зная своего пользователя, компания вынуждена тратить ресурсы и время на разработку невостребованного для пользователя функционала. Эти проблемы могут повлиять на качество продукта, а также продукт не найдёт положительного отклика у пользователей, а в конечном итоге компания может обанкротиться.
Совет №11. Планируй и оценивай свою работу
Планирование помогает дизайнеру правильно спланировать свою работу т. к. в работе очень важный фактор — это время. Чем лучше дизайнер планирует свою работу, тем больше времени остаётся для разработки его командой разработки, а также даёт возможность отладить все недочёты и стабилизировать продукт. Кроме того, при планировании дизайнер понимает и может оценить сложность задач. Например, если задача окажется сложной, то дизайнеру необходимо её упростить путём декомпозирования на более простые и понятные задачи, которые уже можно будет оценить по трудозатратам. В крупной компании зачастую весь процесс разработки выглядит как конвейер, где каждый специалист вносит свою лепту в общее дело, и при этом важно, чтобы конвейер никогда не останавливался, а работал как часы. При таком подходе очень важно уделять время планированию работы и правильно оценивать по времени, сколько займёт выполнение той или иной задачи.
Приведу пример процесса разработки фичи в продуктовой команде. Каждая продуктовая команда разделяется на две группы по функциональным ролям: Discovery Team и Develop Team. В Discovery Team входят: владелец продукта, системный/бизнес-аналитик, дизайнер, исследователь. В Develop Team входят: Frontend, Backend, DevOps, QA. Как правило, группа Discovery Team идёт впереди команды Develop Team на две недели. Для чего это нужно? Для того чтобы Discovery Team могла проработать все необходимые детали, которые необходимы для достижения поставленных целей, подготовить и согласовать макеты будущей реализации, а также подготовить технические требования для реализации. При этом Discovery Team должна уложиться в двухнедельный период. После этого Develop Team знакомится с ними и планирует свою работу на следующий двухнедельный блок работ. После этого весь процесс повторяется словно конвейер.
Совет №12. Готовь макеты для команды разработки
При проектировании интерфейса дизайнеру нужно спроектировать его таким образом, чтобы он решал поставленную задачу, был удобным для пользователя, а также он должен быть реализуемым с точки зрения разработки. По сути, реализовать можно всё, главное, чтобы было желание, время и силы на это. В крупной компании зачастую нет большого количества времени, чтобы его тратить на сложную реализацию, всегда нужно решить поставленную задачу с минимальными затратами на разработку. Если, конечно, дизайнер не работает в диджитал-студии, где как раз наоборот: больше сил тратится на визуал, чтобы он привлекал пользователей и помог компании расширить свою аудиторию. В обоих случаях дизайнеру после согласования макета интерфейса нужно будет подготовить макеты для дальнейшей реализации и передать их команде разработке.
Если дизайнер недостаточно грамотно подошёл к подготовке макетов, то появляется проблема со стороны разработчиков, что в свою очередь может вылиться в потерю времени при разработке решения. А разработчики будут постоянно отвлекать дизайнера вопросами, и он не будет уделять достаточно времени проработке дизайн-решения. Чтобы этого избежать, нужно договориться с разработчиками, как нужно готовить для них макеты, чтобы им было понятно, как элементы будут работать, как интерфейс должен реагировать на действия пользователя. Разработчики подскажут, что для них главное и что им нужно в первую очередь, а также могут рассказать, как у них происходит процесс разработки фичи. Зная все эти особенности, дизайнер может быстро и качество подготовить макеты для разработки, и со стороны команды разработки не будет потери времени на выяснение того, как должен работать интерфейс.
На этом всё. Надеюсь, что мои советы помогут начинающим UX/UI дизайнерам прокачаться максимально быстро.
