کسٹمر مینو

Customer menu عوام کے لیے سامنے آنے والا ویب صفحہ ہے جو handy.cafe/{your-slug} پر ہوتا ہے۔ کسٹمر اسے اپنی ٹیبل کے QR code کو اسکین کر کے کھولتے ہیں۔ یہ صفحہ کسٹمر کے پورے flow کی وضاحت کرتا ہے تاکہ آپ اسے عملے کو سمجھا سکیں اور rollout کی منصوبہ بندی کر سکیں۔

URL ساخت

ہر ٹیبل کا منفرد URL اس شکل میں ہوتا ہے: handy.cafe/{cafe-slug}/{table-code}۔ QR code اس URL کے ساتھ ایک مختصر مدت والا token بھی encode کرتا ہے جو sticker کی authenticity ثابت کرتا ہے۔ جب کسٹمر QR اسکین کرتا ہے:

1. اس کا فون URL کو default browser میں کھولتا ہے۔
2. صفحہ slug اور table code کو cloud API کے خلاف resolve کرتا ہے۔
3. اگر ٹیبل out_of_order ہو تو صفحہ عدم دستیابی کا پیغام دکھاتا ہے۔
4. اگر ٹیبل idle ہو تو صفحہ بتاتا ہے کہ عملے نے ابھی کسٹمر کو نہیں بٹھایا اور مدد کے لیے پکارنے کو کہتا ہے۔
5. اگر ٹیبل in_use ہو تو صفحہ 6 ہندسوں والا security code مانگتا ہے۔

Security Code کی تصدیق

Security code یہ یقینی بناتا ہے کہ صرف وہی کسٹمر جو اس وقت ٹیبل پر بیٹھا ہے آرڈر دے سکے۔ یہ اس بات سے بچاتا ہے کہ کوئی شخص QR کی تصویر دیکھ کر یا باہر سے دھوکہ دہی کے آرڈر نہ دے سکے۔

کسٹمر code درج کرنے کے بعد:

1. API code کو ٹیبل پر محفوظ hash شدہ value سے validate کرتا ہے۔
2. اگر درست ہو تو session بنتا ہے اور token واپس ملتا ہے۔
3. Token cookie (hc_menu_session) میں محفوظ کیا جاتا ہے۔ device کی local storage میں Bearer token fallback بھی رکھا جاتا ہے۔ یہ iPhone Safari کے لیے ضروری ہے، جو بعض ترتیبات میں third-party cookies بلاک کر سکتا ہے۔
4. کسٹمر کو مینو پر redirect کر دیا جاتا ہے۔

Session issue ہونے کے بعد 24 گھنٹے تک درست رہتا ہے۔ اگر کسٹمر browser بند کر کے اسی device پر واپس آئے تو session پھر بھی کام کرتا ہے اور دوبارہ تصدیق کے بغیر لاگ اِن ہو سکتا ہے۔

زبانیں

مینو 24 زبانوں کو سپورٹ کرتا ہے: Arabic, German, Greek, English, Spanish, Farsi, French, Hindi, Indonesian, Italian, Japanese, Korean, Malay, Polish, Portuguese, Romanian, Russian, Thai, Tagalog, Turkish, Ukrainian, Urdu, Vietnamese، اور Chinese۔

پہلی بار کھلنے پر صفحہ browser کے Accept-Language header کو دیکھتا ہے اور بہترین مطابقت منتخب کرتا ہے۔ کسٹمر مینو کے اوپر موجود picker سے کسی بھی وقت زبان بدل سکتا ہے۔ منتخب زبان session کے لیے یاد رکھی جاتی ہے۔

پروڈکٹ names، descriptions، اور ingredients خودکار طور پر ترجمہ نہیں ہوتے؛ وہ اسی زبان میں دکھائے جاتے ہیں جس میں آپ نے انہیں menu editor میں درج کیا ہے۔ "Add to Cart"، "Checkout"، اور payment flow messages جیسے UI labels مکمل طور پر مقامی ہوتے ہیں۔

تھیم

مینو light theme اور dark theme دونوں سپورٹ کرتا ہے۔ default device-aware ہے: اگر کسٹمر کے operating system میں dark mode فعال ہو تو مینو dark mode میں کھلتا ہے۔ اوپر موجود theme toggle سے کسٹمر اسے بدل سکتا ہے۔

برانڈڈ ہیڈر

مینو کے اوپر ہیڈر میں یہ چیزیں دکھائی دیتی ہیں:

یہ فیلڈز بہتر کسٹمر تاثر کے لیے حسبِ ضرورت بنائیں۔ جب مینو آپ کے مقام کی فزیکل signage جیسا لگتا ہے تو کسٹمر برانڈ کو فوراً پہچان لیتے ہیں۔

مینو براؤزنگ

مینو category کے لحاظ سے گروپ ہوتا ہے۔ ہر category کے اندر products thumbnail، نام، مختصر وضاحت، اور قیمت کے ساتھ دکھائی دیتے ہیں۔

کسی product پر tap کرنے سے product sheet کھلتی ہے۔ اس sheet میں یہ چیزیں دکھائی جاتی ہیں:

• مکمل تصویر۔
• مارک ڈاؤن وضاحت۔
• Ingredients line۔
• Preparation time chip (صرف جب Show Prep Time on Menu فعال ہو)۔
• اگر یونٹ متعین ہو تو unit label (مثلاً "250 ml")۔
• پروڈکٹ سے منسلک کسی بھی variant group کے لیے selectors۔
• Quantity stepper۔
• Add to Cart بٹن۔

