«Мир Квестов»: дизайн мобильного приложения для удержания клиентов и роста LTV

Продуктовая стратегия

Определили три этапа запуска и для каждого обозначили сроки.

MVP (2–3 месяца). На первом этапе запланировали реализовать базовые функции агрегатора: каталог квестов, поиск, фильтрацию и бронирование. Дополнительно в этот список добавили «Избранное» и уведомления. С их помощью пользователи смогут сохранять интересные квесты, а приложение будет напоминать о них и возвращать к выбору.

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

Продвинутые фичи (6–12 месяцев). Дальше по плану — сосредоточиться на росте пользовательской базы. Для этого хотели добавить реферальную программу и подарочные сертификаты, чтобы пользователи могли приглашать в сервис друзей. Ещё одна запланированная функция — чат с поддержкой и отзывами для улучшения клиентского опыта.

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

Команда «Мира Квестов» оценила предложенную стратегию: «Идейно супер, по деталям — ещё допилим». После этого мы перешли к планированию работ. Финальный вариант стратегии доработали вместе с командой заказчика: скорректировали приоритеты и последовательность внедрения функций.

Поиск референсов и согласование структуры приложения

Хотя до этого мы уже проводили редизайн мобильной версии сайта «Мира Квестов», переносить её интерфейс в приложение напрямую было нельзя.

Сайт в первую очередь рассчитан на первое знакомство с сервисом и привлечение SEO-трафика, а приложение — на регулярное использование и удержание аудитории.

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

Затем адаптировали выбранные UX-паттерны под задачи «Мира Квестов» и на их основе сформировали структуру интерфейса.

Главный экран

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

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

На главном экране разместили:

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

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

Умный поиск

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

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

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

Страница подбора квеста

Реализовали быстрый доступ к категориям: скидки на квесты, страшные, квесты для детей.

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

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

Для категорий квестов также создали атмосферные обложки.

Страница квеста

В мобильной и веб-версиях сайта эта страница одна из самых объёмных по количеству контента. В приложении от SEO-блоков можно было отказаться. Так мы получили больше свободы при проектировании и полностью переработали раздел с учётом мобильного формата. Теперь для выполнения ключевых действий достаточно 2–3 нажатий.

Онлайн-бронирование

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

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

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

Онбординг и вход в приложение

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

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

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

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

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

Ключевая особенность приложения

«Мир Квестов» работает с 2014 года, и всё это время пользователи обходились без отдельного приложения. Поэтому перед нами стоял вопрос: зачем человеку переходить в мобильный сервис, если квесты он посещает время от времени? В отличие от маркетплейса, где пользователь может ежедневно искать новые товары и акции, здесь повседневного повода открывать приложение нет даже у лояльной аудитории.

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

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

Профиль пользователя

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

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

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

Подготовка макетов к разработке

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

Описали:

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

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

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

Результат

«Мир Квестов» получил концепцию полноценного мобильного продукта, рассчитанного на регулярное взаимодействие с пользователями.

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

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

Интерфейс приложения адаптировали для кроссплатформенной разработки. Так он одновременно соответствует как гайдлайнам iOS, так и Android.

Концепцию довели до уровня готового дизайн-решения: проработали все основные экраны и состояния, подготовили UI-кит, стайлгайд и правила работы с макетами для разработки. 

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

Планируйте разработку нового приложения или онлайн-сервиса? Давайте обсудим ваш проект.