تصميم واجهات التفاعل في برامج الوسائل المتعددة التعليمية (ج1)

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

د. مصطفى جودت مصطفى صالح

د. مصطفى جودت مصطفى صالح

يرتبط مصطلح ” واجهة التفاعل مع المستخدم User Interface” مع كثير من المصطلحات الأخرى مثل “واجهة التفاعل الرسومية مع المستخدم ([1]) ([2]) Graphical User Interface (GUI)” و “واجهة تفاعل الوسائل المتعددة مع المستخدم Multimedia User Interface (MUI) ” و “واجهة التفاعل المنطقية مع المستخدم Logical User Interface (LUI)([3]) ” و “واجهة التفاعل المسموعة مع المستخدم ([4]) Auditory User Interface (AUI)” … الخ ، لذلك يمكن التساؤل : ما المقصود بواجهة التفاعل مع المستخدم ؟

واجهة التفاعل مع المستخدم UI والتي تسمى أيضاً “واجهة تفاعل الكمبيوتر مع المستخدم Computer-User Interface ” تمثل الحدود بين المستخدم ونظام الكمبيوتر . حيث يتفاعل المستخدم سواء كان شخصاً أو مجموعة أشخاص مع الكمبيوتر بشقيه الآلة والبرنامج . يتم هذا التفاعل من خلال قناة اتصال يمكن التعبير عنها بالرسم التالي ([5]) :

interface1

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

 

وتنقسم واجهة التفاعل إلى شقين : شق منطقي وشق آخر محسوس.

يتعلق الشق المنطقي بالمنطق الذي يتفاعل به البرنامج مع المستخدم وقد تطرق الفصل السابق إلى بعض الأسس المتعلقة بتفاعل البرنامج التعليمي مع المتعلم. ويتعلق الشق المحسوس بكل ما يرى أو يسمع أثناء التفاعل مع الكمبيوتر. وقد ظهر مصطلح “واجهة التفاعل الرسومية GUI” في بادئ الأمر قبل التوجه إلى الوسائل المتعددة وتوظيفها في التعليم. ويؤثر التصميم البصري لواجهة التفاعل على انطباع الدارس نحو البرنامج، ومدى فهمه له ورغبته في استخدامه. ويضم التصميم البصري جميع العناصر المرئية في واجهة التفاعل مثل تنظيم الشاشة Screen Layout ، وعرض المعلومات، وتقديم التعليمات المرئية ([6]) .

وقد ركزت كثير من البحوث والدراسات على تصميم الشاشات ووضعت لذلك عدة معايير مثل الاتساق ، والتوازن ، والتجانس، وراحة المستخدم في تفاعله مع البرنامج Ergonomics ويتصل ذلك بما يسمى “هندسة الاستخدام Usability Engineering([7]) “. وقد أصدرت المنظمة الدولية للتوحيد القياسي ISO معياراً أطلق عليه ISO 9241 والمتعلق براحة المستخدم أثناء تفاعله مع العناصر المرئية في شاشة الكمبيوتر . ([8])

في مرحلة تالية أضيف الصوت إلى برامج الكمبيوتر التعليمية ، ولا يقصد بالصوت مجرد أصوات الأجراس والصفارات بل الموسيقى والمؤثرات الصوتية مما ساهم في ظهور مصطلح “واجهة التفاعل المسموعة مع المستخدم AUI” ولا يعني ذلك الفصل بين واجهة التفاعل المسموعة وواجهة التفاعل الرسومية بل يتمثل في معالجة للصوت في البرنامج بشكل منفرد .

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

1 – مبادئ عامة في تصميم واجهات التفاعل:

يستعرض فيما يلي عدد من المبادئ العامة التي تتصل بتصميم الشاشات ([9]) في البرنامج التعليمي : –

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

(2) إتاحة قدر كافٍ من المساحات الفارغة Blank Spaces : والتي لا تكلف المبرمج شيئاً بعكس المواد المطبوعة بل تساعد على وضوح باقي العناصر المستخدمة في الإطار .

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

