Tableo
لم يعد رمز QR في المطعم ملف PDF، بل قناة بيع.
- السنة
- 2026
- مدة التصميم
- 9 أسابيع
- التقنيات
- React · TypeScript · Vite · Supabase · Vercel
- تصميم المنتج
- تصميم للجوال
- التطوير
- قاعدة البيانات
- الدفع
منتج من تطوير Kayzen Web، متاح على عنوان معاينة Vercel في انتظار نطاقه النهائي.
- لفتح القائمة عند المسح
- <1 ثانية
- الأداء في Lighthouse
- 91/100
- إتاحة الوصول في Lighthouseدون عتبتنا البالغة 95: النقطة المرصودة هي تباين القائمة، المستنسخ من ألوان كل مطعم؛ وتصحيحها مُدرَج في المراجعة القادمة.
- 87/100
ما كان يجب حلّه.
السياق
يحوّل Tableo رمز QR الموضوع على طاولة المطعم إلى واجهة متكاملة: قائمة طعام محدَّثة، وطلب، ودفع، وجمع للتقييمات، وبيانات عن الإقبال.
القيد
يعاني رمز QR من سمعة سيئة منذ عام 2020، لأنه استُخدم أولًا لعرض ملفات PDF يتعذّر قراءتها. كان على المنتج أن يمحو هذه الذكرى منذ الشاشة الأولى على الهاتف، وفي ظروف غير مواتية: قاعة صاخبة، ويد واحدة، وشبكة مزدحمة، وزبون مستعجل.
الحل
صمّمنا واجهة الزبون أولًا، لا لوحة الإدارة. تُفتح القائمة في أقل من ثانية، دون تثبيت ولا حساب، وتبقى قابلة للقراءة بيد واحدة. جاءت لوحة تحكم صاحب المطعم بعد ذلك، مقيَّدة بما تنتجه واجهة الزبون فعلًا من بيانات.
النتائج المسجّلة عند التسليم.
نتائج Lighthouse للموقع في بيئة الإنتاج. ننشرها كما هي: وعندما تكون إحداها منخفضة، نكتب سببها وخطة تصحيحها أدناه بدلًا من التكتم عليها.
كل خيار، وسببه.
مصمَّم للإبهام
تنقّل بين الفئات مثبَّت أسفل الشاشة، في المنطقة التي يبلغها الإبهام. أهداف لمس لا تقل عن 44 px. فقائمة المطعم تُتصفَّح وقوفًا، بيد واحدة، والكأس في اليد الأخرى.
الصور اختيارية، لا إلزامية أبدًا
قلّة من المطاعم تملك صورًا لائقة لكل أطباقها. تبقى القائمة أنيقة بلا صور؛ والصور، حين تتوفر، إضافة لا هيكل الصفحة.
لوحة تحكم تُقرأ بنظرة
يطّلع صاحب المطعم على لوحة تحكمه بين خدمتين. ثلاثة أرقام في الأعلى، والباقي أسفل الجزء الظاهر من الشاشة. لا رسم بيانيًا يتطلب قراءة متأنية.
لوحة ألوان المشروع
بنّي داكن (سيبيا)
#7C4A21
الهوية، العناوين
كريمي
#FBF7F0
خلفية القائمة
حبري
#1C1917
النص
أخضر الطلب
#15803D
التأكيد
النظام الطباعي
العناوين
Outfit 700
النص الأساسي
Inter 400
الأسعار بأرقام جدولية محاذاة إلى اليمين: عمود أسعار غير منتظم يوحي بقائمة مُعدّة على عجل.
ما يوجد تحت الغطاء.
- React
- TypeScript
- Vite
- Supabase
- Vercel
Supabase في الوقت الفعلي
تصل الطلبات مباشرة إلى المطبخ عبر اشتراك في الوقت الفعلي. أما التحديث الدوري فكان سيضيف تأخيرًا حيث يُلحَظ أكثر من أي مكان آخر.
عزل البيانات لكل منشأة
سياسات وصول على مستوى الصف: لا يستطيع مطعم، بحكم البنية نفسها، قراءة بيانات مطعم آخر. في منتج متعدد المستأجرين، تنتمي هذه القاعدة إلى قاعدة البيانات، لا إلى شيفرة التطبيق.
دفع مُسنَد إلى طرف متخصص
لا تمرّ أي بيانات بطاقة عبر المنتج. يتولى مزوّد الدفع إدخال البيانات والامتثال لمعيار PCI؛ وهو الخيار المعقول الوحيد لفريق بهذا الحجم.
كيف يصبح الموقع قابلًا للعثور عليه.
يخدم SEO بيعَ البرنامج
قائمة المطعم ليست معدّة للفهرسة — فهي تتغير كل يوم ولا تجيب عن أي استعلام بحث. يستهدف تحسين محركات البحث (SEO) عبارات مثل «برنامج الطلب من الطاولة» و«قائمة مطعم برمز QR»، أي استعلامات صاحب المطعم.
قابل للاستخدام من الجميع.
منذ يونيو 2025، يفرض القانون الأوروبي لإمكانية الوصول (European Accessibility Act) إتاحة الوصول الرقمي على شريحة واسعة من الخدمات الإلكترونية. نتعامل معها منذ مرحلة التصميم، لا كتدارك لاحق.
مراجعة التباين في قائمة الطعام
تُفرط قوائم المطاعم في استعمال الرمادي الفاتح على الأبيض. كل الأزواج اللونية تتجاوز 4.5:1، بما فيها الأسعار وبيانات مسببات الحساسية — التي لا يقتصر وضوحها على مسألة الراحة.
ما تم تسليمه.
- موقع المنتج
- واجهة الزبون (QR)
- لوحة تحكم صاحب المطعم
- الأسعار
- الحساب
مراحل سير المشروع.
واجهة الزبون
نموذج أولي للجوال اختُبر في القاعة قبل أي سطر من لوحة الإدارة.
لوحة الإدارة
القوائم، والفئات، والتوفر، ومواعيد العمل.
الطلب والدفع
المطبخ في الوقت الفعلي، ومزوّد الدفع.
التحليلات
الإقبال، والأطباق الأكثر مشاهدة، ومتوسط السلة.
ما يُطرح علينا كثيرًا.
أعمال أخرى
الامتثال للائحة GDPR & SaaSKonsent by Kayzen
مورّد أشرطة موافقة يدقّق الأشرطة هو خصم وحَكَم في آن واحد: كانت الاستقلالية هي المنتج نفسه.
الأمن السيبراني الهجومي & SaaSSentinel by Kayzen
بيع منتج أمني لمهندسين: كان على كل ادعاء أن يكون قابلًا للإثبات.
البيانات & خدمة الأرصاد الجويةMétéo Climat France
358 صفحة قابلة للفهرسة، وخريطة متحركة على 72 موعدًا — دون سطر واحد من أي إطار عمل.
مستوى الإتقان نفسه، لموقعك.
تدقيق مجاني لموقعك الحالي، وعرض سعر خلال 24 ساعة، وتعليل مكتوب — مثل الذي قرأته للتو. الدفع على ثلاث دفعات دون رسوم إضافية، مع التحقق من برامج الدعم المحلية قبل التوقيع.