Русский Аппетит

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

В этом кейсе история ещё интереснее. Сайт на проекте носит больше информационную функцию: здесь можно посмотреть каталог, но заказать блюда не получится — для этого нужно прийти в киоск сети (либо сделать заказ через приложения подрядчиков — Яндекс. Еда или Маркет Деливери). Штука среди клиентов сети популярная — многие ей пользуются именно из-за бонусов.

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

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

1. Интеграция систем

Реализованы интеграции с:

— 1С: для синхронизации товаров и цен.

— Mindbox: для управления акциями и сегментации пользователей.

— Hotmaps: для отображения информации о торговых точках.

2. Разработка сайта

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

3. Разработка мобильного приложения

Приложение, созданное на основе обновленного брендбука, включает:

— Каталог товаров.

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

— Отображение акций и специальных предложений.

— Карту с расположением торговых точек.

4. Технические особенности

— Приложение разработано на React Native для обеспечения кроссплатформенности и оптимизации производительности.

Таким образом, обновленный сайт и мобильное приложение способствуют укреплению связи с клиентами и повышению их лояльности.

Чтобы увязать сайт и приложение между собой, а заодно связать оба ресурса единым механизмом формирования акций, мы предусмотрели три интеграции:

1. Интеграция с 1С — для сайта и для приложения используется одна админка на «Битриксе». Из 1С мы забираем товары и цены и храним всё это в собственной базе данных, которая обновляется раз в сутки.

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

3. Интеграция с Hotmaps — сервисом, который отдаёт в приложение данные о всех торговых точках сети.

Как мы шутили в студии, вспоминая известный мем про рыбов, сайт «Русского аппетита» имеет каталог блюд с ценами, но на продаёт их — а только показывает.

Почему так? У компании средний чек за счёт демократичной цены блюд очень небольшой — а значит, доставка получается неоправданной, поэтому на сайте нельзя ничего купить. Вместо этого можно определиться с выбором в каталоге на сайте, прийти в ближайшую из 570 торговых точек и оформить заказ (либо заказать еду через подрядчиков: Яндекс. Едой и Маркет Деливери).

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

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

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

Мобильное приложение создавалось под обновленный брендбук компании: сочные и яркие цвета подчеркивают направленность приложения на заказ еды. Изначально предполагалось, что через приложение можно будет сделать заказ с возможностью оплаты картой или на кассе в киоске по предъявлению QR-кода. Но пока не реализована бизнес-логика по передаче заказов из точек в 1С заказчика, в приложении доступна лишь часть функций.

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

После нескольких спринтов в приложении уже можно было посмотреть:

— каталог товаров, актуальный для каждого города;

— сторисы с актуальными акциями и специальными приложениями;

— расположение торговых точек сети и время их работы;

— историю своих заказов и начисления бонусных баллов, баланс бонусов;

— QR-код участника бонусной программы.

QR-код — одна из самых главных возможностей приложения: его нужно показывать при покупке товаров в киосках, чтобы начислялись бонусные баллы, которыми можно оплатить до 30% чека, и получать специальные предложения.

Бонусная программа — важная часть бизнес-логики заказчика, которая имеет большое значение в удержании и привлечении новых клиентов. Кроме покупок, бонусные баллы можно заработать в приложении, если оценивать товары из своих заказов: за каждую оценку пользователь получает от 2 до 5 баллов.

Оценка разделена не только по товарам и торговым точкам, но и по логике: товары «живут» в 1С, а их оценки и торговые точки — в Mindbox, а выводится всё на одном экране. За оценки пользователь получает бонусы из Mindbox, которыми частично можно расплачиваться за бургеры и другую еду.

Приложение собирали на React Native, что позволило сделать его кроссплатформенным: оно доступно для Android, iOS и Huawei. Кроме того, при разработке мы использовали готовые компоненты, что позволило значительно снизить затраты на создание приложения.

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

Также мы добавили системы аналитики: Firebase и App metrica, с которыми заказчик сможет:

— получать статистику по приложению в режиме реального времени;

— видеть проблемы и некорректную работу приложения на разных устройствах;

— отправлять пуш-сообщения, сгенерированные в Mindbox, на устройства пользователей.

Установить App metrica для сбора статистики в приложении оказалось сложнее, чем мы думали: оказалось, что «Яндекс» уже три года не поддерживает модуль для React Native. Пришлось искать варианты: от «использовать чьи-то форки», до «написать своё». В итоге пришли к гибридному решению.

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

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

За время спринта по созданию акций мы трижды меняли варианты реализации. В итоге остановились на том, что акции мы всё-таки получаем из Mindbox, хотя изначально были варианты с Битриксом: они отпали, когда выяснилось, что у каждого пользователя могут быть свои акции, а какие — знает только Mindbox.

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

Среди акций есть динамические: например, «6-ой кофе за 1 рубль» — приложение учитывает каждую купленную пользователем чашку и сообщает, когда можно выпить бонусный кофе за символическую цену.

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

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

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

Проект развивается. Работаем по Scrum. На текущий момент (февраль 2025) получается 1-2 спринта в месяц.

Например, в 2024 заказчик решил провести большой розыгрыш призов и разыграть среди участников поездки в Сочи, Калининград и на Северный Кавказ и 300+ других подарков. Для этого мы заранее:

— собрали отдельную посадочную страницу на сайте;

— добавили к приложению дополнительные метрики;

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

Почти 80 тысяч человек в AppStore и примерно столько же — в Google Play установили приложение спустя неделю после релиза. Это 70% активных пользователей сети «Русский аппетит».