Мы используем cookie-файлы. Оставаясь на сайте роботов, человек соглашается на использование cookie-файлов.
Подробнее — в «Условиях использования cookie-файлов».

Дизайнеру продукта: про необходимые знания и навыки, UX- и UI-тренды и любимые инструменты коллег по цеху

Представители Ozon, Skyeng, «2ГИС», «Сбербанка» и «Яндекса» рассказали о своих подходах в работе над продуктом.

Redmadrobot Design Lab продолжает цикл статей о продукте и дизайне. В прошлых двух материалах мы говорили c менеджерами продукта. Они советовали полезные книги и сайты, описывали свои подходы в работе и рассказывали про любимые рабочие инструменты.

Сегодня мы поговорим с дизайнерами. Они поделятся своим инструментарием, расскажут о мировых трендах и важных навыках для работы с UX и UI. А также попытаются ответить на вопрос — какую роль сегодня играет дизайн при создании продукта.

Навыки и знания, без которых сегодня не обойтись UX- и UI-дизайнерам

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

По словам руководителя отдела дизайна «2ГИС» Дмитрия Пиликова, такие скилы — базовый минимум. После этого дизайнер должен проверить работоспособность своих решений и объяснить их команде.

Дмитрий Пиликов
руководитель отдела дизайна «2ГИС»

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

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

О технической подготовке говорит и дизайнер продукта в «Яндекс.Дзене» Анастасия Миронова. По её словам, программирование — один из полезных навыков, который поможет в работе над продуктом.

Анастасия Миронова
дизайнер продукта в «Яндекс.Дзене»

Весь предыдущий год я винила себя в том, что не умею программировать. Казалось, каждая собака может собрать что-то во Framer, потом быстро сверстать, собрать анимации на JavaScript и «заполировать» быстрым прототипом в Android Studio.

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

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

Анастасия Миронова
дизайнер продукта в «Яндекс.Дзене»

Смогли объяснить, как должен работать прототип — ничего программировать не нужно. Сумели убедить менеджера, что вам нужен прототип на реальных данных — и вот вам в помощь выделяют разработчика. Несмотря на кажущуюся лёгкость, коммуникация — это та ещё задачка, и на курсах в интернете этому, увы, не учат.

«Главное в работе дизайнера — иметь светлую голову и уметь взаимодействовать с командой, слушать клиентов и заказчиков. Инструменты по сравнению с этим — гораздо более простая вещь», — рассуждает руководитель направления продуктового дизайна в Ozon Данил Бабарыкин.

О полезности навыков софт-скилов рассуждает и арт-директор Redmadrobot Сергей Кутьков. Он выделяет восемь основных качеств, которые важны для дизайнера.

  • Целеустремлённость.
  • Управление временем. Умение попадать в озвученные сроки без бессонных ночей.
  • Концентрация на важном. Умение фокусироваться в среде постоянного отвлечения внимания.
  • Быстрая обучаемость.
  • Постоянное самообразование.
  • Эмпатия.
  • Проактивность.
  • Коммуникация. Умение общаться с коллегами и заказчиком, аргументировать и защищать решения.

Лидер дизайн-кластера «Сбербанк Онлайн» Ярослав Сизов тоже за навыки коммуникации. По его словам, любая продуктовая работа — это командная работа.

Ярослав Сизов
лидер дизайн-кластера «Сбербанк Онлайн»

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

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

Всё дизайнерское комьюнити сегодня повёрнуто на красивой анимации, но сочетать её правильно с продуктом умеют единицы — это ещё один очень важный скилл, прям must have.

Команда Redmadrobot

О проверенных инструментах и приёмах, которые используют команды

Говоря «must have», Ярослав упоминает про полезные решения в работе над продуктом. По его словам, на рынке уже существует определённый набор приёмов, которые хорошо себя зарекомендовали: «Отчасти сегодня всё сводится к тому, что форма велосипеда уже изобретена, осталось только выбрать цвет», — рассуждает Ярослав.

«Основное отличие продуктовой разработки в ecommerce от, например, банковской в том, что нам нужно запускать новые сервисы и функциональность быстро, короткими итерациями», — рассуждает Данил Бабарыкин. Чтобы не допустить ошибок, в Ozon проводят качественные и количественные исследования.