int1

اتزان عناصر الشاشة وعلاقته بمبدأ الوحدة

 

(4) المركز البصري لشاشة الكمبيوتر هو في الوسط بالضبط ، لذلك يجب أن تنظم العناصر بحيث تبدأ من الوسط لأنه أكثر المناطق التي تركز عليها عين المستخدم.

int2

تحديد مركز الشاشة

(5) استخدام الصور المألوفة في تصميم واجهة التفاعل يؤدي إلى تقليل الإجراءات اللازمة للتعامل مع النظام ، لذلك يجب أن يرتبط تصميم الشاشات بخبرة وبيئة المتعلم من جهة، وبموضوع البرنامج من جهة أخرى ([11]). ومن الصور المألوفة استخدام الأكواد اللونية المتعارف عليها، واستخدام الخطوط المألوفة، وعرض الرسومات التعليمية من منظور مألوف.

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

(7) التركيز على الرسومات أكثر من النصوص في تصميم الإطارات: عند احتواء الإطار على عناصر نصية كثيرة يجب إعادتها إلى المصمم ليركز على الجوانب الرسومية ، في مقابل النص المكتوب أو المسموع ([12]) .

(8) استخدام أكثر من نافذة Multiple Windows ([13]): قد تستخدم أكثر من نافذة في نفس الإطار ويطلق على ذلك أسلوب النوافذ المتعددة Multiple Windows والذي يساعد على استغلال مساحة الإطار بشكل أكبر حيث يمكن أداء أكثر من وظيفة في نفس الوقت. وترتب تلك النوافذ داخل الإطار بشكل متجاور أو بشكل متراكب وذلك في حالة الرغبة في استخدامها في نفس الوقت .

(9) استخدام أكثر من إطار Multiple Pages “ Frames” ([14]) : كما يستخدم أكثر من نافذة في نفس الإطار فإنه يستخدم كذلك أكثر من تصميم للإطارات في نفس البرنامج . فلا يجب تصميم نمط موحد لجميع إطارات البرنامج ، بل يفضل أن يكون التصميم معبراً عن وظيفة الإطار ،بحيث يكون لدينا تصميماً موحداً لإطارات عرض المعلومات ، يختلف عن تصميم آخر خاص بإطارات الأسئلة ، وآخـر لإطارات المساعدات . ويجب الاحتفاظ بالاتساق بين تصميم الإطارات التي تقوم بنفس الوظيفة ، مثلاً التصميم الموحد لإطارات التوجيهات أو التحذيرات يجعل المتعلم يدركها حتى قبل أن يقرأ كلمة تحذير.

(10) تقسيم الشاشة إلى مناطق وظيفية بحيث يتم تحديد المناطق التي يظهر فيها التعليق ، كذلك مناطق ظهور المساعدات ، والمناطق التي تظهر فيها أزرار التفاعل ، حيث يجب مراعاة ما يلي([15]) :

أ. تحديد مساحات تتناسب مع المحتوى .

ب. وضع المساحات الوظيفية الصغيرة حول الحواف ، وليس في وسط الشاشة ، ووضع العناصر الهامة في وسط الشاشة .

ج. تنسيق العناصر في أشكال منطقية ومألوفة ، وهنا يجب مراعاة اتجاه قراءة اللغة ففي اللغة العربية يكون العنصر الأول في أعلى يمين الشاشة ، وفي الإنجليزية يكون في أعلى يسار الشاشة .

(11) تجميع العناصر المتصلة ببعضها البعض بحيث تتجاور معاً ، كما يمكن إحاطتها بإطار لتمييزها عن العناصر الأخرى .

(12) في حالة استخدام أزرار على الشاشة ، يفضل أن جعل الأزرار الأكثر استخداماً جهة اليمين .

