الخريطة الباب ٢: التنظيم
التخطيطLayout
أين تضع العنصر يحدد متى يُقرأ.
التخطيط هو الإطار الذي يجمع كل ما تعلمناه: أين يوضع كل عنصر، وبأي ترتيب، وكم مساحة يأخذ. التخطيط الجيد يجذب العين أولاً، ثم يقود المستخدم خطوة بخطوة نحو ما جاء من أجله. والسؤال الذي يحكم كل قرار: ما الذي يهم هذا المستخدم في هذا المنتج؟
اعرض ما يبيع
في مطعم، الطعام يُشترى بالعين أولاً. التخطيط الأفقي المضغوط يضع صورة صغيرة بجانب السعر والزر، فيبدو كقائمة أسعار. أما التخطيط العمودي فيعطي الصورة مساحتها، ويجعل الطبق يبدو أشهى وأغلى.
القاعدة ليست «الصور الكبيرة دائماً»؛ القاعدة أن تعطي المساحة الأكبر لما يقرر عليه المستخدم.
عجينة تُخبز على الحطب، صلصة طماطم طازجة وجبن موزاريلا.
عجينة تُخبز على الحطب، صلصة طماطم طازجة وجبن موزاريلا.
$12 / للقطعةاطلب الآنرتّب كما يفكر المستخدم
حتى بنفس العناصر والأحجام، الترتيب يغير القراءة. ابدأ بما يجذب (الصورة)، ثم ما يعرّف (الاسم والوصف)، ثم ما يقرر (السعر)، وأخيراً الإجراء (الزر). عرض السعر أولاً قبل أن يعرف المستخدم ما الذي يدفع مقابله يقلب التسلسل الطبيعي للتفكير.
عجينة تُخبز على الحطب، صلصة طماطم طازجة وجبن موزاريلا.
عجينة تُخبز على الحطب، صلصة طماطم طازجة وجبن موزاريلا.
$12 / للقطعةاطلب الآنصفحة اختيار باقة. أي تخطيط يجعل المقارنة والاختيار أسهل وأمتع؟
نموذج يشبه نتيجته
النماذج غالباً قوائم حقول مملة. فكرة ذكية: صمم النموذج على شكل النتيجة النهائية. إذا كان المستخدم ينشئ إعلان بيع، اجعل الحقول في نفس أماكنها في بطاقة الإعلان: الصورة أعلى، الاسم والسعر في صف، ثم الوصف والموقع. هكذا يرى إعلانه يتشكل وهو يكتب.
عناصر هذه البطاقة صحيحة، لكن واحداً منها في المكان الخطأ من التسلسل. انقر عليه.
وضع التفتيش: مرّر على عناصر التصميم وانقر على موضع الخطأ — أو تنقّل بـ Tab واضغط Enter.
عجينة تُخبز على الحطب، صلصة طماطم طازجة وجبن موزاريلا.
أعد ترتيب البطاقة: ابدأ بما يجذب، وأنهِ بالإجراء.
عجينة تُخبز على الحطب، صلصة طماطم طازجة وجبن موزاريلا.
الخصائص
اختبر نفسك
١. في بطاقة طعام، ما العنصر الذي يستحق غالباً المساحة الأكبر؟
٢. ما الترتيب الطبيعي لعناصر بطاقة منتج؟
٣. ما فائدة تصميم النموذج على شكل النتيجة النهائية؟