Данил Бабарыкин
руководитель направления продуктового дизайна Ozon

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

Для количественных исследований в Ozon есть команда аналитиков, которые следят за метриками и А/B-тестами. На их основе они уже определяют, какие решения были удачными, а что пошло не так.

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

Про Figma, работу с аналитикой и пользу от общения с пользователями рассказывает и дизайн-лид в Skyeng Math Иван Покалюк. Дизайнер добавляет: «В первую очередь стоит сконцентрироваться на том, чтобы выстроить коммуникацию и продуктовый процесс в команде. Тогда хорошие решения будут появляться гораздо чаще».

А Дмитрий Пиликов выделяет пять приёмов проектирования, которые помогают ему в работе над продуктом:

  • Методы дизайн-мышления при планировании.
  • Пристальное изучение области, конкурентов, людей и среды.
  • Фиксация результатов.
  • Проектирование.
  • Проверка гипотез.

Но самым бесценным приёмом Дмитрий считает общение с людьми, которые пользуются или являются потенциальными пользователями продукта. «Кажется, что интервью, юзабилити-тестирования, наблюдение за работой людей в их контексте ещё переживут нас всех», — рассуждает Дмитрий.

Дмитрий Пиликов
руководитель отдела дизайна «2ГИС»

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

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

Анастасия Миронова
дизайнер продукта в «Яндекс.Дзене»

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

Про набирающие популярность UX- и UI-тренды

По словам Анастасии, как художественные основы закладываются в сердце современных сервисов, так и тренды в UX и UI тесно переплетаются с прошлым дизайна.

Анастасия Миронова
дизайнер продукта в «Яндекс.Дзене»

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

Дизайн — невероятно отзывчивая на общественные настроения штука. Вспомним модернистский Баухаус (Высшая школа строительства и конструирования, существовавшая в Германии с 1919 по 1933 год, — Redmadrobot), ставший ответом на ужасы Первой мировой, или безумную гранжевую эстетику Загмайстера девяностых. Мне кажется, сегодня мир — про разнообразие и принятие, а значит, и в дизайне позволено всё.

«Из мировых трендов, которые мы используем в своей работе, можно назвать, например, дизайн-спринты — их мы применяем, когда нужно, чтобы команда проекта синхронизировалась, особенно при работе над сложными задачами, где возможно несколько подходов к решению», — рассуждает Данил Бабарыкин.

Команда Redmadrobot​

А по словам Дмитрия Пиликова, тренды приходят и набирают популярность так быстро, что называть что-то «новым» опасно — завтра это может уже устареть. Но что точно не собирается устаревать в ближайшем будущем, так это AR, VR и голосовое управление.

Дмитрий Пиликов
руководитель отдела дизайна «2ГИС»

Есть множество технологий, на которые стоит обращать внимание дизайнерам: голос (голосовое управление, помощники, роботы вместо колл-центров) и AR, VR. С ними связана причина, по которой мне о трендах говорить стыдно.

В 2010 году мы перезапускали мобильную версию «2ГИС». В ранних, но рабочих прототипах был AR-режим. Мы поняли, что довести до ума и поддерживать его будет лишним, и отказались от части готовой разработки. Не скажу, что я сильно сожалею об этом и до сих пор думаю, что это далеко не самая обязательная часть в «2ГИС», но осадок остался от того, что не разглядел потенциал AR тогда.

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

Дмитрий Пиликов
руководитель отдела дизайна «2ГИС»

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

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

«Персонализация — это попытка сделать продукт для каждого разный, подстроившись под некий пользовательский профиль, под знания о клиенте. Этим давно занимаются Google, ‘‘Яндекс’’, Facebook, но как мы видим, совершенства они не достигли. И даже не приблизились к нему, потому что многую рекламу, которую мы видим, воспринимаем как назойливую», — рассуждает о персонализации Ярослав Сизов.

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

По словам Ярослава, это два ключевых тренда, которые касаются как пользовательского опыта, так и UI.

Ярослав Сизов
лидер дизайн-кластера «Сбербанк Онлайн»

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

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

Второй аспект — эмоции. Интерфейс должен отражать степень эмоциональности события.

Например, в «Сбербанк Онлайн» есть платёж, который клиент совершает периодически (например за ЖКХ), а есть платежи, которые связаны с жизнью клиента намного плотнее, например, закрытие ипотеки.

