خلي قائمتك بألوان محلك: الألوان والخطوط والوضع الداكن

فين تلاقي أدوات الهوية البصرية بالظبط

أي حساب جديد في menu-MENA بيبدأ بنفس التصميم الكلاسيكي وبنفس اللون الأزرق الافتراضي. ده تمام لأول نظرة، بس هو مش مطعمك. المكان اللي تغيّر فيه ده هو Theme Settings، في القايمة الجانبية تحت قسم Storefront، فوق Template Builder على طول. الصفحة دي بتغطي خطوة التخصيص السريعة: اللغة الافتراضية، الثيمات الجاهزة، ألوانك بنفسك، العملة، والوضع الداكن. لو حبيت بعدين تحرك عناصر الصفحة لوحدها، ده تحتاج أداة تانية أعمق. الصفحة دي همها إنك تظبط ألوانك ووضعك في كام دقيقة، من غير ما تفتح أداة تصميم أصلاً.

اللغة الافتراضية بتحدد الاتجاه كمان

أول عنصر في الصفحة هو Default Language، مفتاح تبديل بين ENGLISH وعربي. اختار عربي، واتجاه التصميم يتحول لـ RTL تلقائياً. الاتنين مش إعدادين منفصلين: اللغة الافتراضية عربي معناها اتجاه من اليمين لليسار، والإنجليزي معناها من الشمال لليمين، في خطوة واحدة. الربط ده مقصود. العربي في المنصة دي مش تصميم إنجليزي متقلّب مع ترجمة للليبلز؛ هو مبني من الأول على اتجاه القراءة بتاعه هو.

Quick-start themes: كليك واحد وتلات أشكال حقيقية

تحت المفتاح ده فيه Quick-start themes: تلات كروت جاهزة، Warm Café وSleek Noir وPop Electric، وخيار رابع اسمه "None (use classic template)". كل واحد من التلاتة ده مش مجرد تغيير لون. وراه لوحة ألوان كاملة (خلفية، سطح الكارت، نص، نص ثانوي، نص باهت، لون أساسي، لون ثانوي، ألوان التنقل، حدود، وظل)، وخط مختار، ونظام زوايا مدور، وكل واحد فيهم جاي بنسخة فاتحة وداكنة جاهزتين من الأول. Warm Café وSleek Noir بيستخدموا خط Plus Jakarta Sans للنص الإنجليزي؛ Pop Electric بيستخدم Space Grotesk. الثلاثة بيستخدموا Cairo للعربي. تدوس على كارت، ومعاينة الألوان بتتحدث وتاخد مكان التصميم الكلاسيكي اللي تحتها. تدوس "None" وترجع للتصميم الافتراضي العادي، بالألوان الأساسية والثانوية اللي إنت ظابطها تحت في الصفحة.

التصميمات الجاهزة (Built-in layouts) بمعاينة على قائمتك الحقيقية

تحت كروت الثيمات فيه Built-in layouts، وهنا تختار بين تصميمات Default وModern وClassic. كل كارت بيوريك صورة مصغّرة حية باستخدام الأصناف والأقسام الحقيقية بتاعتك، أو مجموعة عينة صغيرة لو قائمتك لسه فاضية، فإنت بتشوف أسماء وأسعار مطعمك فعلاً مش نص تجريبي. الدوس على Preview بيفتحلك الصفحة كاملة في نافذة قبل ما تلتزم بحاجة.

اختيار الألوان الأساسية بتاعتك

تحت أكتر، قسم Customize Colors بيديك خانتين: Primary Color وSecondary Color. الخانتين دول بيشتغلوا على التصميمات الكلاسيكية، زي الأزرار، وتاب القسم النشط، والأسعار المميزة. لو اخترت لون هيبقى صعب القراءة كنص فوق خلفية بيضا، هتلاقي تحذير "low contrast" ظاهر تحت الخانة. ده بيتحقق من معيار WCAG AA، نسبة تباين 4.5:1 على الأقل، وده اللي بيمسك اللون الأصفر الفاتح أو الباستيل اللي شكله حلو كخانة صغيرة بس بيختفي لما يبقى نص فعلي في القائمة.

خانة العملة موجودة في نفس الكارت: USD وEGP وEUR وGBP وSAR وAED، وبتتطبق على كل سعر في القائمة.

الوضع الداكن: إعدادين مش إعداد واحد

"الوضع الداكن" هنا فعلياً حاجتين منفصلتين، وفصلهم عن بعض بيخلي الصفحة أسهل في الاستخدام.

الحاجة الأولى هي اللي إنت بتتحكم فيها، في قسم Dark Mode جوه Theme Settings: أربع خانات ألوان، Dark Background وDark Surface وDark Text وDark Muted Text، ومعاها قيم افتراضية شغالة من الأول (خلفية قريبة من الأسود، سطح كارت أفتح شوية، نص قريب من الأبيض، ورمادي باهت للنص الثانوي). سيبهم زي ما هم والوضع الداكن هيبقى شكله كويس بره الصندوق. غيّرهم وتقدر توفّق الوضع الداكن مع هوية علامتك بدل اللون الأسود العام.

الحاجة التانية هي اللي الزبون بيتحكم فيها: زرار دائري صغير موجود فوق صفحة القائمة الحية، جنب مفتاح تبديل اللغة. يدوس عليه، وبيلف بين تلقائي، فاتح، وداكن. الوضع التلقائي بيتبع إعداد موبايل الزبون؛ الفاتح والداكن اختيار صريح بيفضل محفوظ لمدة سنة عن طريق كوكي، فالزبون اللي بيرجع تاني مش محتاج يظبطه كل مرة، والاختيار كمان بيفضل شغال لو حد بعت له لينك القائمة. إنت بتحدد الألوان، هما بيختاروا الوضع.

الخطوط: جاهزة، أو مخصصة بالكامل

اختار واحد من الثلاث ثيمات الجاهزة، والخط الخاص بيه بييجي معاه أوتوماتيك من غير أي خطوة زيادة. لو عايز تختار خط لوحده، خط للعناوين وخط تاني لأسماء الأصناف مثلاً، الإعداد ده موجود في مستوى أعمق، جوه Template Builder، اللي فيه قايمة قابلة للبحث من 39 خط من Google Fonts مختارة بعناية، منهم خطوط مناسبة للعربي زي Cairo وTajawal وAmiri بتتحمل تلقائياً بمجموعة الحروف العربية الصح. Theme Settings هي الخطوة السريعة. Template Builder هو مكان مستوى التحكم ده.

احفظ، وبعدين جرب الـ QR

كل تغيير في الصفحة دي، اللغة، الثيم، الألوان، العملة، خيارات الشريط العلوي، لوحة الألوان الداكنة، كله في فورم واحد وزرار Save Theme واحد تحت. مفيش حاجة بتنزل لحد ما تدوس عليه. بعد ما تحفظ، امسح كود الـ QR بتاع ترابيزتك بنفسك ودوس على زرار الوضع الداكن قبل ما تقول للطاقم إن الشغل خلص. لون شكله حلو على شاشة اللابتوب في النهار ممكن يبان مختلف على موبايل فوق ترابيزة العشا والإضاءة واطية.