التسلسل البصريVisual hierarchy

في سلة المشتريات ثلاثة إجراءات: حذف منتج، متابعة التسوق، وإتمام الشراء. الثلاثة مفيدة، لكنها ليست متساوية. إتمام الشراء هو سبب وجود الشاشة، ومتابعة التسوق بديل مقبول، والحذف إجراء جانبي قد يندم عليه المستخدم.

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

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

خطأ شائع في لوحات البيانات: تكبير اسم المقياس وتصغير الرقم. المستخدم يعرف أن هذه بطاقة «المبيعات» من النظرة الأولى — ما جاء ليعرفه هو كم.

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

قائمة من «عنوان: قيمة» تبدو مرتبة، لكنها تساوي بين السعر وعدد الحمّامات. استخدم الحجم لما هو أهم (السعر)، وشارة ملوّنة للحالة (للبيع)، وأيقونات صغيرة للتفاصيل المتكررة التي يمسحها المستخدم بعينه بسرعة.