Kundenmenü

Das Kundenmenü ist die öffentlich zugängliche Webseite unter handy.cafe/{your-slug}. Kunden rufen sie auf, indem sie den QR-Code an ihrem Tisch scannen. Diese Seite beschreibt den gesamten Kundenablauf, damit Sie ihn dem Personal erklären und die Einführung planen können.

URL-Struktur

Jeder Tisch hat eine eindeutige URL in der Form handy.cafe/{cafe-slug}/{table-code}. Der QR-Code codiert diese URL plus ein kurzlebiges Token, das die Echtheit des Aufklebers belegt. Wenn der Kunde den QR scannt:

1. Das Telefon öffnet die URL im Standardbrowser.
2. Die Seite gleicht den Slug und den Tischcode mit der Cloud-API ab.
3. Wenn der Tisch out_of_order ist, zeigt die Seite einen Hinweis an, dass der Tisch nicht verfügbar ist.
4. Wenn der Tisch idle ist, erklärt die Seite, dass das Personal den Kunden noch nicht platziert hat, und bittet ihn, Hilfe zu rufen.
5. Wenn der Tisch in_use ist, fordert die Seite den 6-stelligen Sicherheitscode an.

Sicherheitscode-Prüfung

Der Sicherheitscode stellt sicher, dass nur der Kunde, der gerade am Tisch sitzt, Bestellungen aufgeben kann. Er verhindert, dass jemand, der den QR aus einem Foto oder von außerhalb Ihres Cafés gesehen hat, betrügerische Bestellungen aufgibt.

Nachdem der Kunde den Code eingegeben hat:

1. Die API prüft den Code gegen den auf dem Tisch gespeicherten Hashwert.
2. Wenn er gültig ist, wird eine Sitzung erstellt und ein Token zurückgegeben.
3. Das Token wird in einem Cookie (hc_menu_session) gespeichert. Zusätzlich wird ein Bearer-Token-Fallback im lokalen Speicher des Geräts abgelegt. Das ist auf iPhone Safari nötig, das in manchen Konfigurationen Drittanbieter-Cookies blockieren kann.
4. Der Kunde wird zum Menü weitergeleitet.

Die Sitzung ist 24 Stunden ab Ausgabe gültig. Wenn der Kunde den Browser schließt und auf demselben Gerät zurückkehrt, funktioniert die Sitzung weiterhin und er kann erneut einsteigen, ohne sich erneut zu verifizieren.

Sprachen

Das Menü unterstützt 24 Sprachen: Arabisch, Deutsch, Griechisch, Englisch, Spanisch, Farsi, Französisch, Hindi, Indonesisch, Italienisch, Japanisch, Koreanisch, Malaiisch, Polnisch, Portugiesisch, Rumänisch, Russisch, Thai, Tagalog, Türkisch, Ukrainisch, Urdu, Vietnamesisch und Chinesisch.

Beim ersten Besuch liest die Seite den Accept-Language-Header des Browsers aus und wählt die beste Übereinstimmung. Der Kunde kann die Sprache jederzeit über den Wähler oben im Menü ändern. Die gewählte Sprache wird für die Sitzung gespeichert.

Produktnamen, Beschreibungen und Zutaten werden nicht automatisch übersetzt; sie erscheinen in der Sprache, die Sie im Menüeditor eingegeben haben. UI-Beschriftungen wie "In den Warenkorb", "Bezahlen" und Meldungen im Zahlungsablauf sind vollständig lokalisiert.

Design

Das Menü unterstützt ein helles und ein dunkles Design. Der Standard ist geräteabhängig: Wenn das Betriebssystem des Kunden auf Dunkelmodus steht, öffnet sich das Menü im dunklen Design. Ein Umschalter oben erlaubt den Wechsel.

Gebrandeter Kopfbereich

Der Kopfbereich oben im Menü zeigt:

Passen Sie diese Felder an, um den besten Eindruck bei Ihren Kunden zu hinterlassen. Kunden erkennen Ihre Marke wieder, wenn das Menü wie die Beschilderung vor Ort aussieht.

Menü Durchsuchen

Das Menü ist nach Kategorien gruppiert. Innerhalb einer Kategorie werden Produkte mit Vorschaubild, Name, Kurzbeschreibung und Preis angezeigt.

Wenn Sie ein Produkt antippen, öffnet sich das Produktblatt. Dort werden angezeigt:

• das vollständige Foto,
• die Markdown-Beschreibung,
• die Zutatenzeile,
• die Anzeige der Zubereitungszeit, wenn "Zubereitungszeit im Menü anzeigen" aktiviert ist,
• die Einheitenangabe, falls konfiguriert (zum Beispiel "250 ml"),
• Variantenauswahlen für alle dem Produkt zugeordneten Variantengruppen,
• ein Mengenauswahlfeld,
• ein Button "In den Warenkorb".

