Кейс «Краснодарский парень»

Заказчик: Сеть крафтовых бургерных «Краснодарский парень» — 28 работающих филиалов, еще 8 на стадии строительства. 

Задача: Разработать сайт и мобильное приложение, которые можно масштабировать под растущий бизнес.

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

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

• Разработать современный сайт и мобильное приложение для крупной сети бургерных.
• Создать аккуратный дизайн, опираясь на фирменный стиль компании: сдержанные цвета, шрифты, красивые фото бургеров.
• Соединить с новой разработкой корпоративного героя и сохранить атмосферу современной бургерной.
• Интегрировать сайт и приложение с iiko, системой лояльности, агрегаторами доставки.
• Поработать над юзабилити: продумать функционал, простоту и удобство использования.
• Сделать систему управления гибкой за счет интеграций и технических настроек.
• Вывести сеть бургерных «Краснодарский парень» на новый уровень развития.

Мы начали работу над проектом «Краснодарский парень» с аудита:

• составление плана работы 

• прототипирование проекта сайта и приложения

• дизайн сайта и приложения

Параллельно с аудитом взялись за разработку:

1. Создали панель управления и API системы 

2. По завершению согласовали дизайн и отправили его на верстку 

3. После верстки приступили к программной реализации сайта и приложения 

4. Интегрировали сайт и приложение со сторонними системами: iiko, системой лояльности, агрегаторами доставки.

Что интересного

• Приоритет делался на мобильное приложение. Были небольшие сложности при разработке главной страницы. Нужно было найти оптимальный размер для карточек товаров, чтобы информация была видна как на десктопе, так и меньших экранах (в адаптиве). Чтобы вывести эту оптимальную величину, мы увеличивали и уменьшали размер изображения, где-то сокращали расстояние между текстом и кнопкой, добавили в сетку еще один столбец. Методом проб и ошибок в какой-то момент попали в нужный размер. 

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

 

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

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

Основной стек технологий

Сайт: VUE js  бекенд symfony 

Приложение: Flutter