Как улучшить метрики продукта: инструменты UX-дизайна

Выпуск №115 6 июля 2022.
Главная задача продуктового дизайнера — не «навести красоту», а напрямую улучшить метрики бизнеса. Часто даже небольшие улучшения конверсий сильно влияют на общую выручку и прибыль от продукта. Сегодня в 10-шаговом мини-курсе разберём, как прокачать бизнес с точки зрения продуктового UX-дизайна.

10 шагов:
1. Выделяем основные метрики: фреймворк HEART
2. Изучаем сценарии использования продукта: Jobs To Be Done
3. Определяем проблемы на пути пользователя: Customer Journey Map
4. Анализируем решения конкурентов
5. Выдвигаем гипотезы для тестирования: Lean UX Canvas
6. Приоритезируем UX-фичи продукта: фреймворк ICE
7. Создаём прототипы
8. Проводим A/B тесты
9. Планируем дизайн-спринты
10. Следим за лучшими практиками UX-дизайна
1. Выделяем основные метрики: фреймворк HEART
Любой продукт — это некая «черная коробка», которая перерабатывает новых пользователей в деньги, подписчиков, активных пользователей, запросы в поддержку и т.д. Важно отличать метрики продукта от метрик роста:

  • Метрики продукта — насколько эффективно «черная коробка» перерабатывает новых пользователей. Конверсии, показатель оттока, время средней сессии и т.д. 
  • Метрики роста — конечный результат переработки. Это количество пользователей, выручка. Метрики роста зависят от метрик продукта, а также от числа пользователей на входе «коробки».

Если нам нужно сравнить два продукта из одной категории или две версии одного продукта, мы должны использовать метрики продукта. Основная задача UX-дизайнера — улучшать эти продуктовые метрики, чтобы бизнес максимально эффективно перерабатывал новых пользователей. В качестве шпаргалки можно использовать фреймворк UX-метрик HEART от Google:

  • Happiness — удовлетворенность пользователей от нашего продукта. Чаще всего используется NPS.
  • Engagement — вовлеченность. Примеры метрик: среднее время сессии, число репостов, процент охвата от числа подписчиков.
  • Adoption — принятие продукта или новой фичи. Примеры: конверсии в регистрацию, CTR. 
  • Retention — удержание пользователей. Какой процент продлили подписку и т.д.
  • Task Success — эффективность решения задачи пользователей. Среднее время на задачу, bounce rate.
2. Изучаем сценарии использования продукта: Jobs To Be Done
Продукты сами по себе никому не нужны. Всё, что человек покупает — это только лучшую версию себя самого. И уже для этого он может нанять ваш продукт на «работу». 

Это и есть концепция «Jobs to be Done»: понимание работы, которую выполняет наш продукт для клиентов. Из выявленных работ потом рождаются требования к будущему продукту или новые фичи в уже существующем.

Сформировать работы и вычленить из них гипотезы улучшения UX-дизайна поможет метод Job Story. Это одно предложение из трёх составляющих:

  • Когда ___, (в какой ситуации пользователь обращается к нашему продукту?)
  • я хочу ____, (совершить какое-то действие)
  • чтобы____ («лучшая версия себя», которую покупает пользователь — отдохнувший, богатый, повысивший социальный статус и т.д.)

Несколько примеров гипотез по Jobs to be Done: 

  • Когда нужно каждый день писать посты, я хочу найти самый «хайповый» контент по количеству лайков и репостов, чтобы мои посты тоже набирали максимум репостов → сервисы по типу Buzzsumo, Google Trends
  • Когда часто приходят разные бизнес-идеи, я хочу быстро находить аналоги и конкурентов в мире, чтобы скопировать и заработать → CBInsights 
  • Когда я определился с идеей и проектом, я хочу найти сильную команду, чтобы захватить рынок и разбогатеть → сервис знакомств сооснователей.

