Меню для клиентов

Меню для клиентов - это публичная веб-страница по адресу handy.cafe/{your-slug}. Клиенты открывают ее, сканируя QR-код на своем столе. Эта страница описывает путь клиента от начала до конца, чтобы вы могли объяснить его персоналу и спланировать запуск.

Структура URL

У каждого стола есть уникальный URL вида handy.cafe/{cafe-slug}/{table-code}. В QR-коде закодирован этот адрес плюс краткоживущий токен, подтверждающий подлинность наклейки. Когда клиент сканирует QR:

1. На телефоне открывается URL в браузере по умолчанию.
2. Страница сопоставляет slug и код стола через облачное API.
3. Если стол находится в состоянии out_of_order, показывается уведомление о недоступности.
4. Если стол idle, страница сообщает, что персонал еще не посадил клиента, и просит обратиться за помощью.
5. Если стол in_use, страница запрашивает 6-значный код безопасности.

Проверка кода безопасности

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

После ввода кода:

1. API проверяет код по хэшированному значению, сохраненному для стола.
2. Если код верный, создается сеанс и возвращается токен.
3. Токен сохраняется в cookie (hc_menu_session). Резервный Bearer-токен также сохраняется в локальном хранилище устройства. Это необходимо на iPhone Safari, который в некоторых конфигурациях может блокировать сторонние cookie.
4. Клиент перенаправляется в меню.

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

Языки

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

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

Названия товаров, описания и ингредиенты не переводятся автоматически; они показываются на том языке, на котором вы их ввели в редакторе меню. Интерфейсные подписи вроде "Добавить в корзину", "Оформить заказ" и сообщения платежного потока полностью локализованы.

Тема

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

Фирменная шапка

Верхняя часть меню показывает:

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

Просмотр меню

Меню сгруппировано по категориям. Внутри категории товары показаны с миниатюрой, названием, коротким описанием и ценой.

При нажатии на товар открывается карточка товара. В ней показываются:

• Полное фото.
• Описание в Markdown.
• Строка ингредиентов.
• Метка времени приготовления (только если включен параметр Показывать время приготовления в меню).
• Подпись единицы измерения, если она задана, например "250 ml".
• Выбор вариантов для всех групп вариантов, прикрепленных к товару.
• Счетчик количества.
• Кнопка Добавить в корзину.

Обязательные группы вариантов блокируют кнопку Добавить в корзину, пока клиент не выберет значение.

Корзина

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

В корзине клиент может:

• Изменять количество у каждой строки.
• Удалять строку.
• Добавлять необязательную заметку.
• Указывать номер телефона (необязательно).

Подытог, НДС и итог показываются в реальном времени.

Оформление заказа

Шаг Оформить заказ предлагает один или два способа оплаты в зависимости от конфигурации:

Наличные

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

Онлайн (Stripe Checkout)

Если онлайн-оплата включена, появляется вариант Онлайн. После отправки:

1. Заказ создается в состоянии ожидания.
2. Возвращается client_secret Stripe Checkout.
3. Встроенный интерфейс Stripe открывается прямо на странице. Клиент вводит данные карты.
4. После успешной авторизации Stripe подтверждает списание, и заказ переходит в состояние paid.
5. Клиент видит страницу успеха.

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

Страница успеха

После успешной отправки клиент попадает на страницу чека, где показываются:

• Номер заказа и время.
• Каждая строка с количеством, вариантами и суммой по строке.
• Подытог, НДС и общая сумма.
• Способ оплаты.
• Значок статуса оплаты (pending для наличных; paid для онлайн).
• Кнопка "Оформить еще один заказ", которая возвращает в меню, сохраняя сеанс.
• Ссылка "Вернуться в меню".

Опрос статуса заказа

После отправки клиентский экран заказа опрашивает endpoint статуса, чтобы показывать обновления с кухни. Если персонал переводит позицию из preparing в ready, клиент видит, что значок у строки автоматически обновляется в течение нескольких секунд.

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

Что клиент не может делать

• Клиент не может просматривать меню без кода безопасности. Шаг проверки обязателен всегда.
• Клиент не может оформлять заказы для столов, которые находятся в состоянии idle или out_of_order.
• Клиент не может редактировать или отменять заказ после отправки. Отмена - это действие персонала на панели Заказы.

Советы для удобного пользовательского опыта

• Печатайте QR-наклейки с названием кафе и понятной инструкцией, например "Сканируйте, чтобы заказать. Попросите код у персонала." Иначе клиенты часто пропускают шаг проверки.
• Делайте названия категорий и товаров короткими. Длинные названия переносятся на мобильных и уводят изображения ниже первого экрана.
• Загружайте хотя бы одно фото на каждый товар. Меню с фотографиями обычно конвертируют лучше, чем только текстовые.
• Включайте Показывать время приготовления в меню только после того, как динамическая оценка пройдет обучение. В первые 30 дней статическое значение может быть слишком щедрым или слишком жестким, и клиенты это заметят.
• Проверьте полный сценарий самостоятельно с телефона до открытия для клиентов. Отсканируйте реальный QR, введите код, оформите тестовый заказ и убедитесь, что он появился на панели.