И если в первом случае мы можем отметить завершение платежа зелёной галочкой, то с оплатой ипотеки этого уже будет недостаточно — эмоциональный окрас этих двух событий несоизмерим. Работа с эмоциями и отражение их в UI — то, над чем работаем.

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

Иван Покалюк
дизайн-лид в Skyeng Math

У каждого продукта свои особенности и задачи. Из тех, кого можно вспомнить сразу, — это Airbnb и Stripe.

Про любимые инструменты в работе

У Дмитрия Пиликова больше пяти инструментов, которые он использует каждый день.

Дмитрий Пиликов
руководитель отдела дизайна «2ГИС»

Что первое я поставлю на лаптоп? Sketch, Figma, Glyphs, iWriter, Pomodoro Timer и залогинюсь в Readymag. С iWriter на полный экран приятно размышлять, не отвлекаясь. Я ретроград, привык собирать проекты в Sketch — весь минимальный набор инструментов для дизайнера интерфейсов там есть.

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

Я не привык работать над проектами один, и тут меня выручила Figma. Это же весело и правильно: сидеть на созвоне с продакт-менеджером в одном проекте и в четыре руки собирать макет.

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

А чтобы хоть как-то функционировать, сохранять фокус и не отвлекаться лишний раз на сообщения в мессенджерах, почте и Slack, включаю Pomodoro Timer на 40 минут.

Команда Redmadrobot​

По словам Анастасии Мироновой, самые любимые её инструменты Pinterest и Instagram: «Потому что это — мои глаза, только в диджитал-пространстве», — рассуждает Анастасия.

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

Ярослав Сизов
лидер дизайн-кластера «Сбербанк Онлайн»

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

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

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

«Роль дизайнера при создании продукта во многом интегрирующая, поскольку часто у него больше всего информации о том, как в итоге может выглядеть решение, и это помогает поддерживать связность в проекте», — отвечает Данил Бабарыкин.

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

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

Данил Бабарыкин
руководитель направления продуктового дизайна Ozon

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

По словам Ярослава Сизова, дизайн играет «огромную роль», потому что он определяет клиентский опыт.

Ярослав Сизов
лидер дизайн-кластера «Сбербанк Онлайн»

Если запускать продукт от функционала, то никогда не получится цельного клиентского опыта. Когда смотришь глазами клиента, сразу получается некое целевое решение, от которого уже можно отматывать назад, строить стратегию через MLP (Minimum Loveable Product — Redmadrobot), через какие-то этапы запуска.

Чтобы сравнить мнения, тот же вопрос мы задали менеджерам продукта из TalentTech, «Сбербанка», «Сибура» и «Точки».

По словам руководителя продукта в TalentTech Андрея Ежова, дизайн продукта сегодня играет второстепенную роль, а на первом месте — контент. «Дизайн — это вкусовщина. Секрет такой — делай проще, понятнее, доступнее для любых сегментов аудитории и люди придут», — рассуждает Ежов.

Владелец продукта в «Сбербанке» Ирина Жигалова отмечает, что решающую роль сегодня играет не что-то одно, а общее впечатление от продукта.

Ирина Жигалова
владелец продукта в «Сбербанке»

«Дизайн становится всё более неотъемлемой частью продукта. Но все-таки пользователи выбирают не просто дизайн, а продукт, которым удобно пользоваться. А если этот продукт наделён качественным дизайном, то на рынке он становится лидером».

Владелец продукта в «Сибур» Игорь Громов считает, что из-за роста конкуренции на рынке товаров, роль дизайна сегодня напротив — увеличивается. Это касается как сферы b2c, так и b2b.

Игорь Громов
владелец продукта в «Сибур»

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

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

Думаю, практики «сделай сам» накроют и корпоративные сегменты за пределами разработки софта. Самый очевидный инструмент для такого масштабирования — 3D-печать.

По мнению руководителя продукта в «Точке» Марии Поликарповой, значение дизайна при создании продукта неоспоримо: «Для пользователя продукт — это и есть дизайн. Если что-то не понял, это проблема дизайна. Если легко совершил нужное действие — его заслуга». Похожей точки зрения придерживается и Сергей Кутьков.

Сергей Кутьков
арт-директор в Redmadrobot

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