الكلثم
منتجات العناية بالبشرة والشعر تُدرَس قبل أن تُشترى؛ الناس يقارنون قوائم المكونات، ويقرؤون كيف يسير الروتين، ويريدون أن يروا النتيجة قبل أن يثقوا بمنتج على بشرتهم. لذلك صُمّمت صفحة المنتج في الكلثم لتحمل هذا القرار بدل أن تقف في طريقه: المكونات، وموضع المنتج في الروتين، والنتيجة التي يستهدفها، بالوزن نفسه الذي يحمله السعر وزر الإضافة إلى السلة.
وكل ما يسبق تلك الصفحة بُني ليكسبها بإنصاف: تصنيفات مرتبة كما يتسوّق الناس فعلاً بحسب مشكلة البشرة أو الشعر، وفلترة تُضيّق الخيارات بدل أن تُثقلها، وسلة ودفع يبقيان بعيدين عن الطريق بمجرد اتخاذ القرار. كل شاشة رُسمت بمحتوى منتج حقيقي لا نص بديل، وكل حالة تفاعلية — فارغة أو قيد التحميل أو خطأ — صُمّمت عمداً لا تُركت لمن يخمّنها لاحقاً.
ما الذي يحققه التصميم
القرارات التي يقوم عليها هذا المشروع.
القصة كاملة في صفحة
المكوّنات والروتين والنتائج مجتمعة، لا مبعثرة.
موجّه لا مُربِك
التفاصيل الكثيفة موزّعة بإيقاع يُبقي المتسوّق معها.
مصمّم ليُفهَم
كل معلومة موضوعة حيث يتكوّن السؤال.
واجهة محورها صفحة المنتج
ثلاث قطع تحمل قرار العناية بالبشرة والشعر من التصفح حتى الدفع.
صفحة منتج تتولى الإقناع
المكونات والروتين والنتيجة بالوزن نفسه الذي يحمله السعر وزر الإضافة إلى السلة، مرسومة بمحتوى منتج حقيقي لا نص بديل.
كل حالة تفاعلية مرسومة
السلة الفارغة، وحالة التحميل، ونفاد المخزون، وشاشات الخطأ — كلها مصمَّمة عمداً، لا مُتروكة لمطوّر يرتجلها.
مكتبة مكوّنات
أزرار وبطاقات وفلاتر وحقول نماذج بُنيت مرة واحدة وأُعيد استخدامها في المتجر كله، فتبقى الصفحات الجديدة متسقة مع اتساع الكتالوج.
أربع مراحل، من الرف إلى الشاشة
صفحة المنتج تُرسم أخيراً، بعد أن يستقر كل ما يقود إليها.
البحث
أمر على مجموعة المنتجات، وكيف تُشرح المكونات والروتين عادة، وكيف يتصفّح الناس منتجات العناية بالبشرة والشعر على الإنترنت.
المخططات الهيكلية
يُحسم التخطيط والمسار — من التصنيف إلى المنتج إلى السلة — بدقة منخفضة أولاً، قبل أي قرار بصري.
التصميم البصري
تُطبَّق الألوان والخطوط والصور بعد أن يثبت الهيكل، وتحمل صفحة المنتج المكونات والروتين والنتيجة كمحتواها الأساسي.
التسليم
تُسلَّم كل شاشة وكل حالة تفاعلية كمكتبة مكوّنات، جاهزة للتطوير دون تخمين.
تفاصيل المشروع
تبنين متجراً تتولى صفحة المنتج فيه الإقناع؟ شاهدي خدمة تصميم واجهات وتجربة المستخدم.