Как мы превратили сервис бронирований в аналитическую платформу для ресторанов
СмартРезерв — сервис Яндекс Еды для управления бронированиями в ресторанах. Он появился после покупки LeClick и состоит из 2 частей:
Я работал над панелью управления.
Проблема
После покупки LeClick у Яндекс Еды появился работающий сервис бронирований, но административная часть была не готова для масштабирования. Многие изменения рестораны делали через поддержку или менеджеров: настройки, права доступа, аналитика.
Нам нужно было быстро запустить первую версию панели управления: продукт, в который партнёры будут возвращаться и которым смогут пользоваться без помощи менеджера.
У нас уже были разделы «Гости» и «Бронирования», но без понятной главной страницы продукт был не полноценным.
Моя роль
Я участвовал в запуске панели управления СмартРезерв и отвечал за дизайн ключевых разделов: аналитику, сегменты гостей, теги, рассылки, отзывы, настройки залов, авторизацию и онбординг.
В этом кейсе я сфокусируюсь на аналитике ресторана. Это была самая сложная и системная часть панели: она должна была дать партнёрам причину регулярно открывать кабинет и принимать решения на основе данных.
С чего начали
Продакт-менеджер пришел с вопросами, которые волнуют менеджеров и управляющих ресторанов:
Исходя их этих вопросов появилась таблица со списком графиков, разбитая на 3 блока: аналитика бронирований, гостей и метриках качества.
Вместе с продакт-менеджером мы определили структуру будущей аналитической платформы: «Загрузка зала», «Портрет гостя» и «Качество».
Запускать все разделы сразу было слишком долго. Поэтому мы решили собрать ключевые показатели на общей странице «Сводка», которая даст партнёру быстрый ответ на три вопроса:
- Что сейчас происходит с рестораном
- Где есть проблема или изменение
- Куда стоит посмотреть дальше
В первую версию вошли ключевые показатели ресторана, данные о загрузке зала, источниках бронирований, сегментах гостей и тегах.
В первый экран добавили простой виджет-помощник: он подсвечивал показатели, которым стоит уделить внимание, или сообщал, что всё в норме.
Задача: сделать данные читаемыми
Большинство партнёров не работают с аналитикой профессионально. Поэтому мы не стремились добавить на экран как можно больше графиков. Каждый график должен был помогать заметить закономерность и принять решение, а не просто показывать данные.
Моя зона ответственности включала визуализацию данных, систему аналитических компонентов, цветовую систему, работу с периодами и поиск подходящих форм графиков.
Как искали форму для графиков
Сначала для каждой метрики я искал подходящую форму визуализации: что лучше поможет увидеть динамику и проявить данные, сравнить категории или заметить отклонение.
Определив общий список графиков, надо было примерить их на реальных данных и зафиксировать функциональность. Компоненты должны были работать с 2–5 значениями, поддерживать прогноз и оставаться понятными для текущего дня.
Параллельно искал цветовые сочетания. Цвета должны хорошо смотреться вместе, работать в линейных и столбчатых графиках, не шуметь и быть достаточно контрастными.
В итоге получилась базовая палитра цветов для линий, столбиков и градиентов. А если данных было больше, в ход идёт расширенная палитра:
Мы проверяли и более уникальные подходы к визуализации. Например, рассматривали тепловую карту загрузки зала. Карта показывает процент занятых столов в каждый час. Например, карта подсветит пустые утро и день, если у ресторана нет завтраков и обедов.
Но по исследованию продакта партнёры не увидели в ней потребности на текущем этапе. Поэтому в первой версии решили собрать больше данных и отложить карту на будущее.
В итоге выбрали спокойную систему: знакомые формы графиков, ясная иерархия, минимум декоративных приёмов и достаточно контекста, чтобы сравнивать показатели между собой.
Работа со временем
Рестораны смотрят на данные на разных горизонтах: им важно оперативно оценить сегодняшний день, сравнить недели или увидеть изменения за месяц.
Я предложил сделать выбор периода частью основного интерфейса, а не прятать его в дополнительное меню. Пользователь может переключаться между днём, неделей, месяцем и произвольным периодом, а также быстро переходить к соседним интервалам.
Для дневной аналитики графики перестраиваются по рабочим часам ресторана. На них отмечено текущее время: это помогает отличить уже собранные данные от прогноза по будущим бронированиям.
Система графиков
«Сводка» была первой вкладкой аналитики, поэтому я проектировал не отдельные карточки для одного экрана, а систему для дальнейшего роста.
Мы проверяли, сколько столбцов и значений может выдержать график, когда он остаётся читаемым, а когда превращается в шум:
Для графиков появились варианты во всю ширину, 1/2 и мобильные версии, пустые состояния и правила для разной плотности данных. Это позволило использовать знакомые паттерны в следующих разделах без проектирования всего с нуля.
Как Сводка стала базой для развития
После запуска «Сводки» мы начали развивать следующие разделы. При работе над вкладкой «Загрузка зала» первоначальный набор метрик не складывался в понятный для защиты рассказ: данные были, но не отвечали на единый вопрос ресторатора.
Мы подключили аналитика, ещё раз пересобрали картину, изменили набор и расположение графиков и добавили круговую диаграмму. После этого вкладку удалось защитить.
Результат
Мы запустили первую версию аналитики — понятную точку входа в кабинет и основу для дальнейшего развития аналитики.
За период развития кабинета:
- Появилась главная страница, с которой партнёр мог начать работу с данными
- Количество поддерживаемых сценариев выросло примерно в 32 раза
- Количество событий аналитики — примерно в 43 раза
- Появилась основа для разделов «Загрузка зала», «Портрет гостя» и будущих метрик качества