(13) تنظيم محتويات الإطار مع حركة العين ([16]) : بينت البحوث على أن الدارسين باللغة الإنجليزية – كلغة أولى – تتحرك أعينهم بين محتويات الشاشة بداية بأعلى يسار الشاشة ثم تنزل إلى الأسفل متجه نحو اليمين ثم تعود إلى اليسار مرة أخرى في أسفل الشاشة كما لو كانت تسير في شكل العلامة ( < ) ، وبمراعاة أن اللغة العربية تقرأ من اليمين إلى اليسار أي عكس اتجاه اللغة الإنجليزية فإن حركة العين يتوقع أن تكون في شكل ( > ) .

 

2 – تدريج بناء إطارات البرنامج :

تتميز إطارات البرنامج عن صفحات الكتاب في أن محتواها لا يظهر مرة واحدة بعكس صفحة الكتاب حيث يتم بناء محتويات الإطار بصورة تدريجية بحيث تبقى العناصر المستخدمة فقط عليها ، مع التحديث المستمر لمحتوياتها وفقاً للقواعد التالية ([17]) :

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

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

(3) تقسيم النصوص الطويلة : يجب أن يظهر محتوى النص الطويل في الإطار بالتدريج ، بحيث تظهر عدة جمل ثم ينتظر البرنامج إشارة من المستخدم لعرض جزء آخر من النص مع الإبقاء على النص السابق.

(4) الإشارة لبداية إطار جديد : يمكن تمييز بداية إطار جديد عن طريق مصاحبته لمؤثر صوتي أو بصري مميز بحيث يدرك المتعلم أنه بدأ في جزء جديد من البرنامج وليس تابع للإطار السابق.

 

3 – توظيف اللون في البرنامج : ([18])([19])

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

 

(1) استخدام اللون استخداماً وظيفياً : يجب تجنب الألوان غير الضرورية في النص، وتجنب أن يقود اللون عين المستخدم إلى أماكن غير هامة كالفواصل بين المناطق المتجاورة، والخلفيات المبالغ فيها، وبدلاُ من ذلك يستخدم اللون فيما يلي :-

أ . التمييز بين العناصر المختلفة باستخدام لون مميز لكل فئة من العناصر يميزها عن باقي العناصر .

ب . تركيز الإتمام ، مثل تمييز العناوين بلون مختلف عن باقي النص .

ج . الربط بين العناصر المتشابهة باستخدام لون موحد لها.

د . تسريع عملية البحث داخل النصوص الطويلة : فقد يضطر إلى كتابة مقال مطول في إطار واحد مثل إطارات المساعدات ، حيث يفضل استخدام اللون في تمييز الكلمات الأساسية Keywords للإسراع في عملية البحث في النص.

(2) تخير اللون المناسب للهدف : وذلك من خلال مراعاة ما يلي :-

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

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

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

(3) تجنب الألوان الصارخة : وخاصة اللون الزهري ، واللون الأرجواني Purples، والدرجات الفاتحة جداً من الألوان Pastels لأنها تختلف وفقاُ لنظام العرض المستخدم حيث يختلف نظام العرض في الحاسبات فيما يتعلق بعدد الألوان الممكن عرضها وأبرزها أحادي اللون، ونمط عرض 16 لون ، ونمط عرض 256 لون ، ونمط عرض 16 مليون لون ، ولا تظهر الدرجات السابق ذكرها في النمط أحادي اللون وتختلف درجاتها بين الأنماط الثلاثة التالية له .

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

(5) تجنب نقص التباين اللوني Contrast Deficiency : لابد من المحافظة على قدر من التباين بين الشكل والأرضية . فلا ينبغي استخدام اللون الأصفر مع اللون الأبيض ، ولا اللون الأزرق الغامق مع اللون الأسود.

(6) تجنب الزيغ اللوني Chromatic Aberration : يجب تجنب استخدام اللون الأزرق الصريح أو الأحمر الصريح في كتابة أية نصوص طويلة ، ويرجع ذلك إلى خاصية الزيغ اللوني Chromatic Aberration التي تجعل شبكية العين غير قادرة على التركيز في تفاصيل تلك الألوان ، فتظهر غائمة Fuzzy.

