د/ايمان زغلول قاسم

استاذ تكنولوجيا التعليم المساعد بكلية التربية بالزلفي

1User Interface

واجهات التفاعل مع المستخدم User Interface:                            نبيل عزمي

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

ويتكون برنامج الكومبيوتر التعليمى فى أبسط صورة من مجموعة من الشاشات "Screens" أو الإطارات "Frames" والتى تعرض تباعاً على المتعلم، وينبغى أن تتوافر فى هذه الشاشات مجموعة من الاعتبارات الهامة، التى حددها "مصطفى جودت مصطفى صالح 1999" والتى سنذكرها هنا بشيء من التفصيل :

الاعتبارات العامة لتصميم واجهات التفاعل مع المستخدم:

1 البساطة Simplicity: وتعنى أنه عند تصميم هذه الواجهات تفضل دائماً الشاشات ذات التصميم البسيط، وليس المعقد، بمعنى انه إذا كان هناك اختيار دائم بين نموذجين لتصميم الشاشة أحدهما بسيط والأخر معقد، اختر الأبسط.

2 إتاحة قدر كاف من المساحات الفارغة Blank Spaces: وهناك فائدتان من هذا الإجراء: أولاهما أنها لن تكلف المصمم شيئاً بعكس البحث عن عناصر أخرى لملئ هذه الفراغات، وثانيهما أنها تعمل على إبراز ووضوح باقى العناصر الموجودة بالشاشة، أو على الإطار، فهذه الفراغات تعمل كالبراويز التى تحيط بهذه العناصر فتوضحها.

3 اتزان عناصر الإطار Balance: ويتعلق الاتزان بطريقة توزيع العناصر على الإطار وداخل الفراغات، والتوزيعات المنتظمة "Symmetric" أو شبه المنتظمة، والتى تعنى التماثل حول المحور الأفقى أو الرأسى المار بمركز الشاشة، أو التماثل حول مركز الشاشة؛ لا تكفى لإحداث الاتزان بل يجب مراعاة مبدأ الوحدة "Unity" والشكل التالى يعطى مثالاً على الوحدة والتماثل، ففى الشاشة الأولى تتماثل العناصر حول المحور الرأسى والأفقى المار بمركز الشاشة، كما تتماثل أيضاً حول مركز الشاشة، ولكن تبدو العناصر فيها مبعثرة وغير متحدة معاً، وتبدو وكأنها متنافرة، بينما فى الشاشة الثانية توجد كل قواعد التماثل، ولكن يضاف إليها مبدأ الوحدة؛ حيث تتقارب الأشكال وتنتظم متجاورة معاً.





شكلين يوضحان مبدأ الاتزان والوحدة فى تصميم الشاشات

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

شكل يوضح اتجاه التصميم بداية من مركز الشاشة

5 استخدام العناصر المألوفة Familiarity : يفضل استخدام العناصر المألوفة لدى المتعلم لكى يتفاعل مع البرنامج، فالسهم الأفقى المتجه يساراً يعنى الصفحة التالية، والسهم الأفقى المتجه يميناً يعنى الصفحة السابقة، وهكذا، هذا بالإضافة إلى تثبيت نفس الأشكال والرموز المستخدمة داخل نفس البرنامج، بل ووضعها فى نفس المكان عبر الشاشات المختلفة، وهذا يرتبط بالاتساق فى تصميم هذه الشاشات، ومساعدة المتعلم على تكوين بعض المدركات التى تكون لديه رموز وأشكال مألوفة خلال نفس البرنامج.

6 التركيز على العناصر المرسومة والمصورة Figuring: وذلك فى مقابل استخدام النصوص المكتوبة، وبالتالى كل ما يمكن تحويله إلى رسوم وصور وأشكال هندسية وتخطيطية، فانه يجب تحويله فوراً بدلاً من التعبير عنه فى صورة حروف وكلمات وجمل.

7 تعدد النوافذ Multiple Windows: وهذا يعنى تقسيم الإطار إلى عدة نوافذ متجاورة، وهذا مفيد فى حالة عرض مجموعة متكاملة من الوسائط فى نفس الوقت، فقد يتم تقسيم الإطار وبشكل تلقائى فى كل إطارات عرض المعلومات إلى نافذة يعرض من خلالها النص المكتوب، ونافذة تعرض من خلالها الصور والرسوم الثابتة وربما لقطات الفيديو، بالإضافة إلى حيز على صورة شريط أفقى أسفل الشاشة تعرض بداخله كل أزرار التفاعل.

8 تعدد الإطارات Multiple Frames: تختلف الإطارات حسب الغرض منها : فهناك إطارات لتقديم الأسئلة، وإطارات لتقديم التغذية الراجعة، وأخرى لتقديم المعلومات، وأخرى للمساعدة، وغيرها . والواقع إنه يجب الاتفاق على شكل لتصميم كل نوع من هذه الإطارات، فإذا تم وضع هذا التصميم وتعديله وصياغته فى شكل نهائى، فسوف يتم استخدام هذا التصميم فى كل مرة يتم فيها تقديم هذا النوع من الإطارات خلال نفس البرنامج، وبالتالى ينصح بالاتفاق على شكل التصميم المناسب لكل نوع قبل البدء فى تصميم البرنامج نفسه.

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

شكل تخطيطى يبين تقسيم الشاشة لمساحات وظيفية

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

11 تنظيم محتويات الإطار مع حركة العين: عند تصميم الشاشة فلابد من مراعاة حركة العين فى مسح الشاشة، فالعين تتجه أولاً إلى أعلى يمين الشاشة ثم تتجه يساراً ثم تهبط إلى الأسفل ( كما لو كانت تقرأ نصاً مكتوباً باللغة العربية )، والعكس صحيح بالنسبة للغة الإنجليزية، وبالتالى يتم تنظيم الشاشة وترتيب عناصرها تبعاً لهذه الحركة.

التدرج فى عرض الإطارات:

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

الوقت من ذهب

اذكر الله


المصحف الالكتروني