JPasta — Fresh Pasta & Chicken JPasta Design Lab · قلقيلية افتح الموقع الحالي

مراجعة تصميم · 3 اتجاهات · 2026

ثلاثة اتجاهات.
صفحة واحدة.

قرأت المشروع كاملاً: الهوية، التوكنز، القائمة، الصدق في وصف المنتج، وقواعد RTL. ثم بنيت ثلاث نسخ مستقلة للصفحة الرئيسية، لكل واحدة مزاج وتكوين وخط مختلف — وكلها تحافظ على الحقائق نفسها.

النسخ
3 صفحات كاملة
الأحجام
320 → 2560
الإتاحة
0 مخالفات axe
الحركة
تحترم reduced-motion

النسخ الثلاث

اختَر الاتجاه الذي يشبهك.

كل نسخة صفحة رئيسية كاملة: هيرو، قائمة، حكاية المطبخ، خطوات الطلب، زيارة، فوتر — وليست مجرد واجهة أولى.

لقطة من النسخة الأولى: أتيليه — هيرو تحريري بخط Amiri وصورة طبق افتح النسخة
01 Editorial

أتيليه

مجلة طعام تحريرية. ورق كريمي، Amiri كبير، وصورة تُغري قبل أي كلام.

  • فهرس أطباق بأسلوب المنيو المطبوع
  • صورة تتبع الصف عند المرور
  • إيقاع تحريري هادئ وواثق
Amiri · IBM Plex Sans Arabic · Fraunces
عاين أتيليه
لقطة من النسخة الثانية: شبكة — هيرو داكن بخط Alexandria وزعفراني افتح النسخة
02 Swiss / Grid

شبكة

لغة سويسرية داكنة. شبكة ظاهرة، فهرس بيانات، وذهبي دافئ بدل الفسفوري.

  • قائمة كجدول بيانات بتصفية
  • معاينة طبق عند المرور على الصف
  • حضور معماري وحواف حادة
Alexandria · 300–800 · Gold / Bone
عاين شبكة
لقطة من النسخة الثالثة: سوق — هيرو دافئ بخط Baloo وألوان طماطم وفستق افتح النسخة
03 Warm / Playful

سوق

سوق شامي دافئ. أقواس، ملصقات، بطاقات تذاكر، واقتراح حسب مزاجك.

  • اقتراح يتغيّر حسب المزاج
  • شريط أطباق قابل للسحب
  • دفء وطاقة بلا طفولية
Baloo Bhaijaan 2 · Rubik · Tomato / Butter
عاين سوق

للمقارنة

الصفحة الحالية.

المحتوى والحقائق سليمة. المشكلة في الشكل: الهيرو الداكن والرسم التوضيحي يحجبان الشهية، والبطل البصري موحّد لكل الأقسام.

لقطة من الصفحة الرئيسية الحالية: هيرو داكن ورسم توضيحي لطبق باستا
الصفحة الحالية · 1440×1000

قراءة سريعة

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

النسخ الثلاث لا تغيّر الوقائع: الباستا تُطبخ عند الطلب، الصلصات تُحضّر يومياً، والدجاج متبّل. تغيّر فقط طريقة الحكاية.

المقارنة

أربع طرق لقول الشيء نفسه.

استخدم الجدول لاختيار المزاج، ثم افتح النسخة واختبرها على جوالك.

المعيار الحالية أتيليه شبكة سوق
الفكرة مطعم داكن وتوليدي مجلة مطعم استوديو سويسري سوق شامي دافئ
الخلفية داكن في الهيرو، كريمي بعده ورق كريمي بالكامل زيتي داكن + كتلة عظم رملي + طماطم + فستق
الخط Amiri + Alexandria Amiri + IBM Plex Alexandria Baloo + Rubik
الأطباق 4 بطاقات فهرس + صورة جدول + معاينة شريط تذاكر
الحركة كشف + شريط متحرك خاتم + كشف + ورقة تقدم + عكس صفوف سحب + مزاج + ميل
الأنسب لـ حضور محافظ راقٍ وهادئ جريء ومعاصر دافئ واجتماعي

الجوال أولاً

ثلاث شاشات، بلا اختصارات.

كل نسخة تعيد ترتيب نفسها على 390px: أزرار كاملة العرض، شريط طلب في منطقة الإبهام، وقائمة جوال تغلق بالـ Esc.

النسخة الأولى أتيليه على شاشة جوال
أتيليه · 390px
النسخة الثانية شبكة على شاشة جوال
شبكة · 390px
النسخة الثالثة سوق على شاشة جوال
سوق · 390px

ما بقي ثابتاً

الفخامة ليست تغيير الحقائق.

كل النسخ تحافظ على ما يهم: العربية أولاً، RTL منطقي، أسعار بالشيكل وأرقام لاتينية، صدق الوصف، أهداف لمس 44px، تباين AA، واحترام تقليل الحركة.

  • باستا طازة مختارة، تُطبخ عند الطلب — بدون ادعاء تصنيعها.
  • صلصات بيتية تُحضّر يومياً + دجاج متبّل.
  • التوصيل داخل قلقيلية، والدفع عند الاستلام.
  • الألوان والخطوط والمسافات من نظام واضح لكل نسخة.

المعاينة

شغّل المختبر محلياً.

النسخ صفحات ثابتة مستقلة، بلا بناء أو تبعيات. شغّل الخادم من جذر المشروع، أو افتح الملفات مباشرة من مجلد design-lab.

Terminal bash
python3 -m http.server 4173 -d design-lab

ثم افتح http://localhost:4173