เมนูลูกค้า

เมนูลูกค้าเป็นหน้าเว็บที่ลูกค้าสามารถเข้าถึงได้ที่ handy.cafe/{your-slug} ลูกค้าสามารถเข้าถึงได้โดยการสแกน QR code ที่โต๊ะของพวกเขา หน้านี้อธิบายขั้นตอนการใช้งานของลูกค้าอย่างละเอียดเพื่อให้คุณสามารถอธิบายให้พนักงานฟังและวางแผนการเปิดตัวได้

โครงสร้าง URL

ทุกโต๊ะมี URL ที่ไม่ซ้ำกันในรูปแบบ handy.cafe/{cafe-slug}/{table-code} QR code จะเข้ารหัส URL นี้พร้อมกับโทเค็นที่มีอายุสั้นเพื่อยืนยันว่าเป็นสติกเกอร์ที่แท้จริง เมื่อสแกน QR:

1. โทรศัพท์ของลูกค้าจะเปิด URL ในเบราว์เซอร์เริ่มต้น
2. หน้าจะตรวจสอบ slug และ table code กับ cloud API
3. หากโต๊ะ out_of_order หน้าจะแสดงประกาศว่าไม่สามารถใช้งานได้
4. หากโต๊ะ idle หน้าจะแจ้งว่าพนักงานยังไม่ได้พาลูกค้ามานั่งและขอให้พวกเขาเรียกพนักงาน
5. หากโต๊ะ in_use หน้าจะแจ้งให้ใส่รหัสความปลอดภัย 6 หลัก

การยืนยันรหัสความปลอดภัย

รหัสความปลอดภัยช่วยให้มั่นใจได้ว่ามีเพียงลูกค้าที่นั่งอยู่ที่โต๊ะเท่านั้นที่สามารถสั่งอาหารได้ ป้องกันไม่ให้ผู้ที่เห็น QR จากภาพถ่ายหรือจากภายนอกร้านของคุณสั่งอาหารปลอม

หลังจากที่ลูกค้าใส่รหัส:

1. API จะตรวจสอบรหัสกับค่าที่แฮชไว้ในโต๊ะ
2. หากถูกต้อง จะสร้างเซสชันและส่งคืนโทเค็น
3. โทเค็นจะถูกเก็บไว้ในคุกกี้ (hc_menu_session) และมีการเก็บ Bearer token สำรองไว้ใน local storage ของอุปกรณ์ ซึ่งจำเป็นสำหรับ iPhone Safari ที่อาจบล็อกคุกกี้ของบุคคลที่สามในบางการตั้งค่า
4. ลูกค้าจะถูกเปลี่ยนเส้นทางไปยังเมนู

เซสชันมีอายุ 24 ชั่วโมงนับจากการออก หากลูกค้าปิดเบราว์เซอร์และกลับมาใช้อุปกรณ์เดิม เซสชันยังคงใช้งานได้และพวกเขาสามารถกลับเข้าไปได้โดยไม่ต้องยืนยันใหม่

ภาษา

เมนูรองรับ 24 ภาษา: อาหรับ, เยอรมัน, กรีก, อังกฤษ, สเปน, ฟาร์ซี, ฝรั่งเศส, ฮินดี, อินโดนีเซีย, อิตาลี, ญี่ปุ่น, เกาหลี, มาเลย์, โปแลนด์, โปรตุเกส, โรมาเนีย, รัสเซีย, ไทย, ตากาล็อก, ตุรกี, ยูเครน, อูรดู, เวียดนาม, และจีน

ในการเข้าชมครั้งแรก หน้าจะตรวจสอบ Accept-Language header จากเบราว์เซอร์และเลือกภาษาที่ตรงที่สุด ลูกค้าสามารถเปลี่ยนภาษาได้ตลอดเวลาโดยใช้ตัวเลือกที่ด้านบนของเมนู ภาษาที่เลือกจะถูกจดจำสำหรับเซสชันนั้น

ชื่อผลิตภัณฑ์, คำอธิบาย, และส่วนผสมจะไม่ถูกแปลอัตโนมัติ; จะแสดงในภาษาที่คุณป้อนในตัวแก้ไขเมนู ป้าย UI เช่น "Add to Cart", "Checkout", และข้อความในกระบวนการชำระเงินได้รับการแปลอย่างสมบูรณ์

