Как создать сайт для заказа еды: меню, корзина, время самовывоза и экран кухни

Сайт для заказа еды позволяет клиентам выбрать блюда из вашего меню, настроить позиции, выбрать время самовывоза или доставки, оплатить заказ и получить подтверждение. Кухня при этом видит каждый заказ на экране и отмечает его готовым. Чтобы создать такой сайт, нужны меню с опциями (размеры, добавки, «без лука»), корзина, которая правильно считает итог, временные слоты с лимитами, чтобы кухню не завалило, оплата картой и простая доска заказов для персонала. ИИ-конструктор может собрать всё это по понятному описанию. Основная сложность в деталях: часы работы, блюда, которых нет в наличии, лимиты заказов и то, что делать, если оплата прошла, а заказ не сохранился.

Что нужно сайту

Страницы

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

Данные

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

Права доступа

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

Решения и компромиссы

Самовывоз, доставка или оба варианта

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

Заказ «как можно скорее» или на время

Вариант «как можно скорее» легко предложить, но трудно выполнить в загруженный вечер. Слоты с лимитами, например не больше восьми заказов на 15-минутное окно, защищают кухню и задают понятные ожидания. При этом можно показывать «ближайшее свободное время: 18:45».

Оплата сразу или при получении

Онлайн-оплата снижает число неявок и ускоряет выдачу. Оплата при получении проще в реализации, но вызывает поддельные заказы. Большинство заведений принимает оплату картой сразу через защищённую платёжную форму, например Stripe Checkout; настройку описывает наше руководство по платежам. Чаевые, налоги и правила выдачи чеков зависят от страны, уточняйте местные требования.

Как заказы попадают на кухню

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

Первый промпт, который работает

Создай сайт онлайн-заказов для Casa Verde, тако-бара в Остине, штат Техас, только с самовывозом. Категории меню: Тако, Боулы, Гарниры, Напитки. У позиций есть опции: в тако выбирают начинку (курица, карнитас, грибы +$1), тортилью (кукурузная или пшеничная) и дополнительно добавки (гуакамоле +$1.50, сыр +$0.75); в боулах выбирают основу и начинку. Клиенты добавляют позиции в корзину, выбирают 15-минутный слот самовывоза в часы работы (вт–вс, 11:00–21:00, центральное время), вводят имя и телефон и видят итог с налогом с продаж 8.25%. Ограничь каждый слот 8 заказами и скрывай заполненные слоты. Заказы сохраняй в базе данных со статусами: новый, готовится, готов, выдан. Страница кухни (только после входа) показывает сегодняшние заказы по времени самовывоза, проигрывает звук при новом заказе и позволяет персоналу переводить заказы дальше. Страница владельца для редактирования меню, отметки блюд как «нет в наличии» и приостановки приёма заказов. Оплата картой будет позже, а пока заказы идут с оплатой при получении. Яркий, живой дизайн с приоритетом мобильных экранов и крупными кнопками.

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

Пошаговая сборка

1. Меню и опции. Сначала добейтесь правильной работы меню, групп опций и расчёта цен. Проверьте позицию со всеми комбинациями опций.
2. Корзина и оформление. Количество, комментарии, итоги, налог и выбор слота с учётом часов работы.
3. Сохранение заказа и подтверждение. Расчёт итога на сервере: никогда не доверяйте цене, которую отправил браузер, и покажите страницу подтверждения с номером заказа.
4. Доска для кухни. Живой список, звук нового заказа, кнопки смены статуса, крупный текст, который читается с метра.
5. Управление для владельца. Отметка «нет в наличии», приостановка приёма, лимиты слотов, часы работы.
6. Оплата в тестовом режиме. Отмечайте заказ оплаченным только тогда, когда платёжный сервис это подтвердил, и обработайте случай, когда оплата прошла, а заказ не сохранился.
7. Уведомления. Подтверждение по email или SMS и сообщение «готово к выдаче» через вашего провайдера. См. как добавить уведомления.
8. Мягкий запуск. Несколько дней работайте с персоналом и друзьями, следя за кухней так же внимательно, как за клиентской частью.

Частые ошибки

• Расчёт цены только в браузере. Её легко подменить. Пересчитывайте итог на сервере.
• Нет переключателя «нет в наличии». Последнюю порцию вы продадите пять раз.
• Нет лимитов на слоты. Загруженная пятница превращается в 40 заказов к 19:00.
• Информация об аллергенах отсутствует или устарела. Показывайте аллергены у каждой позиции и поддерживайте их в актуальном виде: во многих странах к этому строгие требования.
• Путаница с часовыми поясами. Храните время в UTC, показывайте в местном времени ресторана и проверяйте работу около полуночи и при переходе на летнее время.
• Планшет кухни уходит в спящий режим. Не давайте экрану погаснуть и проверьте, что новые заказы появляются без обновления страницы.

Когда лучше готовое решение

Если вам нужны новые клиенты в вашем районе, сервисы доставки приносят спрос, который трудно создать самостоятельно, но взамен они берут комиссию. Если у вас уже есть кассовая система, проверьте, есть ли в ней онлайн-заказы: заказы, которые сразу попадают в кассу и на принтер кухни, трудно превзойти.

Строить своё решение стоит, когда вы хотите принимать прямые заказы от постоянных клиентов без комиссии, когда процесс заказа должен подстраиваться под вашу работу (предзаказы для пекарни, кейтеринговые подносы, недельное меню для готовых обедов) или когда заказы связаны с программой лояльности или вашим сайтом. Руководство по сайту ресторана описывает остальную часть сайта.

Как это сделать в Mythex

В Mythex вы описываете процесс заказа в чате и видите его в живом превью, которое можно проверить во фрейме телефона. Заказы и меню хранятся в базе данных Postgres, которую агент добавляет, когда вы просите сохранять данные. Платежи картой работают через ваш аккаунт Stripe с ключами, которые хранятся как секреты проекта. Пример промпта есть в рецепте Stripe. SMS и email идут через вашего провайдера, так как у Mythex нет собственных платежей, email или SMS. Вебхуки платежей требуют, чтобы приложение было опубликовано по публичному адресу. Перед запуском откройте /test: агент пройдёт заказ в превью и сообщит, что сломалось.

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

Вопросы