(7) تجنب حالات العمى اللوني عند توظيف اللون في واجهة التفاعل : بينت الدراسات أن 9% من الرجال مصابون بالعمى اللوني ، و 2% من السيدات مصابات بالعمى اللوني . كما بينت أن جميع المستخدمين يصابوا بالعمى اللوني المؤقت عند النظر إلى شاشة الكمبيوتر في الضوء المنخفض . لذلك يجب الحرص في توظيف اللون في واجهة التفاعل وعدم الاعتماد على قدرة المتعلم في تمييز الألوان.([20])

 

4 – عرض النص المكتوب :

يقصد بالنص المكتوب كل ما تحتويه الشاشة من بيانات مكتوبة تعرض على المستخدم أثناء تفاعله مع البرنامج ، وقد تعرضت العديد من الدراسات لطبيعة النص أسس عرضه داخل البرنامج ومنها دراسة الفرد بورك Alfred Bork([21])، ودراسة وليام هورتون William Horton([22]) عن استخدام النص في برامج الوسائل الفائقة خاصة المقدمة عبر الشبكات، ودراسة لاركن Larkin ([23]) التي قدمت خطوات إرشادية لعرض النص المكتوب داخل برامج الكمبيوتر التعليمية . ومن أهم الإرشادات التي وردت في الدراسات السابق ما يلي :-

(1) شاشة الكمبيوتر ليست كصفحة الكتاب ، لذلك يجب أن تحتوي على قدر أقل من النص وتكتب ببنط أكبر حيث أن مقدار وضوح شاشة الكمبيوتر تقل عن مقدار وضوح الكتاب .

(2) تجنب استخدام الفقرات الطويلة والاعتماد على العبارات التلغرافية المختصرة . فقد وجد أن استخدام الفقرات المطولة في الشرح يجهد المستخدم ، ويصيبه بالملل .

(3) استخدم سطور قصيرة في كتابة النصوص ، حيث وجد من خلال البحوث التجريبية أن السطور القصيرة تتطلب حركة عين أقل في القراءة .

(4) يصبح الجمع بين النص والصورة في نفس الإطار ضرورياً في الحالات التالية :

أ . كون النص جزءاً من الرسم كما هو الحال في الرسومات البيانية.

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

ج . إذا كان النص هو الأساس ، والرسم عنصراً مساعداً ،كما في برامج تعليم الكتابة على لوحة المفاتيح .

(5) الحرص على وضوح المعنى : بعكس الكتاب فإن المتعلم الذي يتعلم عن طريق الكمبيوتر ليس لديه الوقت الذي يفقده في التفكير في معاني الكلمات أو إحضار قاموس لفهم معنى عبارة معينة ، فغالباً ما تحدد استجابة المتعلم بوقت معين ، لذا فلا يجب إضاعة وقت المتعلم في محاولة فهم معنى السؤال

(6) وضع العبارات المرتبطة ببعض بشكل متقارب على الشاشة .

(7) تجريب حجم الخط ونوعه على عينه من المستفيدين قبل الموافقة على استخدامه في البرنامج للتأكد من إنقرائيته.

(8) استخدام خطوط ذات حواف ملساء، وتجنب الخطوط غيرالمألوفة أو المزخرفة في كتابة كتل النص داخل البرنامج .

(9) تطبع بعض الخطوط بشكل جميل ومقروء على الورق، إلا أن شكلها على شاشة الكمبيوتر لا يكون بنفس الجودة، لذلك يجب اختيار الخط المناسب للعرض على شاشة الكمبيوتر. و تعد الخطوط TrueType مناسبة للعرض والطباعة معاً في نظام نوافذ مايكروسوفت.

