Пользователь должен понимать в каком состоянии находится интерфейс и его сущности. Это может отображаться в виде статусов (“заказ в пути”) или спиннеров загрузки (“письмо отправляется”).
Помимо этого, не стоит бросать пользователя после совершенного действия. Предложите ему варианты продолжения работы (например, создать еще одно письмо или перейти во “входящие”) или, как минимум, покажите, что действие прошло успешно (“письмо отправлено”, “заказ создан”).
Создав качественную обратную связь интерфейса, пользователь будет чувствовать, что все у него находится под контролем. Таким образом создается доверие и лояльность к продукту.
Во всей нашей прекрасной профессии больше всего я недоумеваю от периодически возникающей шумихи вокруг дизайн-трендов. Это происходит ближе к концу года или в начале нового. Но еще более удивительно, что многие им следуют.
Дизайн-тренды чаще всего касаются визуала, но как можно заранее определить визуал всей отрасли, если каждому бизнесу требуется свой визуальный стиль?
Дизайн-тренды – это неплохое развлечение для дриббблеров, но практически бесполезная вещь в реальном мире. Если клиенту можно продать дизайн, аргументируя его временной модой, то реальные люди, использующие ваш продукт, плевать хотели на тренды, так как им нужно лишь решить свои задачи и хорошо, если это не займет много времени.
На прошлой неделе, я перечитал книгу Дональда Нормана “Дизайн привычных вещей”. Публикую отрывок, в котором автор делиться универсальными принципами дизайна.
1. Наглядность. Пользователь понимает, какие действия возможный и в каком состоянии находится устройство/система в данный момент.
2. Фидбэк. У пользователя все время есть полная информация о результатах действий и текущем состоянии продукта или сервиса. После совершения действия легко понять, каково новое состояние устройства.
3. Концептуальная модель. Дизайн представляет всю информацию, необходимую для того, чтобы составить хорошую концептуальную модель системы. Это обеспечивает понимание и дает пользователю ощущение контроля. Концептуальная модель обеспечивает большую наглядность и упрощает оценку результатов.
4. Возможности. Возможность определяет, какие действия возможны. У продукта есть правильные возможности, которые позволяют совершать желаемые действия.
5. Означающие. Означающее доносит до нас, где должно быть осуществлено действие. Эффективное использование означающих гарантирует наглядность, а также позволяет донести до пользователя фидбэк и сделать его понятным.
6. Проекция. Связь между регуляторами и действиями, которые они выполняют, выстроена по принципу создания хороших проекций и усилена, насколько это возможно, правильной пространственной планировкой и временной соотнесенностью.
7. Ограничения. Обеспечение физических, логических, семантических и культурных ограничений направляет действия пользователя и упрощает понимание продукта.
За несколько лет продуктовой работы у меня сформировалась философия, которую я регулярно использую. Назвал я ее “Прямой линией”.
Заключается она в том, что по ходу проекта всем членам команды будут приходить идеи по добавлению новых функций или изменению существующих.
Зачастую, это временный вздор, который сильно замедляет развитие проекта. Если визуализировать эту мысль, то получается, что возникающие идеи отклоняют развитие проекта от прямой линии, из-за чего достижение цели (финального релиза) отдаляется.
Поэтому, очень важно следить, чтобы изначальный план реализовывался. И, если в команде возникает новая идея, и вы не уверены в ее пригодности, то лучше отложить эту идею и делать то, что было запланировано.
Одна из самых важных задач современного дизайнера – это контролировать воплощение ваших идей в реальность.
Многие не думают об этом, так как живут лишь в своем мире, вдалеке от реальности, где дизайн – это инструмент бизнеса, а не способ удовлетворить эго, набрав побольше лайков.
Программисты работают спринтами по 1-2 недели. После завершения каждого спринта, состоится релиз и новые наработки “выкатываются” в продукт. Чтобы в продукте были реализованы все ваши идеи в нужном виде, вам необходимо его регулярно тестировать.
Кто-то скажет, что эту работу должны выполнять тестировщики, но тестировщики никогда не смогут на 100% понять задумку дизайнера, поэтому, если вас заботит успех компании, то необходимо заниматься этим самостоятельно.
Проще всего сделать это, просмотрев список нововведений разработчиков, по очереди протестировать каждое из них. Все найденные недочеты соберите в отдельный список и передайте ответственному за продукт.
Dribbble и Behance – не оптимальный вариант для создания портфолио UX-дизайнера. Поэтому обратите внимание на текстовые платформы, где можно лучше описать процесс. Среди них отмечу Medium, VC, Habr.
Идеальный вариант – ваш отдельный сайт. Сделать его можно, используя популярные платформы WP, Tumblr. Я советую обратить внимание на продукт Semplice, сделанный Tobias van Schneider. Это WordPress тема с очень удобным визуальным редактором.
Главная задача UX-дизайнера – это понять задачу и спроектировать оптимальное решение. Поэтому любой ваш кейс должен начинаться с поставленной задачи.
В середине проекта постарайтесь передать ваш мыслительный процесс. Опишите, каким образом вы проводили исследование, на какую аудиторию рассчитывали и почему выбрали именно ее. Будет полезно добавить наброски интерфейсов или текстовых файлов.
В финале у человека, который просматривает ваш кейс, должно возникнуть понимание, что поставленную в начале задачу, вам удалось решить.
CJM представляет собой таблицу, по вертикали (столбцы) которой̆ располагаются шаги, которые необходимо пройти пользователю до цели.
Например, при покупке билетов на сайте авиакомпании столбцы вашей таблицы выглядели бы примерно так: сайт, заполнение формы (откуда, куда, кто и когда), поиск подходящего рейса, просмотр подробностей, оплата.
По горизонтали (строки) располагается следующее:
Цель пользователя В данном случае, под целью пользователя имеется не глобальная цель (купить билеты), а локальная на данном этапе, например, заполнить форму или подобрать подходящий рейс.
Ключевое действие Исходя из цели, можно определить ключевое действие. На этапе заполнение формы это будет переход к списку рейсов по выбранным параметрам.
Настроение Здесь нужно определить, что чувствует пользователь на каждом этапе и постараться избежать недовольства или замешательства. Если несколько этапов подряд идут негативные эмоции, высока вероятность, что пользователь не продолжит работать с сервисом.
Возможные проблемы Чрезвычайно важный этап, над которым стоит хорошо подумать. Он может включать в себя, как ошибки от невнимательности, так и непонимание интерфейса.
Решения Этот этап тесно связан с предыдущим. На каждую проблему нужно найти 1-2 решения. Обычно, после выявления возможных проблем, решения становятся очевидными. Именно поэтому CJM сильно помогает в проектировании интерфейсов.
***
Многие думают, что успех проекта решает только опыт, поэтому недооценивают важность процесса. Использование CJM помогает минимизировать недостаток опыта за счет продуманной последовательности действий.
Составление CJM отнимает достаточно времени, но не нужно забывать, что это тоже дизайн. Возможно, это даже больше дизайн, чем то, что мы делаем в графическом редакторе.
Мудборд – это визуальная подборка элементов, которая должна натолкнуть дизайнера на определенное настроение, которое поможет выбрать правильный стиль для проекта.
Стиль может быть модным, скучным, футуристичным или любым другим, это вообще не важно. Важно лишь, чтобы он пробуждал нужные бизнесу эмоции.
Мудборд проще всего собрать, используя Pinterest. Помимо него вы можете использовать Buckets на Dribbble, Moodboard в InVision и любой другой способ (хоть папку на рабочем столе), который вам покажется удобным.
Чтобы избежать прямого копирования, выделяйте у каждого добавленного элемента интересные детали и думайте, как использовать их в вашем проекте. Возможно, они натолкнут вас на абсолютно новые идеи. Периодически полезно закрывать мудборд, чтобы постараться создать что-то абсолютно новое.
Помимо интерфейсов, мудборд может содержать фотографии природы, архитектуры, промышленного дизайна (техника, авто, интерьер), одежды и многого другого. Не так важно, что у вас будет в подборке. Важно лишь, чтобы эти элементы соответствовали посылу создаваемого проекта.
Я знаю дизайнера из региона, который вел таблицу с ведущими арт-директорами и по приезду в Москву писал им с просьбой встретиться. Благодаря этому, он налаживал отношения и узнавал о последних новостях отрасли.
Спустя несколько месяцев, когда открылась вакансия в большой студии, он получил хорошее предложение о работе. Не потому, что был лучше других, а потому, что о нем просто знали (прошло еще полтора года и он сменил одну студию на другую, заняв место партнера).
Профессиональные контакты - это не блат, а возможность реализовать свои умения, привлечь перспективные инициативы и ускорить свое развитие, используя ресурсы других людей.
Поэтому любому дизайнеру не стоит пренебрегать общением с профессионалами. Причем не только из дизайна, но и других областей.
Дизайнер должен понимать целевую аудиторию сервиса, так как она влияет на большинство принимаемых решений.
У каждой аудитории свои потребности. Приведу пример AirBnB. Путешественникам важно ощутить местный колорит и жить в чистом помещении, а собственникам хочется видеть у себя приличных постояльцев и получать быструю оплату.
Чтобы понимать пользователей, нужно собирать обратную связь и общаться со специалистами из отрасли.
В первом вам поможет служба поддержки (если есть), письма в открытый ящик и комментарии в соцсетях.
Во втором – личные встречи. Причем, не только с пользователями, но и людьми, которые в данный момент ваш сервис не используют, но в теории могут. Поняв их точку зрения, вы сможете выявить слабые места и улучшить продукт.
Старшему дизайнеру нужно выдавать качественный дизайн, когда как арт-директору, для развития в профессии, требуется куда больше навыков.
Вот несколько очень важных:
Знание гайдлайнов, дизайн-систем и интерфейсных паттернов Проектируя и исследуя популярные сервисы и материалы, арт-директор собирает десятки интерфейсных паттернов, понимание которых играет ключевую роль в его развитии.
Понимание бизнеса Главная задача арт-директора – корректировать направление коллег, чтобы дизайн решал задачи бизнеса, а не удовлетворял дизайнерское эго. Не понимая задач бизнеса, создать качественный дизайн не получится.
Понимание разработки Понимая фундаментальные правила разработки, арт-директор может выбирать оптимальные дизайн-решения, ориентируясь не только на удобство для пользователей, но и скорость разработки.
Коммуникативность Поскольку арт-директору требуется регулярно общаться с дизайнерами и заказчиками, умение находить общий язык с разными людьми для него является ключевым навыком.
Первые годы работы я не думал о ведении базы знаний проекта, но с опытом понял ее необходимость. Помимо того, что все ваши идеи будут зафиксированы, вам будет проще внедрять новых людей в коллектив и отслеживать принятые решения.
В моей базе данных хранится несколько типов материалов:
Анализ конкурентов. В этом файле описаны все сервисы со схожей механикой и интересные функции, найденные в ходе исследования.
Сценарии. У каждого сервиса есть несколько сценариев и дизайнер должен их хорошо знать.
Customer Journey Map. Инструмент, который помогает проанализировать сценарии на наличие потенциальных проблем.
Интерфейсы. Здесь я собираю мысли и идеи о ключевых местах сервиса.
Идеи. Общие мысли по будущему развитию продукта.
Дизайнер может неделями не открывать графический редактор, так как анализ конкурентов, продумывание сценариев и вариантов развития сервиса – не менее важная работа. Поэтому не стоит ей пренебрегать.
Когда в дизайн-среде говорят об инструментах, обычно упоминают Sketch, Figma, Framer, Adobe XD и еще много других (почитайте канал Юрия Ветрова). Но, погружаясь в суть нашей работы, я понял, что идеальным инструментом дизайнера должен быть разработчик.
Прослойка из макетов во всем процессе работы над продуктом – это довольно глупая вещь. Было бы гораздо эффективнее убрать ее, связав напрямую дизайнеров и разработчиков, тем самым сэкономив уйму времени и ресурсов компании.
Конечно, полностью от макетов отказаться не получится, но я очень сомневаюсь, что через несколько лет у дизайнеров до сих пор будут храниться все нарисованные экраны. Скорее всего, вместо них будет несколько ключевых, а остальное будет решаться путем тесного взаимодействия дизайнера и разработчика.
Работая над текущим сервисом, я понимаю (и довожу это до коллег), что мой дизайн не в макетах, мой дизайн — на фронте.
Универсального фреймворка не существует, так как каждая задача предъявляет свои требования к интерфейсу. (Поэтому копируя паттерны даже у успешных сервисов вы можете столкнуться с проблемой, так как ваши задачи будут не совпадать.)
При создании фреймворка учитывайте несколько вещей:
С какими сущностями вы будете работать? Это могут быть карточки, таблицы, картинки, статьи, графики. Заранее определив это, вы сможете примерно понять, какая структура подойдет проекту.
Какие устройства будут использовать ваши пользователи? Если мобильный трафик займет значительное место, то следует заранее продумать адаптивный интерфейс.
Как может трансформироваться интерфейс в будущем? Понимая это, вы сможете создать структуру, готовую к появлению нового функционала.
Несколько лет назад я решил провести эксперимент. Тогда все пришедшие идеи я записывал на стикеры и в конце недели каждый из них просматривал. В какой-то момент мне стало интересно, откуда эти идеи приходят.
На протяжении месяца помимо самой идеи, я записывал и вид деятельности в момент ее появления. В итоге, у меня накопилось около полусотни стикеров и оказалось, что подавляющее большинство идей приходят в голову во время чтения, причем не только из самой книги, а, сами по себе, появляются в голове.
Во время чтения, наше сознание переключается в другой режим. Думаю, вы и сами замечали, что периодически происходят такие ситуация, когда вы вроде бы прочитали страницу, но ничего не запомнили, так как в это время ваши мысли где-то блуждали (возможно, в поисках новых идеи).
Именно поэтому, чтение книг стало для меня одним из самых главных инструментов поиска идей для новых проектов или улучшения старых.
Многие дизайнеры бьются в стеклянный потолок, пытаясь продать свои услуги дороже, вместо того, чтобы сделать шаг в сторону и подняться по лестнице.
Есть один проверенный способ, который помогает зарабатывать выше рынка, не прикладывая сверхчеловеческих усилий:
Выбирайте сферу, которая хорошо масштабируется или с высокой стоимостью товаров.
Лучше всего масштабируются онлайн-сервисы, но, если вы специализируетесь на дорогих товарах, например, автомобилях, то и там вы можете заработать приличные деньги.
Думайте не в рамках стоимости вашего часа, а ценности, которую вы приносите клиенту. Если ваша работа поможет продать заказчику лишнюю кружку, сидите и помалкивайте. Но когда ваш дизайн помогает продать больше автомобилей или приносит банку сотни новых клиентов или транзакций, вы можете (обязаны) в разы увеличивать стоимость вашей работы.
Анализируя возможные методы поиска работы, я разделил их на две группы: пассивные и активные. Первые нацелены на ожидание предложения, вторые провоцируют его сами.
Пассивные методы
Резюме. Ваш опыт, ключевые навыки и ссылки на работы.
Портфолио. Работодатель готов закрыть глаза на отсутствие образования и опыта, если ваши работы будет хорошего уровня. Многие и вовсе, при просмотре кандидатов, требуют только портфолио.
Профили в соцсетях. Практически все работодатели, прежде чем пригласить кандидата на собеседование, смотрят его профили. Чем вы увлекаетесь? Что публикуете? Где бываете? Многие об этом не задумываются, но соцсети многое говорят о вашей личности и сильно влияют на выбор кандидатов.
Активные методы
Отклики на чужие вакансии. Это самый классический вариант. Используя популярные сервисы для поиска работы, вы можете разослать свое резюме десяткам компаний за несколько минут.
Публикации статей и кейсов. Этот инструмент поинтереснее, так как с одной стороны вы просто делитесь опытом, но в тоже время, привлекаете к себе внимание сообщества и демонстрируете свою экспертизу.
Общение с профессионалами. Посетив какое-либо мероприятие, вы попадете в живую атмосферу, где каждый участник чем-либо занимается и часть из этих людей с удовольствием готова рассмотреть к себе в проект новых кандидатов.
Прямые письма работодателям. Мало кто использует этот вариант, несмотря на его эффективность. Кратко расскажите о себе и почему вы решили обратиться именно в эту компанию и дайте ссылку на ваше портфолио, в идеале, на Dribbble, Behance или свой сайт, чтобы человеку было проще изучить ваши работы.
Курс или конкурс. Популярный ныне вариант, который многим дизайнерам открыл дорогу в топовые компании. Павел Шумаков, выиграв Russian Design Cup, получил предложение от ВКонтакте, а чуть позже перебрался в лондонский офис Badoo. Некоторые дизайнеры, пройдя курс от Skillbox, получили предложение о работе в AIC. Подобные же мероприятия проводит Mail.Ru Group, Яндекс и ежегодно подбирают себе новых кандидатов.
***
Важно понимать, что за ширмой любого бренда, даже самого большого, находятся адекватные люди, которые готовы в любое время рассмотреть амбициозного кандидата. Ваша задача — лишь правильно себя преподнести.
Грамотное письмо на общий ящик или сообщение в Facebook вкупе с аккуратным портфолио — это порой все, что нужно для поиска новой работы. Дальше все будет зависеть от вашей способности правильно подать себя на собеседовании и проявить в первые месяцы работы.