BBQ Kitchen
Сайт ресторанав разработке
Два зала в Москве, меню из базы, галерея и бронь: гость выбирает дату, время, число гостей и конкретный стол на схеме. Персонал ведёт брони и подачу в своей консоли.
- 91
- позиция меню в 13 разделах
- 12
- столов на схеме зала в трёх зонах
- 2
- зала с адресами и картами
- 6
- экранов в консоли зала
Сайт снят с показа на время доработки — здесь ролик, экраны и структура.
Задача
Что нужно было сделать
Задача
Гость должен за минуту найти меню и забронировать стол без звонка. Администратор должен видеть брони, стол и предзаказ в одном месте, а не в переписке.
Для кого
Гость, который выбирает, где поужинать: смотрит еду, цены и адрес с телефона, часто по дороге. И администратор зала, которому нужно знать, кто придёт, когда и что заказал.
Путь
Путь человека на сайте
- Гость открывает меню
Полоса хитов с фотографиями, ниже все разделы одной лентой. Поиск находит блюдо по названию и описанию.
- Выбирает время и стол
Дата, слот посадки, число гостей — и схема зала: занятые и слишком маленькие столы не выбираются.
- Отмечает блюда заранее
Предзаказ по желанию: сумму считает сервер по ценам из базы, гость видит её в сводке.
- Смена видит бронь в консоли
Сводка дня, схема 12 столов, статусы брони, очередь подачи по стадиям и база гостей.
Экраны
Как это выглядит
Структура
Из чего состоит сайт
BBQ Kitchen7 страниц
Главная
- Первый экран с роликом гриля и логотипом
- Адреса двух залов и часы работы
- Кнопка брони стола
- Ссылки на меню, галерею, контакты и телефон
Меню
- Что берут чаще всего: пять блюд с фото
- Поиск блюда и оглавление разделов
- Разделы меню с ценами и метками «хит», «новинка», «вег»
- Деловые обеды
- Меню в оригинале: сканы бумажного меню
Бронь стола
- Выбор зала: Суворовская или Кожуховская
- Дата и время посадки
- Число гостей
- Стол на схеме зала
- Блюда заранее, по желанию
- Контакты и сводка брони
Галерея
- Крупным планом: фото залов и блюд
- Просмотр фото крупно
- Бронь и меню
Контакты
- Суворовская, 5: телефон, часы, оценка, карта
- 7-я Кожуховская, 9: телефон, часы, оценка, карта
- Позвонить или написать
О ресторане
- Как здесь готовят
- Угли, хоспер, решётка
- Всё, что можно приготовить на углях
- Стол или меню
Консоль зала (для персонала)
- Вход по логину
- Сводка дня
- Зал: схема столов
- Брони
- Подача блюд
- Меню: фото разделов
- Гости
- Стол на схеме зала
- Выбор зала
- Предзаказ блюд
- Поиск по меню
- Деловые обеды
- Консоль зала
Работа
Что сделали
Все разделы одной лентой, липкое оглавление, поиск по блюдам. Разметка вшита в страницу: меню видно без API и его индексирует поиск.
Дата → время → гости → стол на схеме. Двойную бронь на один стол ловит транзакция в базе.
Сводка дня, схема на 12 столов, брони со статусами, очередь подачи и база гостей.
Чистый HTML, CSS и JavaScript: страницы отдаются за сотни миллисекунд, прокрутка родная.
- Меню и цены из базыправятся в панели, на сайте меняются сразу
- Поиск по блюдампо названию, описанию, разделу и меткам
- Галереянастоящие фотографии залов и блюд
- Контактыдва адреса, карты, часы, средний чек
- Бронь со схемой зала4×3 стола, зоны и вместимость
- Предзаказблюда заранее, сумму считает сервер
- Консоль залаподача: ожидает → принято → готовится → готово → подано
- Брони в базесразу видны в консоли зала
- Node.js
- Express 5
- SQLite
- Vanilla JS
- Caddy + HTTPS
Концепт сайта для действующего ресторана, собранный студией по открытым данным. Официальным сайтом заведения не является; цены в меню черновые.