Исследование и дизайн интерфейса личного кабинета

X5 Group известна «Пятёрочками» и «Перекрёстками», но в группу входят разные продукты: доставки «Впрок» и «Много Лосося», «Х5-клуб» и многие другие, в том числе программа «Пакет».

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

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

Дизайн-задачи

1. Провести продуктовое исследование с целью выработки обоснованных интерфейсных решений, отвечающих потребностям пользователей и целям бизнеса.

2. Спроектировать высокодетализированный интерактивный прототип личного кабинет «Пакета» во вьюерах приложений X5.

Концепты личного кабинета

Главная страница: прогресс-бар и статистика

Результат

Провели исследование, сформировали концепцию и нарисовали прототип интерфейса:

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

Каталог выгод. Выгоды от X5 и от партнеров

Предложенная архитектура открыла возможности для роста и гибкого развития:

• Главная – даёт повод зайти, направляет и вовлекает.
• Каталог выгод позволяет найти предложения как от Х5, так и от партнёров.
• Коммуникативные механики, специфицированные под разные группы пользователей, оценила команда маркетинга.
• Навигация и общие паттерны проработаны с учётом того, как выглядит кабинет подписки в вебе, в приложениях «Перекрёстка», «Пятёрочки» и других продуктов Х5.

Экран с выбором подарка и открытая сториз

Концепция решает задачи по вовлечению и удержанию пользователей, предоставляет пространство для роста и развития, а значит – увеличения объёмов и прибыли.

Цифры

На этапе исследования:

• провели рекрутинг по базе в 1500+ человек
• 480 человек прошло опрос-квиз про выгоды «Пакета»
• провели 21 глубинное интервью, чтобы изучить как устроены повседневные покупки у пользователей Х5 и их мотивы подписки на «Пакет»
• объединили 1020 ключевых цитат вокруг 35 тем в ходе аналитики
• составили 4 портрета пользователей
• составили продуктовую CJM из 21 шага, указав ключевые задачи и отличия между группами на каждом

Фрагмент пользовательского интервью

На этапе проектирования:

• выделили 43 ключевые задачи для реализации в интерфейсе
• проработали информационную архитектуру и ожидания пользователей к каждому разделу
• реализовали в интерфейсе 34 JTBD
• нарисовали 15 экранов, показали работу ключевых элементов
• провели UX-тестирование прототипа на 7 респондентах из разных групп
• презентовали проект на аудиторию в более чем 50 человек

Чеклист JTBD

Экстра-польза

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

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

Фрагмент CJM

Особенности

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

Решили сделать рассылку от X5 group, чтобы звонить уже согласившимся. Замаскировали под квиз.

«С какими фактами о “Пакете” вы согласны? Часть фактов мы придумали».

Результат опроса

Из четырнадцати пунктов придумали мы шесть.

Квиз прошло 480 человек. 72 из них согласилось на интервью, и мы быстро набрали информантов. Время поиска сократилось почти в 10 раз, а результаты опроса подкрепили выводы исследования.

Мы ожидали, что кэшбэк (381) и доставка (276) будут фаворитами (на них делала упор реклама), но не такого отрыва. Больше людей отмечало неограниченные пакеты, чем реально существующие партнёрские предложения для туризма.

Интервью подтвердили гипотезу: люди не изучали возможности подписки. Отчасти потому, что не видели поводов заходить в ЛК.

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

1. Разместили на видном месте информацию о баллах, с указанием «окупился ли “Пакет”» и призами за набор баллов. Призы могут быть символические, но рандомная выгода приятна и стимулирует зайти.

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

3. Дали выбирать любимые категории. Для тех, у кого магазины Х5 – основные, это серьёзный повод зайти в кабинет хотя бы раз в месяц.

4. Проработали раздел «аналитика» для прагматиков. Поразмышлять над графиком – тоже повод.

5. Использовали позитивный язык: «выгода» и «аналитика», а не «экономия» и «расходы».

Рядом с этими якорями дали место, чтобы информировать пользователя и направлять его внимание. Приёмы предложили привычные и понятные людям: сториз и баннеры, ведущие пользователя в другие разделы системы, например – в каталог выгод. Так можно информировать о новой партнёрке или временной акции от Х5.

Нюансы процесса

После обработки интервью мы стали искать принципы, которые объяснили бы отличия и могли служить основанием для портретов.

Наиболее объясняющими оказались два:

• отличия городских и региональных пользователей;
• степень экономической свободы

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

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

Аналитика. Заработали, сэкономили

Что касается экономической свободы (денег), она влияла на две вещи:

• насколько выражены циклы «от зарплаты до зарплаты»;
• на то как люди осмысляют подписку: как средство сэкономить или как плату за сервис.

Эти различия легли в основу портретов:

• Экономные
• Расчётливые прагматики
• Городская богема
• Консервативные регионы

Портреты пользователей

Изначально для всех разделов сервиса, а также важных элементов (Дашборд, Новости) в Figma генерировались идеи и решения, которые бы решали задачи пользователя в интерфейсе. За референсы брали не только сервисы, похожие на «Пакет». Некоторые решения пришли из продуктов, связанных со спортом или обучением иностранным языкам.

Настройка уведомлений и новости

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

Это позволило собрать интересные идеи и решения в единый интерфейс.