Более подробно изучить JTBD можно в мини-книге Ивана Замесина.
3. Определяем проблемы на пути пользователя: Customer Journey Map
Хорошему UX-дизайнеру, как и продакту, важно понимать клиентский опыт. При этом не стоит ограничиваться только своим продуктом — путь клиента начинается намного раньше, с осознания проблемы и выбора поставщика. 

В этом поможет карта пути клиента (Customer Journey Map) — мы смотрим на свой продукт «глазами пользователя» и визуализируем его опыт во всех точках контакта с компанией. Для каждого шага мы выдвигаем гипотезы по улучшению метрик нашего продукта. Вот шаблон CJM в Гугл-таблице. 

Пошаговый гайд по составлению CJM есть у UXPressia — это сервис для составления подобных карт, бесплатного тарифа хватит для небольших проектов. Также много шаблонов есть в Miro и Figma.
4. Анализируем решения конкурентов
Самый главный инструмент UX-дизайнера — профессиональная насмотренность. Это умение подмечать хорошие дизайн-подходы конкурентов и адаптировать их в своём продукте. Ведь конкуренты уже проделали всё за вас и оставили то, что работает лучше всего. 

Сейчас есть множество подборок для вдохновения и копирования в UX-дизайне:


Берём сервисы из вашей отрасли и подробно разбираем, как они сделали онбординг пользователей, чекаут, предложение о подписке и т.д.
5. Выдвигаем гипотезы для тестирования: Lean UX Canvas
После анализа клиентского пути и исследования конкурентов, у нас уже должен быть пул гипотез для тестирования в нашем продукте. Упорядочить их можно с помощью метода Lean UX — это одностраничный документ, который отвечает на вопросы:

  • Где мы сейчас? Описываем текущие метрики бизнеса, портрет клиента и основную проблему, которую мы пытаемся решить с помощью методов UI/UX.
  • Где мы хотим быть? Как мы поймем, что решили проблему бизнеса? Какие показатели будем замерять?
  • Как мы туда попадём? Описание UX-решений, которые мы собираемся внедрить в нашем продукте.
  • Как мы поймём, что оказались правы? Описание гипотез, целевые метрики, самые рискованные допущения (RAT).

Есть шаблоны в PowerPoint и Miro.
6. Приоритезируем UX-фичи продукта: фреймворк ICE
Как понять, над какими UX-задачами работать в первую очередь, а какие и вовсе можно выкинуть? Ребята из Ducalis собрали фреймворки для расстановки приоритетов компании, а также подготовили шаблон в Гугл-таблице. Вот самые популярные способы:

  • ICE: Impact (влияние задачи на достижение нашей цели) x Confidence (уверенность в том, что это правда) x Ease (легкость реализации). Каждому параметру задается субъективная оценка от 1 до 10, затем их перемножают и на базе этого расставляют приоритеты в работе. 
  • RICE: добавляется Reach, потенциальный охват фичи.
  • WSJF: Weighted Shortest Job First. Сначала — более важная и короткая работа.
  • PXL: расширенная версия ICE для A/B тестов. Есть шаблон в Гугл-таблице.
  • Модель Кано: приоритезация фич от потребностей клиента. Все фичи условно делятся на обязательные, дополняющие и восхищающие. Затем по специальному опроснику клиенты отвечают, что чувствуют по поводу каждой функции.

Попробуйте разные способы и остановитесь на одном, который больше всего подходит вашей команде.
7. Создаём прототипы

Когда мы определились с первоочередной задачей, переходим непосредственно к дизайну. Лучше всего получать эти навыки в работе над реальными задачами на курсе по продуктовому UX/UI-дизайну в Product University. Здесь лишь перечислим основные инструменты UX-дизайнера:

  • Первоначальные наброски для понимания задачи — карандаш с блокнотом, доска со стикерами. 
  • Разработка структуры решения — майнд-карты в MindMeister, Miro. Варфреймы в Balsamiq.
  • Сбор референсов и компонентов. Например, для веба можно посмотреть компоненты на btw.so, украсть дизайн и цвета сайтов с помощью Stylify, примерить шрифты на Wordmark и т.д.
  • Прототипирование — Figma, Sketch, InVision Studio. 
  • Создание мокапов — SmartMockups, Qurb. 
  • Иллюстрации — Designstripe, DoodleIpsum.