ธีม

เมนูรองรับธีมสว่างและธีมมืด ค่าเริ่มต้นจะขึ้นอยู่กับอุปกรณ์: หากระบบปฏิบัติการของลูกค้าตั้งค่าเป็นโหมดมืด เมนูจะเปิดในโหมดมืด สวิตช์ธีมที่ด้านบนช่วยให้ลูกค้าสามารถเปลี่ยนได้

ส่วนหัวที่มีแบรนด์

ส่วนหัวที่ด้านบนของเมนูแสดง:

ปรับแต่งฟิลด์เหล่านี้เพื่อสร้างความประทับใจที่ดีที่สุดให้กับลูกค้า ลูกค้าจะจดจำแบรนด์เมื่อเมนูดูเหมือนป้ายที่ร้านของคุณ

การเรียกดูเมนู

เมนูถูกจัดกลุ่มตามหมวดหมู่ ภายในหมวดหมู่ ผลิตภัณฑ์จะแสดงด้วยภาพย่อ, ชื่อ, คำอธิบายสั้น, และราคา

การแตะที่ผลิตภัณฑ์จะเปิดแผ่นข้อมูลผลิตภัณฑ์ แผ่นข้อมูลจะแสดง:

• ภาพเต็ม
• คำอธิบาย Markdown
• รายการส่วนผสม
• ชิปเวลาการเตรียม (เฉพาะเมื่อเปิดใช้งาน Show Prep Time on Menu)
• ป้ายหน่วยหากกำหนดค่าไว้ (เช่น "250 ml")
• ตัวเลือกตัวแปรสำหรับกลุ่มตัวแปรที่แนบกับผลิตภัณฑ์
• ตัวปรับจำนวน
• ปุ่ม Add to Cart

กลุ่มตัวแปรที่จำเป็นจะบล็อกปุ่ม Add to Cart จนกว่าลูกค้าจะเลือกตัวเลือก

ตะกร้า

ไอคอนตะกร้าอยู่ในตำแหน่งที่คงที่เพื่อให้ลูกค้าสามารถเข้าถึงได้จากทุกหน้าจอ เนื้อหาตะกร้าจะคงอยู่ข้ามการนำทางภายในไซต์; การเรียกดูจากตะกร้าไปยังเมนูและกลับจะไม่สูญเสียรายการ

ตะกร้าให้ลูกค้าสามารถ:

• ปรับจำนวนต่อบรรทัด
• ลบบรรทัด
• เพิ่มหมายเหตุเพิ่มเติม
• ให้หมายเลขโทรศัพท์ (ไม่บังคับ)

ยอดรวมย่อย, VAT, และยอดรวมทั้งหมดจะแสดงแบบเรียลไทม์

การสั่งซื้อ

ขั้นตอน Checkout เสนอวิธีการชำระเงินหนึ่งหรือสองวิธีขึ้นอยู่กับการตั้งค่าของคุณ:

เงินสด

หากการชำระเงินออนไลน์ถูกปิดใช้งานในการตั้งค่าของคุณ จะมีเพียงเงินสดเท่านั้นที่แสดง ลูกค้ายืนยันการสั่งซื้อและส่งทันที ลูกค้าชำระเงินที่แคชเชียร์เมื่อคำสั่งซื้อมาถึง

ออนไลน์ (Stripe Checkout)

หากเปิดใช้งานการชำระเงินออนไลน์ ออนไลน์จะปรากฏเป็นตัวเลือก เมื่อส่ง:

1. คำสั่งซื้อจะถูกสร้างในสถานะรอดำเนินการ
2. ส่งคืน Stripe Checkout client secret
3. UI ของ Stripe ที่ฝังอยู่จะเปิดในบรรทัด ลูกค้าใส่รายละเอียดบัตร
4. เมื่อการอนุมัติสำเร็จ Stripe ยืนยันการเรียกเก็บเงินและคำสั่งซื้อจะเปลี่ยนเป็นชำระเงินแล้ว
5. ลูกค้าเห็นหน้าความสำเร็จ

