Создание федерального сайта доставки сети ресторанов «Перчини»
Заказчик: Ресторатор Франчайзинг Груп, г. Новосибирск.
Задача: Быстроразвивающаяся сеть итальянских ресторанов «Перчини» запускает новый формат – доставка блюд на дом. Планы грандиозные, один из пунктов – федеральный сайт доставки еды на дом с последующей двухсторонней интеграцией с их внутренней системой. Этот проект доверили разрабатывать Riva Siberia.
Содержание кейса:
Сбор информации
«Адаптив» всему голова
Дизайн сайта
техническая реализация сайта
Интеграция по протоколу SOAP
Настройка точки доступа
Сбор информации
Это уже не первый проект (уверены, что не последний), разработанный нами для Заказчика. Поэтому работа протекает комфортно, все работают единой командой на достижение поставленной цели. Правда сроки (по традиции :) сжатые.
Заказчик рисует от руки свое видение страниц сайта. Выделяет несколько подобных проектов, отмечает что нравится, что должно быть обязательно, а над чем стоит подумать и прочие детали. При личной встрече обговариваем все основные моменты по проекту, подводные камни. Далее специалисты Riva Siberia прорабатывают более детально структуру страниц сайта, вносят корректировки в проект с учетом правильной организации технической реализации и юзабилити сайта.
Итогом совместной работы становятся детальные прототипы сайта:
«Адаптив» всему голова
Обязательный момент – «адаптивность» сайта, то есть сайт должен одинаково хорошо показываться на разных разрешениях экрана. Нужно понимать, что это достаточно сложный по функционалу и реализации сайт, сайт постоянно обновляется и дорабатывается - поэтому адаптивность увеличивает нагрузку на дальнейшую техническую поддержку сайта.
Основываясь на нашем богатом опыте, решено использовать «смешанный тип» адаптивности: одна версия сайта от широкоформатного экрана до планшета, и мобильная версия для смартфонов. При этом убиваем 2-х зайцев: контент подстраивается под ширину экрана, но при этом сайт остается гибким к нововведениям и отлично смотрится на любом экране.
Дизайн сайта
Дизайн для основных страниц сайта разрабатывается Заказчиком. Поэтому для дизайнера, помимо прототипов страниц, подготавливаются рекомендации, проговариваются ограничения по размерам (высота шапки, размеры блоков и пр.) с учетом особенностей адаптивного дизайна.
В итоге получается весьма приятный и удобный дизайн:
Дизайн для мобильной версии сайта прорабатывается специалистами Riva Siberia:
Техническая реализация сайта
На этапе HTML верстки не возникает особых трудностей, так как многие моменты учтены еще на этапе проектирования.
Для создания сайта выбирается фреймворк MV (тот же CMF http://mv-framework.ru/cmf/ ) по нескольким причинам: у нас хороший и положительный опыт в работе с фреймворком, с его помощью удается воплотить в реальность практически любой «каприз» Заказчика. И еще огромный плюс фреймворка - у него автоматически генерируется административная панель для удобства управления и наполнения сайта.
Так как товарная база первоначально заводится именно на сайте, поэтому удобству работы с административной панелью уделяется особое внимание. Далее товарная база (наименования, цены, дополнительные ингредиенты) с сайта транслируется во внутреннюю систему ресторанов «Перчини» по протоколу SOAP, оттуда уже информация уходит в систему 1С.
Особенности работы сайта:
- Сайт работает в различных городах России.
- В разных городах может быть разное меню, разные цены на блюда и на их комбинации (SKU).
- Блюдо может дополняться комбинациями (SKU), например, можно выбрать вид пасты, добавить лепешку к супу:
- Но и это еще не все: к некоторым видам пиццы и пасты можно добавить дополнительные ингредиенты:
При этом в зависимости от выбора цена может измениться. - Все это еще предстоит передать по SOAP
Как это все выглядит в системе управления сайтом? Все очень просто и удобно: при создании нового блюда добавляем его комбинации (SKU), при этом указываем какая связка нас интересует, а именно «город+паста», далее назначаем цену:
Все нужные варианты (Кармари, Папарделле и пр.) и список комбинаций можно быстро изменить / добавить / удалить в системе управления сайтом.
При выводе списка блюд можно легко отметить блюда, к которым можно заказать дополнительные ингредиенты. А в режиме быстрого редактирования можно изменить текстовую информацию у списка блюд за считанные секунды:
Интеграция по протоколу SOAP
Одним из последних этапов разработки сайта для службы доставки ресторанов «Перчини» становится интеграция с их внутренней системой. Система устанавливается в ресторанах и call-центрах.
Задачи двухсторонней интеграции:
- Передача и обновление товарной базы с сайта в систему;
- Передача заказов с сайта в систему;
- Передача контактной информации клиентов с сайта в систему;
- Скачивание и обновление справочников с системы на сайт (города, улицы и пр.).
Основная особенность SOAP в длительной настройке передачи данных с сайта в систему. Например, при передаче заказа требуется каждый раз проверять и создавать отдельно клиента, отдельно его адрес, и отдельно заказ.
Далее разрабатываем передачу довольно сложной в организации базы блюд в систему. На данном этапе структура файла передачи претерпевает некоторые изменения для упрощения обработки данных разработчикам системы. На это уходит чуть больше времени, чем мы рассчитывали, но, тем не менее, благодаря слаженной работе наших специалистов и разработчиков системы все удается успешно настроить и запустить проект.
Настройка точки доступа HotSpot
По завершению всех работ по сайту, потребовалось обновить дизайн текущего решения HotSpot для ресторанов «Перчини».
Хот-спот (от англ. hot spot — «горячая точка») — участок местности (например, помещение офиса, ресторана), где при помощи портативного устройства (ноутбука, смартфона), оснащённого устройством радиодоступа по протоколу Wi-Fi, можно получить доступ к информационным сетям (интернету, интранету). Так, многие кафе делают бесплатные хот-споты для доступа к интернету с целью привлечения посетителей и как дополнительный сервис. Материал взят с Wikipedia.
Все кажется просто и прозрачно – с нас требуется HTML верстка готового дизайна. Но, в последствии, выясняется, что не все так однозначно - помимо самого дизайна нужно донастроить его работу на устройстве Mikrotik. Так как до этого мы ни с чем подобным не сталкивались, приходится работать практически «в слепую»: дизайн и верстка подгоняется под уже рабочую систему и методом проб и ошибок приходит понимание что работает, а что нужно изменить.
В результате, все посетители ресторанов «Перчини» наслаждаются обновленным дизайном и заманчивым предложением от ресторана:
Следующим этапом стало создание мобильного приложения для Android и iPhone.
Отзыв клиента
Екатерина Фатнева
Бренд менеджер концепции Фаст-Фуд
Хочется отметить несколько важных и позитивных моментов в работе:
- понимание того, что мы хотим происходит с полуслова. Это колоссально помогает в работе.
- делают все точно в оговоренный срок (такое сейчас большая редкость!)
- дельные советы: ребята профи, учат нас и подсказывают в сложных моментах.
- классная админка в управлении сайтом: все просто, понятно и удобно, быстро грузится.
- ценовая политика: не задирают цены, все адекватно оценивают и составляют понятные сметы.
- Спасибо вам команда Рива за сотрудничество! Надеюсь, что мы так и дальше будем продуктивно работать с вами!