8. Проводим A/B тесты
После раскатывания нового функционала встаёт вопрос: получилось ли у нас улучшить метрики продукта? При этом нельзя просто сравнить эти метрики «до» и «после» — придётся немного погрузиться в математику. 

Рассмотрим на примере увеличения конверсии лендинга. UX-дизайнер изменил интерфейс лендинга, после чего средняя конверсия в регистрацию выросла с 2% до 10%. Это хорошо, но здесь мы не учитываем выборку пользователей — если новую версию сайта увидели только 10 человек, результат не обязательно будет отражать реальное значение новой конверсии. Если взять другую случайную выборку, то конверсия может получиться другой.

Поэтому важное понятие для UX-дизайна — это доверительный интервал, который с вероятностью 95% содержит реальное значение метрики. Чем больше выборка пользователей, тем у́же будет интервал. Для их расчета обычно используют онлайн-калькулятор, в котором нужно ввести:

  • Размер выборки (количество пользователей)
  • Замеренное значение метрики

И калькулятор покажет интервал, в котором с вероятностью 95% лежит реальное значение конверсии. Если нет пересечения интервалов «до» и «после», то мы получили статистически значимые результаты и можно утверждать, что мы улучшили метрику продукта. 

Сейчас такие тесты обычно проводят в автоматическом режиме: половине пользователей показывают старую версию, другой половине — новую. Есть удобные инструменты для таких A/B тестов: Google Optimize, Mixpanel, Optimizely.
9. Планируем дизайн-спринты
Идея дизайн-спринтов пришла из методологии Agile: в основе лежит быстрое прототипирование и тестирование решений (Build fast, fail fast). В изменчивом мире компаниям ничего не остаётся, кроме как становиться «гибкими» и улучшать продукты итерациями. 

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

Вот несколько шаблонов для внедрения дизайн-спринтов в команде:

  • План agile-проекта в Excel. Позволяет отслеживать статус задач по каждому спринту и общий прогресс выполнения проекта.
  • Шаблон для управления agile-проектами в Гугл-таблице. Частично автоматизирует управление проектами: например, умеет отправлять уведомления о статусе проекта на email. Нужно дать разрешение на выполнение скриптов — смотрите в инструкции по шаблону. 
  • Шаблон для agile-ретроспективы в Notion. Лидер оценивает работу команды, основные достижения и ошибки в процессе работы над проектом. Будет понятно, что нужно улучшить в следующей итерации.
10. Следим за лучшими практиками UX-дизайна
Реалии цифрового мира таковы, что сейчас нужно «бежать со всех ног, только чтобы оставаться на месте». Многие компании, упустив важный тренд, полностью проигрывают рынок более быстрым конкурентам (вспомните только Nokia и Blackberry). 

Поэтому каждому UX-дизайнеру важно выработать привычку следить за трендами. А также уметь вычленять тренды среди хайпов. Начать можно с этих ресурсов:
Годное чтиво за эту неделю

  1. Где брать новые бизнес-идеи и откуда взялись идеи таких проектов как Uber, Instagram, Airbnb, Neftlix.
  2. Как и зачем я запустил несколько продуктов одновременно.
  3. Как найти у клиентов проблемы второго порядка (помимо очевидных)
  4. Как сделать контент-план согласованным с брендом и ценностями компании.
  5. Отчет о потреблении новостей в разных странах (pdf)
Твит недели
«Каждый выглядит умным, пока не начнёт что-то делать».
Над выпуском работали
Алексей Черняк
Подписаться на Telegram-канал Алексея 
Александр Басиров
© 2020 Product University
119311, Москва, Вернадского 9/10
a@productuniversity.ru
+7 499 938 66 46