Решение для сети стритфуда
Как сеть стритфуда выросла в заказах в 2 раза и осталась с тем же количеством операторов? Расскажем в этом кейсе.
Решение для сети стритфуда
Коротко о результатах и задачах
О проекте
JS
|
HTML
|
rabbitMQ
|
PHP
|
1C-Битрикс
-10
%
Расходов на Операторов, при увеличении количества заказов
2
x
Увеличение количества заказов
0
возвратов: пользователи перестали отказываться от заказов без предоплаты
Задачи и проблемы
Сайт был недостаточно функциональным
Неудобно управлять сайтом из админ-панели.
1
Большое количество незавершённых покупок из-за неудобной оплаты на сайте.
2
Для оформления заказа необходимо участие оператора.
3
Решение
Создать новый сайт и сократить участие оператора
Структура, которая увеличит трафик с поисковых систем.
1
Оформление и оплата заказа сразу на сайте.
2
Автоматическое определение района для расчёта доставки.
3
Сайт должен отвечать следующим критериям:
Удобная система администрирования.
4
Иван Ярославцев Руководитель компании
«Для нас важна отказоустойчивость и мы стараемся не допускать прерывания работы сайтов клиентов, особенно, если там есть ощутимое количество посетителей. Как и на других проектах мы сделали отдельные dev-сервера, где каждый разработчик вел разработку и stage-сервер, куда попадали результаты работы после тестирования, для демонстрации клиенту.
Только после тестирования и подтверждения клиентом, мы перенесли сайт на основной домен. Процедура произошла быстро, так как stage-сервер находился на том же хостинге.»
Покупатели оказались рады запуску нового сайта
Отзывы покупателей на Flamp
Детали проектирования
Создание структуры и прототипа сайта
Брифинг и поиск решения
Провели интервью с заказчиком
На выяснение основных проблем текущего сайта у нас было 3 дня.
Поэтому мы построили работу таким образом:
Провели аудит текущего сайта
Проанализировали конкурентов в выдаче
К следующей встрече у нас было готовое коммерческое предложение.
Подготовка SEO и структуры сайта
SEO-специалист проанализировал коммерческие факторы. Собрал семантическое ядро. То есть нашел ключевые запросы по которым можно привлечь аудиторию из поиска. На их основе подготовил структуру сайта. Также заранее прописал метаданные для каждой страницы: title, description, h1.
Составление семантического ядра и структуры сайта
Создание прототипа
На основе новой SEO-структуры дизайнер подготовил предварительную структуру каждой страницы. На это ушло 3 дня.
После согласования с клиентом дизайнер проработал детали прототипа. Все элементы и поведение интерфейса были описаны в сопроводительной спецификации.
Детали дизайна
Дизайн сайта
Общая концепция дизайна
Мы прекрасно понимали, что основная аудитория — эконом-сегмент. Поэтому в дизайне мы ориентировались на простоту и визуальную доступность продукта.
Дизайн главной страницы сайта
Карточка товара
Карточку товара сделали в поп-апе для удобного и быстрого взаимодействия. Это позволяет быстрее вернуться к выбору других блюд. В то же время плавающий блок с ценой и кнопкой всегда доступен для просмотра и принятия решения
Цена и кнопка «Добавить в корзину» закреплены внизу экрана
Раньше оператору приходилось уточнять какой соус потребуется продукту. На новой сайте пользовать может выбрать его сам.
Корзина и оформление заказа
В корзине мы сделали наглядные шаги для оформления заказа, чтобы ничего не отвлекало клиента от совершения заказа
Удобная панель оформления заказа
Заполнение информации о заказе
Для оформления заказа надо указать большое количество данных, поэтому мы разделили их на понятные и простые блоки, которые следуют друг за другом. Отработали поведение управляющих элементов.
Интерфейс заполнения данных о заказе
Расчёт доставки
Мы разработали для сайта систему расчёта времени и стоимости доставки в зависимости от адреса. Теперь клиенты могут видеть на карте районы, где работает доставка. В админ-панели администратор сайта может указать стоимость для каждого района.
Время и стоимость доставки рассчитать просто: достаточно указать свой адрес
Мобильная версия
Мы обновили и мобильную версию сайта. 80% покупателей компании приходят на сайт со смартфонов, поэтому мы постарались сделать процесс выбора товара и оформления заказа максимально удобным для них.
Детали разработки
Автоматизация и интеграция с сервисами
Упрощение и экономия средств с помощью интеграции
Для системы администрирования выбрали платформу 1С-Битрикс как наиболее удобную и интегрировали туда дизайн.
Автоматизиция работы интернет-магазина позволила сэкономить для компании 10% на расходы ФОТ. Для этого использовали интеграции с сервисами:
Iiko (айко)
Iiko (айко) – системы учета для ресторанов, кафе и точек питания. Она позволяет синхронизировать меню ресторана с сайтом.
SberPay
Система оплаты на SberPay, которая упрощает оплату заказа. Теперь покупатель может собрать заказ по номеру телефона, а оплату внести на сайте.
Определение района
Автоматическое определение района в корзине через сервис Dadata. Теперь стоимость и время доставки рассчитывается без участия оператора. Оставить заявку можно только в рабочее время, а бизнес-ланчи можно заказывать только в обеденное время.
сэкономили за счёт сокращения расходов на фот
%
10
Переезд и запуск сайта
QA-специалист подготовил тест-план, чтобы проверить работоспособность интернет-магазина. Проверили все функции и элементы сайта на всех устройствах и во всех браузерах. Протестировали скорость загрузки страниц и устойчивость к нагрузкам.
Тест-план и итоговая проверка сайта
После всех проверок сайт перенесли с stage-сервера на основной домен и хостинг клиента. В конце всех работ SEO-специалист проверил ещё раз сайт. Убедился, что все нужные страницы попали в индекс.
Итоги проекта
-10
%
0
Расходов на Операторов, при увеличении количества заказов
возвратов: пользователи перестали отказываться от заказов без предоплаты
2
x
Увеличение количества заказов
Достижения
Антон
Операционный директор
«Мы смогли перейти от формата киосков на остановках до качественного сервиса по доставке за счет нового дизайна»
Отзыв клиента
Покупатели оказались рады запуску нового сайта
Отзывы покупателей на Flamp
Презентация сайта на конференции Mind Bros Conf
Команда
Максим
Поиск решения и арт-дирекшн
Антон П.
Управление проектом
Пётр Г.
Дизайн
Пётр Л.
Дмитрий П.
Антон С.
Программирование, вёрстка
Программирование
Программирование
Николай
Антон Ч.
Дмитрий С.
Программирование, вёрстка
Программирование, вёрстка
SEO-продвижение
Вячеслав
Алексей
Тестирование
Тестирование