การชำระเงินที่ล้มเหลวหรือถูกละทิ้งจะทำให้คำสั่งซื้ออยู่ในสถานะรอดำเนินการ สามารถลองใหม่ได้จากเซสชันเดียวกัน หรือพนักงานสามารถยกเลิกคำสั่งซื้อจากแดชบอร์ดคำสั่งซื้อ

หน้าความสำเร็จ

หลังจากการส่งสำเร็จ ลูกค้าจะไปยังหน้ารับใบเสร็จที่แสดง:

• หมายเลขคำสั่งซื้อและเวลา
• ทุกบรรทัดพร้อมจำนวน, ตัวแปร, และยอดรวมบรรทัด
• ยอดรวมย่อย, VAT, และยอดรวมทั้งหมด
• วิธีการชำระเงิน
• ไอคอนสถานะการชำระเงิน (รอดำเนินการสำหรับเงินสด; ชำระเงินแล้วสำหรับออนไลน์)
• CTA "Place Another Order" ที่กลับไปยังเมนูพร้อมเซสชันที่ยังคงอยู่
• ลิงก์ "Back to Menu"

การตรวจสอบสถานะคำสั่งซื้อ

หลังจากการส่ง มุมมองของลูกค้าต่อคำสั่งซื้อจะตรวจสอบสถานะจาก endpoint เพื่อสะท้อนการอัปเดตจากครัว หากพนักงานของคุณเปลี่ยนสถานะรายการจาก preparing เป็น ready ลูกค้าจะเห็นป้ายบนบรรทัดอัปเดตอัตโนมัติภายในไม่กี่วินาที

นี่มีประโยชน์สำหรับการรับสินค้าแบบบริการตนเองที่เคาน์เตอร์ ลูกค้าสามารถพักผ่อนที่โต๊ะจนกว่าเมนูจะแจ้งว่าคำสั่งซื้อพร้อมแล้ว

สิ่งที่ลูกค้าไม่สามารถทำได้

• ลูกค้าไม่สามารถเรียกดูเมนูได้หากไม่มีรหัสความปลอดภัย ขั้นตอนการยืนยันเป็นสิ่งที่จำเป็นเสมอ
• ลูกค้าไม่สามารถสั่งซื้อสำหรับโต๊ะที่ idle หรือ out_of_order
• ลูกค้าไม่สามารถแก้ไขหรือยกเลิกคำสั่งซื้อหลังจากที่ได้ส่งแล้ว การยกเลิกเป็นการกระทำของพนักงานจากแดชบอร์ดคำสั่งซื้อ

เคล็ดลับสำหรับประสบการณ์ลูกค้าที่ราบรื่น

• พิมพ์สติกเกอร์ QR พร้อมชื่อร้านและคำแนะนำที่ชัดเจนเช่น "สแกนเพื่อสั่งอาหาร. ขอรหัสจากพนักงาน." ลูกค้าบางครั้งอาจพลาดขั้นตอนการยืนยัน
• รักษาชื่อหมวดหมู่และผลิตภัณฑ์ให้สั้น ชื่อที่ยาวจะทำให้ภาพเลื่อนลงไปด้านล่างบนมือถือ
• อัปโหลดภาพอย่างน้อยหนึ่งภาพต่อผลิตภัณฑ์ เมนูที่มีภาพมากกว่าจะแปลงได้ดีกว่าเมนูที่มีแต่ข้อความ
• เปิดใช้งาน Show Prep Time on Menu เฉพาะหลังจากที่การประมาณการแบบไดนามิกของคุณได้รับการฝึกฝนแล้ว ในช่วง 30 วันแรกค่าคงที่อาจจะใจกว้างเกินไปหรือตึงเกินไป และลูกค้าจะสังเกตเห็น
• ทดสอบการทำงานทั้งหมดด้วยตัวเองจากโทรศัพท์ก่อนเปิดให้ลูกค้า สแกน QR จริง ใส่รหัส สั่งซื้อทดสอบ และตรวจสอบว่าคำสั่งซื้อปรากฏบนแดชบอร์ดของคุณ