متجر ملابس مبني ليعرض المنتجات بوضوح.
نظرة عامة
متجر ملابس أونلاين بواجهة متجر وعرض منتجات مبنية خصيصاً.
9-Nine براند ملابس يبيع أونلاين. المتجر مبرمج من الصفر بتقنية Nuxt، مع مجموعات وعرض منتجات مصمّم خصيصاً للملابس.
التفاصيل
المنصة:
النوع:
متجر أزياء
الأدوات:
Nuxt (Vue.js) custom storefront, product reviews, WhatsApp chat
اللغة:
الإنجليزية
الموقع:
صفحات الموقع
لقطات حقيقية لأهم صفحات الموقع، مقسّمة لأجزاء. بدّل بين الصفحات من التبويبات، واسحب أو استخدم الأسهم، واضغط على الصورة في المنتصف لعرضها بالحجم الكامل.
مرّر الماوس لتتصفّح الصفحة الرئيسية كاملة
مميزات الموقع
الأجزاء اللي تصنع الفرق في هذا المشروع، وطريقة تنفيذ كل جزء.
01
واجهة مبنية من الصفر، لا من قالب
المتجر ما يعتمد على قالب جاهز. الواجهة تطبيق Nuxt مخصص بـ Server-Side Rendering، فأول شاشة تفتح بسرعة والصفحات تظل قابلة للأرشفة في جوجل.
طريقة التنفيذ
- واجهة Nuxt وVue.js مع Server-Side Rendering
- هيدر ثابت فيه البحث والسلة، وسلايدر بعرض الصفحة
- قائمة تغطي الكل، رجالي، حريمي، أطفال، الجديد، الأكثر مبيعاً، والموسمين
02
كرت منتج واحد في كل مكان
الجديد، الأكثر مبيعاً، وكل المجموعات تستخدم نفس المكوّن، مع إضافة سريعة عند الوقوف بالماوس، فالعميل يملأ السلة بدون ما يفتح صفحة منتج.
طريقة التنفيذ
- مكوّن كرت منتج قابل لإعادة الاستخدام مع إضافة سريعة
- أي صف جديد مجرد إعداد، بدون كتابة كود
03
فلاتر بدون تحميل الصفحة من جديد
راوند نك، بولو، بنطلون ملتون، هوديز: أزرار فلترة تحدّث الشبكة في مكانها مع عدد المنتجات مباشرة، وهذه ميزة بناء الواجهة بدل تعديل قالب.
طريقة التنفيذ
- أزرار فلترة تحدّث الشبكة بدون تحميل
- مسار تنقل وعدد منتجات مباشر
04
صفحة منتج ترد على اعتراضات العميل بنفسها
التقييم، السعر، اختيار اللون والمقاس مع دليل المقاسات، ثم التفاصيل والعناية والاسترجاع قابلة للطي، وتحتها تقييمات موثّقة بتوزيع النجوم كاملاً.
طريقة التنفيذ
- معرض صور بأسهم، اختيار اللون والمقاس، دليل المقاسات
- أكورديون للتفاصيل والعناية والاسترجاع
- قسم تقييمات بتوزيع النجوم وشارات التوثيق
تحتاج موقع بنفس المستوى لبراندك؟
احكِ لي عن مشروعك، وأرسم لك الهيكل والربط وخطة الإطلاق، وأبنيه بشكل يليق ببراندك ويبيع.