فقاعات رضا العملاء في الصورة الرئيسية
تحتاج منطقة الصورة الرئيسية إلى وسوم مؤشرات تجارية آنية لاستكمال معلومات قيمة العميل.
تنبثق فقاعات الرضا والعائد على الاستثمار وغيرها من المؤشرات في حلقة مع رسوم متحرّكة للخروج.مواد القبول
01الحفاظ على الأسلوب البصري العام مشرقًا ونظيفًا
02يجب أن تمتلك الأزرار الرئيسية حالة نقر واضحة
03تحتفظ الصفحة الرئيسية بالعناصر البصرية ذات الطابع التقني
04تُحمَل وحدات المحتوى عبر البطاقات
05يجب أن يغطّي النص الجوهري القدرة والسيناريو والقيمة
06تُستخدم الأرقام الرئيسية للتأكيد على إيقاع الصفحة
07تحتفظ الصفحات الرئيسية بمدخل واضح للحثّ على اتخاذ إجراء
08ألا يقلّ النص الأساسي عن 14px
09شريط التنقّل مثبَّت في أعلى الصفحة
10تحتاج كل صورة إلى تعليق نصّي أسفلها
11توحيد line-height عند 1.6
12يغطّي الـ favicon جميع المقاسات الشائعة
01يجب أن تُقدّم الصورة الرئيسية الفريق وواجهة المنتج ونطاق العلامة التجارية في آنٍ واحد.
02تظل أنماط الأزرار موحّدة على مستوى الموقع، بنصف قطر زوايا 12px.
03تُستخدم الحركة لتعزيز التسلسل الهرمي دون التأثير على القراءة الأساسية.
04يحتفظ قسم قصص العملاء بخانات عرض النتائج.
05يُعطي تخطيط الأجهزة المحمولة الأولوية لقابلية قراءة النص عند 14px.
06يستخدم شريط التنقّل position: sticky ويبقى مثبَّتًا أثناء التمرير.
07يجب عدم إغفال خصائص alt للصور والتعليقات النصية أسفلها.
ملاحظات التصميم
تحتاج منطقة الصورة الرئيسية إلى وسوم مؤشرات تجارية آنية لاستكمال معلومات قيمة العميل.
تنبثق فقاعات الرضا والعائد على الاستثمار وغيرها من المؤشرات في حلقة مع رسوم متحرّكة للخروج.تحتاج العناوين والروابط إلى ردّ فعل بصري واضح في حالة hover.
تدرّج قوس قزح + إضاءة كاسحة + تدوير درجة اللون + توهّج.تحتاج الأزرار إلى ردّ فعل ديناميكي أقوى عند hover/click مع الحفاظ على ثبات منطقة النقر.
تتحرّك الطبقة البصرية باستخدام translateY بينما تبقى منطقة النقر في مكانها.يحتاج التنقّل العلوي إلى إحساس مادّي شبه شفّاف بعمق متعدّد الطبقات.
خلفية زجاجية backdrop-filter + إضاءة كاسحة + رسوم طفو خفيفة.يوفّر وضع قراءة مركّزًا يقلّل من التشتّت البصري.
قناع بملء الشاشة + نصف قطر ضوء كاشف يتبع المؤشر للتحكّم في المنطقة المرئية.يوسّع التعرّف على العلامة التجارية بحيث تبقى حركة المؤشر متّسقة مع الأسلوب البصري للصفحة.
مؤشر SVG يحمل هوية العلامة التجارية + تأثيرات جسيمات متعقِّبة.تحتاج صفحة قصص العملاء إلى منطقة عرض غامرة ثلاثية الأبعاد.
مصفوفة جسيمات WebGL + تفاعل بالفأرة + لوحات ديناميكية.يحتاج أسفل الصفحة إلى منطقة ختامية للعلامة التجارية تظل مرئية باستمرار.
ماسة دوّارة ثلاثية الأبعاد + شريط متحرّك للعلامة التجارية + ألوان ديناميكية.تحتاج الصورة الرئيسية إلى تقديم مشهد الفريق وعلامة richify.net في آنٍ واحد.
يُضمَّن شعار علامة richify.net في منطقة شاشة الحاسوب المحمول.