Разработка сайта заказа еды для кулинарии-кондитерской «Баранкин»: как перевести в онлайн продажу готовых блюд и заказных тортов

О клиенте

Кулинария-кондитерская «Баранкин» работает с 2014 года. У компании 12 филиалов в Воронеже, где можно перекусить, взять готовую еду на вынос, купить десерты на витрине или сделать индивидуальный заказ. Производство работает круглосуточно, меню обновляется каждый месяц.

Проблемы клиента

• Устаревший сайт без возможности онлайн-оплаты и оформления доставки. 
• Продажи готовой еды через интернет шли не напрямую, а через платный сервис доставки Restik (стоимость в год — 15-23 тысячи рублей).
• Комиссия агрегаторов Яндекс.Еда, Delivery Club, Сбер Маркет доходила до 37%, что снижало маржинальность производства.
• При работе с курьерскими службами и сервисами доставки еды сотрудники вручную вносили данные об остатках и продажах в каждую систему отдельно.
• Заказы поступали в разные каналы: по телефону, электронной почте и в Telegram (куда они попадали с сайта и Restik), а также в 3 приложения агрегаторов.
• Онлайн-заказы из внешних сервисов не синхронизировались с R-keeper, управлять стоп-листом и меню приходилось вручную, иногда не успевали выключать позиции.

Ситуация до сотрудничества с Вебфлай

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

Покупатель заходил на старую страницу, по кнопке «Доставка еды» попадал в Restik, далее нажимал «Заказать еду», после чего открывалось меню «Баранкин». Оформленный таким образом интернет-заказ приходил на email и в Telegram кулинарии. Затем сотрудник вручную вносил эти заявки в R-keeper и создавал столы. Аналогично фиксировали заявки из агрегаторов.

Кулинария начала сотрудничать со службами доставки Яндекс.Еда, Delivery Club и СберМаркет. Сервисы брали до 37% комиссии от стоимости заказов, что снижало доходность производства. 

Кроме того, администраторам приходилось работать в 3-х разных приложениях агрегаторов: отслеживать заявки, обновлять позиции. Например, данные по остаткам брали в R-keeper и вручную обновляли на каждой платформе. Если менялось меню, добавлялись новые блюда, то у сотрудников уходило полдня, чтобы заполнить информацию по всем торговым точкам только в одном сервисе.

Цели клиента

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

Начало сотрудничества

«Баранкин» узнали про Вебфлай по «сарафанному радио». В 2021 году компания проводила тендер среди разработчиков и пригласила нас принять участие. Мы предложили создать веб-сервис с личным кабинетом, который объединит несколько внешних платформ; прошли отбор и начали работу над проектом в декабре 2021 года. Отдельным направлением стало внедрение Битрикс24 для фуд-ритейла.

Нужен новый сайт или доработка старого? Подробнее об услугах

Онлайн-сервис «Баранкин» создали на CMS 1С-Битрикс. Установили коробочную версию редакции «CRM+ интернет-магазин». На этой платформе мы разрабатываем b2b-порталы, интернет-магазины и сайты.

Чем Вебфлай помогли

Работа над проектом «Баранкин» состояла из 5 этапов: проектирование и прототипы, дизайн, вёрстка макетов, программирование функционала, интеграция с внешними сервисами: R-keeper, Битрикс24 и бонусной системой. Активная фаза разработки стартовала в июне 2022 года, покупателям открыли доступ к сервису в декабре.

Проектирование и прототипы

Дизайн сайта и личного кабинета

Цифровая дизайн-система (U-kit)

Составили список правил и рекомендаций по визуальному оформлению страниц и интерфейсов. В документе описали цвета, шрифты, элементы интерфейса, а также правила вёрстки новых страниц. С такой инструкцией проще создавать дополнительные разделы.

Дизайн страниц

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

Вёрстка макетов

Адаптировали онлайн-сервис для пользователей разных браузеров и устройств: ПК, планшет и смартфон. Например, при входе клиента со смартфона, внешний вид страницы подстраивается под ширину экрана, кнопки перемещаются в зону действия большого пальца. Проработать мобильную версию было важно, так как 75% трафика на «Баранкин» идёт со смартфонов.

Программирование онлайн-сервиса и личного кабинета

3 направления онлайн-заказов: доставка еды, индивидуальные торты и фуршетное меню

Доставка еды — это заказ готовых блюд домой или в офис.

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

Фуршетное меню — предзаказ банкетных блюд на мероприятия и торжества.

Для каждого направления реализовали свой сценарий оформления, настройка связана с воронкой доставки в Битрикс24.

Доставка готовых блюд

Настроили «быстрые» кнопки, чтобы покупатель мог сразу выбрать категорию блюда: салаты, гарниры, завтраки и так далее.

На детальной странице товара есть фото, вес и стоимость блюда. Позицию можно добавить в «Избранное». При нажатии на фото открывается описание продукта и дополнительная информация: срок и условия хранения, пищевая ценность.

В Корзине настроили ограничение по стоимости минимального заказа — от 500 рублей. Цена зависит от зоны доставки и праздничных дней. Также корзина подсказывает покупателю, на какую сумму добавить блюд, чтобы получить бесплатную доставку, — она доступна при заказе от 1000 рублей и выше. В зависимости от зоны также меняется сумма, после которой доставка станет бесплатной.

Торты на заказ

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

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

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

Личный кабинет и страница оформления заказа

На старте проекта мы предложили вариант регистрации и авторизации по звонку, но по запросу заказчика настроили подтверждение учетной записи по коду из sms. Отметим, чем больше клиентов и онлайн-покупок, тем выше чек на рассылку сообщений, — сейчас затраты «Баранкин» на sms-оповещение доходят до 50 тысяч рублей в месяц.

Когда клиент согласится, будем переводить его на авторизацию по номеру телефона (когда поступает входящий вызов и нужно вписать последние 4-6 цифр номера). Такое решение экономичнее в 12,5 раз: если sms стоит в среднем 4 рубля при платном отправителе, то авторизация по звонку — 32 копейки.

В Личном кабинете создали разделы:

• «Заказы» (текущие, выполненные, отмененные). Здесь отображаются и покупки готовой еды и стандартных тортов. Заказ можно повторить или отменить в один клик.
• «Избранное», куда можно добавить любимые блюда.
• «Мои данные», где пользователь вносит Ф.И.О, дату рождения, email и номер телефона, а также отслеживает количество бонусов.
• «Мои адреса», здесь автоматически появляются точки, в которые клиент заказывал доставку.

Базовая SEO-оптимизация

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

Для высококонкурентных запросов типа «Заказ еды ...», «Доставка еды...» недостаточно базовой оптимизации и нужны дополнительные ежемесячные работы по SEO продвижению для выхода в Топ-10.