(10) استخدام اللغة العربية في واجهة التفاعل الرسومية يعد أكثر صعوبة وتعقيداً من استخدام اللغة اللاتينية لأن الحرف العربي يتغير وفقاً لموقعه من الكلمة لذلك يجب التحقق من سهولة قراءة الخط في جميع الحالات. كما يجب استخدام شفرة تعريب موحدة تتيح تبادل البرنامج بين أكثر من منصة عرض. ويستخدم برنامج نوافذ مايكروسوفت نظام تعريب يختلف عن التعريب الذي تستخدمه برامج صخر ، لذلك فقد كان من الضروري على من يريد قراءة النص العربي في تلك البرامج من بيئة النوافذ أن يحمل نظام تعريب صخر على النسخة اللاتينية من النوافذ ، ولكن في عام 1995 قامت شركة صخر بتغيير شفرة تعريبها واعتمدت تعريب مايكروسوفت كتعريب قياسي لبرامجها . لكن تكمن المشكلة في جانب آخر وهو عدم ثبات نظم التعريب بين الإصدارات المختلفة في نوافذ مايكروسوفت ، فإذا كتب سطر نصي بخط Traditional Arabic على سبيل المثال من خلال نوافذ مايكروسوفت الإصدار 3.11 ، ثم تم تشغيله من الإصدار 95 فإنه يلاحظ بتغير أشكال بعض الحروف وأحجامها، مما دعا بعض البرامج إلى تطوير خطوطها الخاصة وتحميلها مع البرنامج أثناء تشغيله حتى لا تختلف باختلاف منصة العمل. وقد تكون المشكلة أكبر بالنسبة للبرامج المطروحة على الانترنت حيث تتعدد منصات العمل ونظم التعريب. وهذا ما دعا إلى إصدار معايير لتعريب النص في واجهة التفاعل في برامج الكمبيوتر فأصدرت المنظمة الدولية للتوحيد القياسي معيار ISO 8859-6 ([24]) والمتفق مع معيار ASMO 708 إلا أنه لا يتفق تماماً مع معايير تعريب مايكروسوفت . وقد تمت معالجة تلك المشكلة في برامج استعراض الشبكات بحيث يمكنها أن تقرأ نفس الصفحة وفقاً لأكثر من طريقة، إلا أن هذه الطريقة لا تصلح في البرامج التعليمية التي لا تعمل من خلال برامج استعراض. وقد حاولت بعض البرامج تخطي تلك العقبة عن طريق عرض النص في شكل صور.

(11) العمل على زيادة قيمة التباين اللوني بين الخط والخلفية.

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

(13) يتأثر حجم الخط المثالي ( ارتفاع الحرف ) بعدة عوامل منها حجم شاشة الكمبيوتر، والكثافة النقطيةPixel للعرض، والقدرات البصرية لدى المستخدم .وبشكل عام كلما زادت الكثافة النقطية للشاشة كلما صغر حجم الخط .

int3

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

 

بعد تحديد كثافة العرض يجب تحديد الحجم المناسب للخط بحيث تكون زاوية الرؤيا المثالية حوالي 0.35 درجة وقد حدد المعهد الوطني الأمريكي للمعايير “الأنسي ANSI ” المعادلة التالية لحساب ارتفاع الحرف ([25])

حجم الحرف (الارتفاع ) = ثابت (0.01745) × مسافة الرؤية × زاوية الرؤية

int4

الجزء التالي بإذن الله سيتناول أسس عرض الرسومات والصور الثابتة في برامج الكمبيوتر متعددة الوسائل.

 

المصادر:

[1] – Lucas, Leslie. Visually Designing the Computer – Learner Interface . Educational Technology . july 1991, p 56.

