КемГуру

Разработали сервис доставки еды, где можно заказывать блюда одновременно из нескольких ресторанов на разные адреса и даты.

О клиенте

КемГуру — это служба доставки сети кемеровских ресторанов ResStar. Особенность сети в том, что у каждого ресторана своя специализация: здесь можно найти самую разнообразную кухню, от русской, итальянской и японской до ирландской или немецкой.

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

Ситуация

Заказы могут быть как простыми, так и составными. Например, ситуация в пределах одного дня: вы заказываете обед коллегам в офис. Половина хочет пиццу, другая — роллы из «Сильвер — Япония». Суровый технический директор говорит, что не против медальонов из говяжьей голени, они особенно хороши в «Забое». При этом у него скоро встреча, так что доставку лучше сделать не как всем, а к 16:00, чтобы блюдо не успело остыть. Пока вы записываете заявки, вспоминаете, что сегодня никак не успеваете заехать за тортом ко дню рождения сына — так что к вечеру вам нужна доставка его любимого чизкейка «Мюнхен» на домашний адрес. Вы доходите до самого конца цепочки оформления заказа, как вдруг один из коллег решает добавить к своим роллам еще и шоколадные, на десерт, из того же ресторана.

Посмотрим, как с таким заказом справится новый «КемГуру», а заодно расскажем все о проекте.

Проектирование и дизайн

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

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

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

Реализация

Заказ происходит в два этапа. На первом пользователь просто добавляет блюда в корзину.

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

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

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

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

Технологии

КемГуру — это проект, которых продолжает развиваться после релиза. В таких ситуациях критически важно упростить работу технической команде.

Vue.js для оформления заказа

У корзины и оформления заказа очень много состояний и сложная логика работы интерфейса. Чтобы все работало плавно и рассчитывалось быстро, мы использовали Vue.js. 

В итоге мы добились того, что всей логикой приложения можно управлять с помощью одного JS-файла, не нужно запрашивать весь HTML на пару тысяч строк кода при каждом движении пользователя. Конечно, у Vue есть свои минусы — например, если на jQuery код может писать даже джуниор, то здесь нужен более компетентный специалист с глубокими знаниями JavaScript и умением строить системы.

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

Результаты

Сайт только-только запустился, а у нас на очереди двусторонняя интеграция с R-Keeper и личный кабинет — эти функции запланировали сделать сразу после релиза.

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

Заказы принимают здесь: