التسلسل البصري في شاشة واحدة

ماذا يغطي هذا الدرس

1. 01

   العين تحتاج من يقودها

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

2. 02

   شاشة واحدة وقصة واحدة

   شاشة واحدة وقصة واحدة

   Title: العنوان: يذكر قرار الشاشة أو فكرتها في سطر واحد.

   Focal graphic: الرسم المحوري: الصورة الوحيدة التي تؤدي عملًا تعليميًا.

   Supporting text: النص الداعم: قصير وبجانب ما يشرحه.

   Primary action: الفعل الأساسي: زر أو تفاعل واحد مهيمن بوضوح.

3. 03

   قائمة CAP

   الوجه: التباين — الظهر: العنصر الأهم مختلف بوضوح، والنص يحقق 4.5:1.

   الوجه: المحاذاة — الظهر: كل عنصر يصطف مع شيء ما. لا عناصر عائمة.

   الوجه: التقارب — الظهر: العناصر المرتبطة متقاربة وغير المرتبطة متباعدة.

   الوجه: المساحة البيضاء — الظهر: المساحة تفصل المجموعات وتمنح العنصر المحوري مجالًا.

   الوجه: التوازن — الظهر: الثقل البصري موزع بحيث تُقاد العين لا تُسحب إلى زاوية.

   الوجه: التكرار — الظهر: العنصر نفسه يبدو بالشكل نفسه في كل شاشة.

4. 04

   قبل وبعد

   قبل: عنوان، وست نقاط متساوية، وصورة جاهزة، وثلاثة أزرار (التالي، المصادر، المساعدة) بالحجم نفسه.

   بعد: عنوان على شكل سؤال، ورسم معنون، وتسميتان قصيرتان، وزر أساسي واحد، والمصادر والمساعدة روابط هادئة.

5. 05

   اختبار التحديق وأنماط القراءة

   اختبار سريع: اجعلوا الشاشة ضبابية (حدّقوا أو طبّقوا تمويهًا في أداة التصميم) واسألوا ماذا ترون أولًا. إن لم يكن العنصر المحوري أو الفعل الأساسي، فقد أخفق التسلسل. وجدت أبحاث تتبع العين لمجموعة نيلسن نورمان أن قرّاء صفحات الويب المزدحمة بالنص يمسحونها غالبًا بنمط على شكل حرف F، فيقرؤون الأسطر الأولى والحافة اليسرى. في العربية يُعكس النمط إلى الحافة اليمنى. ضعوا الكلمات الحاملة للمعنى في بداية الأسطر والعناوين، في الجهة التي تبدأ منها القراءة.

6. 06

   حدّقوا في ثلاث شاشات

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