كل المشاريع

دار أزياء عراقي

نورة الحافظ

الدور
UI/UX · Frontend · Backend
الموقع
noraalhafidh.com
التاريخ
متجر نورة الحافظ على الهاتف

دار نورة الحافظ، دار تصميم أزياء عراقي بغدادي حصري.

تطوير شعار نورة الحافظ

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

سبب تطوير الشعار مع بناء الموقع هو عدم ملاءمة حجم وتصميم الشعار الأول، فالنسخة الأولى كانت تتعارض مع تصميم الموقع. لذا كان الاقتراح الأولي من طرفي، وأول شيء ركزت على تطويره قبل كل شيء هو الشعار.

شاشات من واجهة نورة الحافظ تعرض المنتجات والقياسات الخاصة ومراجعة الطلب وصفحة المنتج

الواجهة وتجربة المستخدم

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

noraalhafidh.com

النمط المعتاد للمتاجر

  1. تدخل للمنتج
  2. تختار القياس
  3. تختار اللون
  4. تثبت الطلب

تشبيه النمط بداخل نورة الحافظ

تدخل صفحة المنتج

  • أكثر من اختيار قياس بنفس الصفحة
  • قياسات إضافية بداخل كل قياس
  • إضافات مختلفة على مختلف القياسات

نظام مخصص مسار مقطوع

مشكلة الطلب

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

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

بس هنا، النظام شلون راح نضبطه؟ وشلون راح نخلي الواجهة ترسم التغييرات بدون ما تأثر على باقي القياسات والامتدادات داخل الموقع، وحتى خانة القياسات الخاصة؟

الحل ما جان صفحة… جان محرّك.

الحل

بدل ما أخزّن كل الاحتمالات، خزّنت القواعد اللي تولّدها.

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

الواجهة ما بيها منطق ثابت، تقرأ المخطط وتبني نفسها. والسعر ما يُختار من قائمة، ينحسب من قواعد المخطط. والطلب ينحفظ كلقطة كاملة لكل قرار أخذته الزبونة، حتى لو تغيّر سعر المنتج بعدها.

وأهم شي.. مسار القياسات الخاصة ما بقى نظام منفصل، صار امتداد لنفس المخطط. نفس القطع ونفس الخانات، الفرق الوحيد إنه بدون سعر مسبق، ويتحدد بعدها.

لوحة التحكم

تم تصميم لوحة التحكم بصلاحيات للموظفين والمالك فقط.

تصميم مطبوعات ضمن تطوير مشروع نورة الحافظ

مطبوعات نورة الحافظ، استمارة المقاسات الخاصة وقائمة الحساب ووصل القبض

التقنيات المستخدمة

  • JavaScript
  • JSX
  • React.js
  • SQLite
  • JWT
  • Multer
زيارة موقع نورة الحافظ

عندك فكرة تحب تطبقها؟

لنبنيها معًا

لنتحدث