Required variant groups اس وقت تک Add to Cart بٹن روک دیتے ہیں جب تک کسٹمر کوئی option منتخب نہ کرے۔

Cart

Cart icon ایک مستقل جگہ پر ہوتا ہے تاکہ کسٹمر کسی بھی اسکرین سے cart تک پہنچ سکے۔ Cart کا مواد site کے اندر navigation کے دوران برقرار رہتا ہے؛ cart سے مینو اور واپس جانے پر آئٹمز ضائع نہیں ہوتے۔

Cart کسٹمر کو یہ کرنے دیتا ہے:

• فی لائن quantity بدلنا۔
• لائن حذف کرنا۔
• اختیاری نوٹ شامل کرنا۔
• فون نمبر فراہم کرنا (اختیاری)۔

Subtotal، VAT، اور total حقیقی وقت میں دکھائے جاتے ہیں۔

آرڈر دینا

Checkout مرحلہ آپ کی configuration کے مطابق ایک یا دو payment methods پیش کرتا ہے:

Cash

اگر آپ کی settings میں online payment بند ہو تو صرف Cash دکھایا جاتا ہے۔ کسٹمر آرڈر کی تصدیق کرتا ہے اور یہ فوراً جمع ہو جاتا ہے۔ آرڈر پہنچنے پر کسٹمر cashier کو ادائیگی کرتا ہے۔

Online (Stripe Checkout)

اگر online payment فعال ہو تو Online بطور option نظر آتا ہے۔ جمع کروانے پر:

1. آرڈر pending state میں بنتا ہے۔
2. ایک Stripe Checkout client secret واپس ملتا ہے۔
3. Stripe embedded UI inline کھلتی ہے۔ کسٹمر card details درج کرتا ہے۔
4. کامیاب اجازت کے بعد Stripe charge کی تصدیق کرتا ہے اور آرڈر paid میں چلا جاتا ہے۔
5. کسٹمر success page دیکھتا ہے۔

ناکام یا ادھورے payments آرڈر کو pending state میں چھوڑ دیتے ہیں۔ اسی session سے دوسری کوشش کی جا سکتی ہے، یا عملہ Orders dashboard سے آرڈر منسوخ کر سکتا ہے۔

Success Page

کامیاب submission کے بعد کسٹمر ایک receipt page پر پہنچتا ہے جس میں یہ چیزیں دکھائی دیتی ہیں:

• آرڈر نمبر اور وقت۔
• ہر لائن quantity، variants، اور line total کے ساتھ۔
• Subtotal، VAT، اور grand total۔
• Payment method۔
• Payment status icon (cash کے لیے pending؛ online کے لیے paid)۔
• "Place Another Order" CTA جو session برقرار رکھتے ہوئے مینو پر واپس لے جاتا ہے۔
• "Back to Menu" link۔

آرڈر اسٹیٹس پولنگ

جمع کروانے کے بعد کسٹمر کے آرڈر کا منظر status endpoint پول کرتا ہے تاکہ kitchen کی اپڈیٹس ظاہر ہو سکیں۔ اگر عملہ کسی item کو preparing سے ready پر لے جائے تو کسٹمر لائن پر badge چند سیکنڈ میں خود بخود اپڈیٹ ہوتا دیکھتا ہے۔

یہ counter pickup جیسے self-service setup کے لیے مفید ہے۔ کسٹمر ٹیبل پر آرام کر سکتا ہے جب تک مینو اسے نہ بتائے کہ آرڈر تیار ہے۔

کسٹمر کیا نہیں کر سکتے

• Security code کے بغیر مینو براؤز نہیں کر سکتے۔ verification مرحلہ ہمیشہ ضروری ہے۔
• idle یا out_of_order ٹیبلز کے لیے آرڈر نہیں دے سکتے۔
• جمع کروانے کے بعد آرڈر میں ترمیم یا منسوخی نہیں کر سکتے۔ منسوخی Orders dashboard سے عملے کی کارروائی ہے۔

صاف تجربے کے لیے مشورے

• QR stickers پر کیفے کا نام اور واضح ہدایت چھاپیں، مثلاً "Scan to order. Ask staff for the code." ورنہ کسٹمر کبھی کبھی verification مرحلہ miss کر دیتے ہیں۔
• Category اور product names مختصر رکھیں۔ لمبے نام mobile پر wrap ہو جاتے ہیں اور تصاویر fold سے نیچے چلی جاتی ہیں۔
• ہر product کے لیے کم از کم ایک تصویر اپ لوڈ کریں۔ تصویر والے menus صرف text والے menus سے بہتر convert ہوتے ہیں۔
• Show Prep Time on Menu صرف تب فعال کریں جب آپ کا dynamic estimate trained ہو جائے۔ پہلے 30 دن static value شاید بہت زیادہ یا بہت کم ہو سکتی ہے، اور کسٹمرز یہ فرق محسوس کرتے ہیں۔
• اپنے آپ سے فون پر پورا flow آزما کر دیکھیں قبل اس کے کہ کسٹمرز کو دیں۔ اصلی QR اسکین کریں، code درج کریں، test order دیں، اور تصدیق کریں کہ آرڈر آپ کے dashboard پر آ جاتا ہے۔