[2] – Bishop, Pam. CIT Mathimatics Workshop 11 : Design of Mathimatics Courseware with a gtaphical user interface (GUI) : ( http://www.bham.ac.uk/ctimath/workshops/wrui.htm ) , 28 – 12 – 96 , p1.

[3] – UNESCO. op., cit., p 2.2-7 .

[4] – Winn, William. Non – Speach Sound in Human – Computer Interface : a review and design guidlines. Educational Computing Research. Vol. 11, No. 3, 1994, p 211.

[5] – UNESCO. op., cit., p 2.2- 1

[6] – Lucas, Leslie. op., cit., p 56.

[7] – Poole, Bernard J. op., cit., p 363.

[8] – Perlman, Gary. Interactions : User Interface Guidelines and Standards . ( http:\\www.acm.org/ ~perlman/Interactions/21-std.html ), 27-09-97 , p 2.

[9] – يستخدم مصطلح إطار كمرادف لمصطلح الشاشة ، وفضلنا هنا استخدام مصطلح الإطار حتى لا يختلط مسمى الشاشة Screen بمسمى آخر هو Monitor وهو بعيد كل البعد عن عن واجهات التفاعل . كما أن مصطلح إطار أكثر شيوعاً في التطبيقات التربوية وذلك لإنتقاله من ميدان التعليم البرنامجي إلى ميدان التعلم باستخدام الكمبيوتر .

[10] – Lucas, Leslie. op., cit., p 57.

[11] – Park, Innwoo. & Michael J. Hannafin. Empirically-Based Guidelines for the design of Interactive Multimedia. Educational Technology Research and Development, Vol. 41, No. 3, 1993, p72.

[12] – Bork, Alfred. op., cit., p 157.

[13] – Horton, William. Designing and Writing online documentation : Hypermedia for self supporting products . – 2nd ed . – New York : John Wiley & Sons, Inc., 1994, p 234.

[14] – Larkin, Jill H., & Ruth W. Chabay. Computer Assisted Instruction and Intelligent Tutoring System : shard goals and complementary approaches .- New Jersy : L.E.A. Publishers, 1992, p161.

[15] – Horton, William. op.cit., p 233.

[16] – Human Factors International . Usability through the software Ergonomics : Interface Design & Usability Testing. ( http:\\www. humanfactors.com/layout/layout.htm ) , 20-04-98, p1

[17] – Larkin, Jill H., & Ruth W. Chabay. op., cit., p 161.

[18] – Horton, William.op., cit., p 241.

[19] – Human Factors International. op., cit., (http:\\www ……/color/color.htm), 20, 04, 98, p1

[20] – المرجع السابق .

[21] – Bork, Alfred. op., cit., p 157 – 160.

[22] – Horton, William. op., cit., p 246- 251 , p 262 – 273.

[23] – Larkin, Jill H., & Ruth W. Chabay. op., cit., p 157.

[24] – Portaneri, Frank. & Fethi Amara. Arabization of Graphical User Interface. ( http:// sparta. spartacus.com/langbox/staff/arastub.html ) , 22 – 1 – 97 , p 2.

[25] – Horton, William. op., cit., p 246- 251 , p 251.

بناءا على طلب عددا من الأصدقاء فيسعدني إعادة نشر أسس تصميم واجهات التفاعل التي سبق ونشرتها في موقع بوابة تكنولوجيا العليم القديم ، وفي عددا من كتبي بصور مختلفة ، ويتم النشر على ثلاثة أجزاء بإذن الله هذا هو الجزء الأول أدعو الله أن يكون مفيدا للقارئ. يرتبط مصطلح " واجهة التفاعل مع المستخدم User Interface" مع كثير من المصطلحات الأخرى مثل "واجهة التفاعل الرسومية مع المستخدم ([1]) ([2]) Graphical User Interface (GUI)" و "واجهة تفاعل الوسائل المتعددة مع المستخدم Multimedia User Interface (MUI) " و "واجهة التفاعل المنطقية مع المستخدم&hellip;

عناصر المراجعه :

تقييم المستخدمون: 4.7 ( 1 أصوات)

عن د مصطفى جودت

أستاذ تكنولوجيا التعليم المشارك بجامعة الملك سعود ، وجامعة حلوان مدير تطوير المحتوى الرقمي بجامعة الملك سعود
error: Content is protected !!
التخطي إلى شريط الأدوات