تصميم وتطوير موقع متكامل لشركة أثاث اسمه Furni

أنا المصمم والمطور الوحيد لمشروع فرني، وهو موقع كامل لشركة أثاث راقية. الموقع ليس مجرد واجهة عرض بل نظام متكامل مكون من 10 صفحات تعمل بتناسق تام: الرئيسية، من نحن، المتجر، سلة المشتريات، إنهاء الطلب، صفحة شكر، المدونة، الخدمات، اتصل بنا، وصفحة تفاصيل المنتج. صممت الهيكل بحيث يكون متجانساً في كل الصفحات من حيث شريط التنقل والفوتر الموحد، مع تخصيص المحتوى لكل صفحة حسب وظيفتها. في الصفحة الرئيسية، نفذت هيرو احترافياً بعنوان "استوديو التصميم الداخلي الحديث" وزرين رئيسيين (تسوق الآن / استكشاف). أسفل منه، صممت قسم المنتجات المميزة بأحدث الكراسي (Nordic Chair - Kruzo Aero - Ergonomic Chair) مع أسعارها وزرار شراء. ثم أنشأت قسم "لماذا تختارنا" يحتوي على 4 مميزات أساسية: شحن سريع مجاني، سهولة الشراء، دعم 24/7، استرجاع بدون متاعب. كما أضفت قسم الشهادات (Testimonials) وآخر المقالات من المدونة. صفحة "من نحن" تعرض نفس المميزات الأربعة بالتفصيل، بالإضافة إلى فريق العمل المكون من 4 أعضاء مع صورهم ومناصبهم ووصف مختصر، وكل عضو له زرار "اعرف أكثر". صفحة المتجر صممت على شكل شبكة منتجات ديناميكية، كل منتج يحمل صورة، اسم، سعر، وزر إضافة للسلة، مع شريط فلترة جانبي لتصفية النتائج حسب السعر أو التصنيف. صفحة السلة تعرض المنتجات المختارة في جدول، مع إمكانية تعديل الكمية أو حذف منتج، ويظهر إجمالي السلة وحقل تطبيق كوبون الخصم. صفحة إنهاء الطلب تحتوي على نموذج متكامل لبيانات العميل (الاسم، العنوان، البريد، الهاتف)، وخيارات إنشاء حساب أو الشحن لعنوان مختلف، وطرق دفع متعددة (تحويل بنكي، شيك، PayPal)، مع ملخص الطلب وزر تأكيد. بعد إتمام الدفع، تظهر صفحة "شكراً" مع رسالة تأكيد وزرار العودة للمتجر. صفحة المدونة تتضمن قائمة بالمقالات الحديثة، كل مقالة تحوي عنوان، كاتب، تاريخ، وزر قراءة المزيد، مع أدوات جانبية للبحث والتصنيفات. صفحة الخدمات تشرح بالتفصيل المميزات الأربعة التي تقدمها الشركة، وتعرض أيضاً المنتجات المميزة وآراء العملاء. صفحة اتصل بنا تحتوي على خريطة، عنوان، بريد إلكتروني، تليفون، ونموذج مراسلة مكون من حقلي اسم وبريد ورسالة، مع التحقق من صحة الإدخال. جميع صفحات الموقع متجاوبة بالكامل مع شاشات الموبايل، التابلت، والكمبيوتر، باستخدام تقنيات Flexbox و Grid ضمن إطار Tailwind CSS. اعتمدت في التطوير على HTML5 لهيكل الصفحات، Tailwind CSS للتنسيق السريع والنظيف، وجافا سكريبت ES6 لتنفيذ الوظائف التفاعلية مثل: القوائم المنسدلة، تبديل علامات التبويب، تحديث السلة محلياً، تطبيق كوبونات الخصم، التحقق من صحة النماذج، وعرض رسائل التأكيد. كما التزمت باستخدام Git لإدارة الإصدارات، وتنظيم الكود بتعليقات واضحة ليسهل صيانته وتطويره لاحقاً. المهارات المستخدمة تطوير واجهات أمامية، HTML5، Tailwind CSS، JavaScript ES6، تصميم متجاوب، Flexbox & Grid، Git، نماذج البيانات، تخزين محلي للسلة.