Hite BBQ: новая система оформления заказа и обновленный сайт для сети корейского барбекю №1 в Москве

Рестораны Hite BBQ входят в топ корейских заведений Москвы. Это место с характерной домашней атмосферой и особенным уютом, куда семьями приходят ценители настоящей корейской кухни.

Несмотря на лидерство ресторана в офлайне, сайт Hite BBQ сильно проигрывал конкурентам в онлайне. Устаревший UI, сложный каталог блюд и неудобное оформление доставки не соответствовали уровню заведения. Поэтому коллеги из Hite BBQ обратились к Oxem за помощью — организовать удобный процесс заказа блюд, обновить дизайн и сделать сайт соответствующим статусу топового ресторана корейской кухни Москвы.

Для того, чтобы вывести сайт на новый уровень и превратить его в удобный интернет-магазин, мы сделали следующее:

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

➕ Полностью переработали путь пользователя: упростили каталог и сделали понятные карточки блюд. Теперь процесс выбора еды стал простым и занимает буквально несколько шагов.

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

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

➕ Интегрировали сайт с 1С-Битрикс и системой управления ресторанами iiko.

➕ Сделали абсолютно новый дизайн: использовали теплые тона, мягкие формы, крупные элементы. Теперь сайт полностью соответствует общей концепции заведения, его домашней атмосфере — это своего рода «теплый премиум» и подчеркнутая аутентичность.

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

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

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

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

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

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

Для полноты картины мы изучили сервисы конкурентов: сайты схожие по семантике и тематике, сайты ресторанов в Корее.

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

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

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

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

Используя новую структуру и собранные идеи, разработали первый прототип сайта.

Надо сказать, что коллеги из Hite BBQ активно участвовали в работе, обсуждали идеи и концепцию — и благодаря такой синергии мы очень быстро провели этап аналитики, а предложенные нами прототипы сайта были приняты без единого замечания! Коллегам очень понравились предложенные идеи, они загорелись дальнейшей реализацией и все последующие шаги мы делали также в тесном сотрудничестве с ними.

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

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

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

• Перейти в карточку товара;

• Положить товар в корзину;

• Затем проделать еще несколько шагов оформления.

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

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

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

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

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

В них разместили карусель с фото, состав блюда, доступные добавки, пищевую ценность и степень остроты блюд (что особенно актуально для корейской кухни). Здесь пользователь может изменить специфические ингредиенты, такие как лук, чеснок, перец или кунжут, или снизить степень остроты блюда.

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

Также при оформлении заказа можно выяснить, доставляет ли Hite BBQ на конкретный адрес, выбрать удобное время доставки и способ оплаты (курьеру или на сайте), оплатить часть заказа бонусами или применить промокоды.

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

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

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

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

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

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

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

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

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

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

Мы использовали в дизайне крупные, понятны элементы, мягкие округлые формы, теплые оттенки.

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

В контентных страницах добавили тематические фото интерьеров ресторана и блюд, сделали легкую анимацию.

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

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

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

Фронтенд сайта мы реализовали на React, а на бэкенде использовали 1С-Битрикс в связке с системой управления ресторанами iiko, это ключевая ИТ-система клиента, в ней хранится вся информация о блюдах.

Для того, чтобы красиво выводить информацию из каталога в iiko на сайте, а затем правильно передавать в iiko заказы, мы проделали несколько интеграций и написали собственное API для 1С-Битрикс.

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

Вот что мы сделали:

✔️ Интегрировали iiko с 1С-Битрикс с помощью готового модуля. Он забирает из базы данных блюда с полным описанием и модификаторами (это те самые ингредиенты), переводит их в вид, понятный Битриксу — так формируется каталог блюд.

✔️ Затем мы используем собственное API, чтобы красиво показать на сайте каталог блюд и дать возможность положить их в корзину.

✔️ После того, как покупатель выбрал блюда и указал нужные ингредиенты, корзина заказа передается по API в 1С-Битрикс, а оттуда с помощью модуля обратно в iiko. Там заказ попадает к менеджерам, которые выполняют его.

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

РЕЗУЛЬТАТЫ В ЦИФРАХ

✔️ Конверсия сайта выросла на 0,35%: с 1,68% до 2,03% — это значимый результат в отрасли, достигнутый всего за несколько месяцев.

✔️ Время, которое посетители проводят на сайте, выросло на 17%.

✔️ Время загрузки сайта сократилось на 52%. Сайт Hite BBQ загружается всего 300 мс — это быстрее, чем сайты мировых HoReCa-лидеров вроде Dominos Pizza (600 мс), McDonalds (800 мс) и Delivery Club (900 мс).

Новый сайт Hite BBQ соответствует статусу топовой сети корейских ресторанов Москвы.

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

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

➕ Создали соответствующий статусу ресторанов дизайн: теплый, домашний, но в тоже время 100% премиальный.

Клиенту очень понравился сайт: он настолько запал коллегам в душу, что дизайн был согласован вообще без правок!