1. Задача и исходные данные
У заведения не было сайта вообще: ассортимент жил в паблике, цены обновлялись вручную, а заказы собирались в мессенджерах. Это значило две проблемы. Первая — заказать можно было только в рабочие часы, и в пиковое время сообщения терялись. Вторая — агрегаторы доставки забирали до 30% выручки и прятали клиента: человек возвращался в приложение, а не в «Шаурманию».
Сформулировали пять ключевых целей:
- Своё меню на сайте — вместо картинок в соцсетях, с составом, весом и ценой у каждой позиции.
- Корзина с модификаторами — размер, добавки и соусы собираются прямо в карточке блюда.
- Оформление без звонка — заказ уходит на кухню сразу, а не через «а когда заберете?».
- Возврат клиента — блок с отзывами, контакты и бонусная программа за каждую покупку.
- Мобильный сценарий — заказ оформляется с телефона за минуту, по дороге.
Меню фастфуда — это не список блюд, а конструктор: одно и то же блюдо бывает в двух размерах, плюс шесть добавок с разной ценой, плюс выбор соуса. Без правильной модели модификаторов в корзину попадают несравнимые комбинации, а заказы «Мини без всего» и «Классика вдвое» считаются по одной цене.
2. Структура меню
Меню разложили на пять разделов, чтобы человек собирал заказ по привычной логике, а не по внутренней кухонной структуре.
- Шаурма — классика, мини, много мяса, вегетарианская, хот-дог в лаваше, острый мексиканец, сырный итальянец, сытный русский, курочка терияки, сладкая с клюквой и клубникой.
- Не шаурма — наггетсы, картошка фри и ланч-боксы с наггетсами и морсом.
- Дополнительно — халапеньо, моцарелла, жареный и маринованный лук, жареные грибочки, дополнительная порция мяса.
- Соусы — фирменный, сырный, горчичный, чесночный, терияки, клюквенный.
- Напитки — чай, ягодный чай, глинтвейн, сбитень, кофе 3в1, эспрессо, американо, латте, капучино, морс, газировка, вода.
Каждый раздел линкуется из шапки, из подвала и с главной страницы плитками-коллажами. Длинные списки разбиты на страницы, но основные категории всегда открыты в один клик.
3. Подбор по фильтрам
В меню есть четыре подборки, которые решают типовые вопросы гостя: что взять подешевле, что без мяса, где побольше начинки и что нового. Фильтры работают поверх любого раздела и не прячут состав блюда — видно и позицию, и её цену.
- Выгодно — позиции с минимальной ценой, для обеда и большой компании.
- Для вегетарианцев — вегетарианская шаурма, картошка фри, чай и морс без мяса.
- Много мяса — двойная порция курочки и блюда от 400 грамм.
- Новинки — свежие позиции, которые меняют в меню.
4. Карточка блюда
Карточка отвечает на вопрос «что внутри» ещё до заказа. У «Классики» сразу видно состав: лаваш, курочка гриль, картофельная соломка, капуста, морковь, томаты, маринованные огурчики, фирменный соус и вес 350 грамм. Гость видит, за что платит, и не удивляется размеру рулона на выдаче.
Цена на карточке пересчитывается на лету: базовая стоимость блюда плюс выбранные добавки. Стоимость указана «от» — потому что она зависит от размера и дополнений, и это честнее, чем одно число, которое перестаёт совпадать с чеком.
5. Размеры и дополнительные опции
Сделали карточку конструктором. У каждой шаурмы два размера — маленькая и средняя, и шесть добавок: острый перчик халапеньо (30 ₽), сыр моцарелла (30 ₽), жареный лук (30 ₽), маринованный лук (25 ₽), жареные грибочки (50 ₽) и дополнительная порция мяса (70 ₽). Один и тот же продукт в каталоге и в корзине, поэтому добавки не расходятся с меню и не требуют ручной правки прайса.
Бонус — блок «Также заказывают» на странице блюда. Он собирает похожие позиции (классика, мини, много мяса, вегетарианская) и поднимает средний чек: гость докупает вторую шаурму, а не уходит.
PHP · MySQL · каталог блюд с модификаторами и размерами · корзина на сессиях · онлайн-оформление заказа · пагинация разделов · ЧПУ · Schema.org (Restaurant, Menu, Offer)
6. Корзина и оформление заказа
Корзина живёт в шапке и показывает счётчик позиций — гость всегда видит, что уже выбрал, не теряя раздел каталога. Счётчик обновляется мгновенно, без перезагрузки страницы, а оформление ведёт на отдельную страницу, где видно состав заказа, итоговую сумму и форму с именем, телефоном и адресом доставки.
Пустая корзина — это не тупик: на странице оформления есть ссылка обратно в меню, чтобы человек не остался на белом экране. Дальше заказ уходит на кухню, а менеджеру приходит уведомление с составом — собирать его вручную по переписке больше не нужно.
7. Бонусы, отзывы и контакты
Локальный бизнес живёт на повторных заказах, поэтому на главной вынесли три аргумента доверия: свежая шаурма только с плиты, сотни довольных клиентов с отзывами и бонусная программа с начислением баллов от каждой покупки. Счётчик в корзине показывает накопленное, и гость видит, что возвращаться выгодно.
Контакты — телефон 8 (908) 029-10-00 и адрес на Чкалова, 74 в Рыбинске — стоят в шапке, в подвале и в подвале каждой страницы каталога. Рядом ссылки на ВК и Instagram заведения, чтобы привычный канал остался доступным, но заказывать можно было не выходя из сайта.
8. Формы и заявки
Кроме корзины на сайте есть форма обратного звонка: имя, телефон, сообщение и согласие на обработку персональных данных. Она доступна с любой страницы и закрывает запросы, которые не конвертируются в заказ, — например, вопрос про самовывоз или большой корпоративный заказ.
Плюс юридический слой: cookie-баннер со ссылками на политику конфиденциальности и публичную оферту в PDF. Для общепита это не формальность, а часть доверия к онлайн-заказу.
Нужен такой же формат заказа?
Соберём меню с модификаторами, корзиной и приёмом заказов прямо на кухню.
9. Дизайн и адаптив
Дизайн сделали под формат заказа, а не под красоту: крупные аппетитные фотографии блюд одинакового размера, короткие названия, цена и кнопка «Выбрать» на одном уровне — три элемента, которые сравнивают между собой. На главной — слайдер с фотографиями свежей выдачи и плитки разделов меню коллажами, чтобы переход в каталог был в один клик.
Мобильная версия приоритетна: заказывают с телефона, часто на ходу. Меню открывается боковой панелью, карточки идут в одну колонку, корзина закреплена так, чтобы её видно было при прокрутке каталога. Меню в один тап — с телефона или с планшета.
10. SEO и запуск
Для локального заведения SEO решает задачу географии: человек ищет «шаурма Рыбинск» или «доставка шаурмы на Чкалова» и должен попасть на сайт, а не в карточку агрегатора. Сделали ЧПУ-адреса для разделов и блюд (/menu/shaurma/shaurma-standart.html), микроразметку Schema.org (Restaurant, Menu, Offer) с телефоном и адресом, и полноценные тексты на страницах, а не только фото.
Подключены Яндекс.Метрика и вебвизор, карта и точки навигации в контактах, ссылки на соцсети. Меню обновляется из панели: новая позиция появляется в каталоге сразу, без правки кода, и индексируется поисковиками автоматически.
Результаты
Что это дало бизнесу:
- заказ оформляется онлайн — звонок перестал быть единственным каналом продаж;
- заказы приходят на кухню с составом, добавками и размерами, а не с перепиской по телефону;
- комиссия агрегаторов перестала быть единственным способом продавать в городе;
- бонусная программа и блок отзывов работают на повторные заказы, а не на разовые визиты;
- меню редактируется из панели: новинки и цены обновляются без разработчика.
Проект запущен и работает: меню обновляется, заказы принимаются онлайн, заявки приходят в CRM и в мессенджеры. Сайт стал витриной заведения и источником повторных заказов.