Pflicht-Variantengruppen blockieren den Button "In den Warenkorb", bis der Kunde eine Option auswählt.

Warenkorb

Das Warenkorb-Symbol befindet sich an einer festen Stelle, damit Kunden es von jedem Bildschirm aus erreichen können. Der Inhalt des Warenkorbs bleibt beim Navigieren innerhalb der Seite erhalten; das Wechseln vom Warenkorb zum Menü und zurück verliert keine Artikel.

Der Warenkorb ermöglicht dem Kunden:

• die Menge je Position anzupassen,
• eine Position zu entfernen,
• eine optionale Notiz hinzuzufügen,
• eine Telefonnummer anzugeben (optional).

Zwischensumme, MwSt. und Gesamtbetrag werden in Echtzeit angezeigt.

Bestellung Abschicken

Der Schritt "Bezahlen" bietet je nach Konfiguration eine oder zwei Zahlungsmethoden an:

Bar

Wenn Online-Zahlung in Ihren Einstellungen deaktiviert ist, wird nur Bar angezeigt. Der Kunde bestätigt die Bestellung, und sie wird sofort abgeschickt. Bezahlt wird beim Personal, wenn die Bestellung eintrifft.

Online (Stripe Checkout)

Wenn Online-Zahlung aktiviert ist, erscheint Online als Option. Beim Absenden:

1. Die Bestellung wird im Status offen angelegt.
2. Ein Stripe Checkout Client Secret wird zurückgegeben.
3. Die eingebettete Stripe-Oberfläche öffnet sich inline. Der Kunde gibt die Kartendaten ein.
4. Nach erfolgreicher Autorisierung bestätigt Stripe die Belastung und die Bestellung wechselt zu bezahlt.
5. Der Kunde sieht die Erfolgsseite.

Fehlgeschlagene oder abgebrochene Zahlungen lassen die Bestellung im offenen Status. Ein zweiter Versuch kann aus derselben Sitzung heraus gestartet werden, oder das Personal kann die Bestellung im Bestell-Dashboard stornieren.

Erfolgsseite

Nach erfolgreichem Absenden landet der Kunde auf einer Belegseite, die Folgendes zeigt:

• Bestellnummer und Uhrzeit,
• jede Position mit Menge, Varianten und Positionssumme,
• Zwischensumme, MwSt. und Gesamtsumme,
• Zahlungsmethode,
• ein Statussymbol für die Zahlung (offen bei Barzahlung; bezahlt bei Online-Zahlung),
• einen Call-to-Action "Noch eine Bestellung aufgeben", der mit erhaltener Sitzung zum Menü zurückführt,
• einen Link "Zurück zum Menü".

Bestellstatus Abfragen

Nach dem Absenden fragt die Kundenansicht den Status-Endpunkt ab, um Änderungen aus der Küche anzuzeigen. Wenn Ihr Personal einen Artikel von preparing auf ready setzt, sieht der Kunde, dass sich das Badge an der Position innerhalb weniger Sekunden automatisch aktualisiert.

Das ist nützlich für die Selbstabholung am Tresen. Der Kunde kann am Tisch bleiben, bis das Menü meldet, dass die Bestellung fertig ist.

Was Kunden Nicht Tun Können

• Kunden können das Menü ohne Sicherheitscode nicht durchsuchen. Der Verifizierungsschritt ist immer erforderlich.
• Kunden können keine Bestellungen für Tische aufgeben, die idle oder out_of_order sind.
• Kunden können eine Bestellung nach dem Absenden nicht bearbeiten oder stornieren. Das Stornieren ist eine Aktion des Personals im Bestell-Dashboard.

Tipps Für Ein Sauberes Kundenerlebnis

• Drucken Sie QR-Aufkleber mit dem Café-Namen und einer klaren Anweisung wie "Zum Bestellen scannen. Code beim Personal erfragen." Sonst übersehen Kunden den Verifizierungsschritt manchmal.
• Halten Sie Kategorien- und Produktnamen kurz. Lange Namen umbrechen auf Mobilgeräten und schieben Bilder unter die Sichtgrenze.
• Laden Sie mindestens ein Foto pro Produkt hoch. Bildlastige Menüs konvertieren besser als reine Textmenüs.
• Aktivieren Sie "Zubereitungszeit im Menü anzeigen" erst, wenn Ihre dynamische Schätzung eingelernt hat. In den ersten 30 Tagen kann der statische Wert zu großzügig oder zu knapp sein, und Kunden merken das.
• Testen Sie den gesamten Ablauf vor dem Öffnen selbst einmal mit einem Telefon. Scannen Sie einen echten QR, geben Sie den Code ein, geben Sie eine Testbestellung auf und prüfen Sie, ob die Bestellung auf Ihrem Dashboard erscheint.