Lecture 4 - Advanced Graphical Interfaces PDF

‫تصميم واجهات المستخدم‬ ‫‪Lecture 4‬‬ ‫‪1‬‬  ‫المبادئ العامة لتصميم واجهات‬ ‫المستخدم الرسوماتية‬ ‫ توفير الجاذبية البصرية و ذلك باآلتي‪:‬‬ ‫توفير تباين ‪contrast‬بين عناصر الشاشة‪.‬‬ ‫–‬ ‫خلق تجمعات...

‫تصميم واجهات المستخدم‬ ‫‪Lecture 4‬‬ ‫‪1‬‬  ‫المبادئ العامة لتصميم واجهات‬ ‫المستخدم الرسوماتية‬ ‫ توفير الجاذبية البصرية و ذلك باآلتي‪:‬‬ ‫توفير تباين ‪contrast‬بين عناصر الشاشة‪.‬‬ ‫–‬ ‫خلق تجمعات ‪ groupings‬بين العناصر المتشابهة في الشكل و‪/‬أو‬ ‫–‬ ‫المعنى‪.‬‬ ‫تنظيم عناصر الشاشة‪.‬‬ ‫–‬ ‫توفير التمثيل الثالثي االبعاد‪.‬‬ ‫–‬ ‫استخدام األلوان بشكل فعال وبسيط‪.‬‬ ‫–‬ ‫توفير الوضوح لجميع‪:‬‬ ‫ ‬ ‫العناصر البصرية ‪.Visual elements‬‬ ‫–‬ ‫الوظائف ‪. Functions‬‬ ‫–‬ ‫المجازات ‪Metaphors.‬‬ ‫–‬ ‫الكلمات والنصوص ‪.Words and text‬‬ ‫–‬ ‫‪2‬‬ ‫المبادئ العامة لتصميم واجهات‬ ‫المستخدم الرسوماتية‬ ‫ إتاحة التوافق للمستخدم في ‪:‬‬ ‫– المهام والوظائف‪.‬‬ ‫– وجهة نظر المستخدم مع المصمم‪.‬‬ ‫ توفر الوضوح بالسماح للمستخدم من ‪:‬‬ ‫الشئ الذي ينظر إليه في الشاشة‬ ‫– معرفة‬ ‫مايجب أن يفعل إلنجاز المهمة‬ ‫– معرفة‬ ‫متى يفعل ذلك‬ ‫– معرفة‬ ‫لماذا يفعل ذلك‬ ‫– معرفة‬ ‫كيف يفعل ذلك‬ ‫– معرفة‬ ‫‪3‬‬  ‫المبادئ العامة لتصميم واجهات‬ ‫المستخدم الرسوماتية‬ ‫ توفير التناغم باآلتي‪:‬‬ ‫– المكون‪j‬ات المتماثل‪j‬ة ينبغي أن يك‪j‬ون له‪j‬ا ش‪j‬كل مماث‪j‬ل‬ ‫واس‪j‬تخدامات متماثل‪j‬ة وتعم‪j‬ل ب‪j‬المثل‪.‬نفس اإلج‪j‬راء‬ ‫ينبغي أن يؤدي إلى نفس النتيجة‪.‬‬ ‫– ال ينبغي تغيير العناصر المهمة‬ ‫– ال ينبغي تغيير أماكن العناصر القياسية‪.‬‬ ‫– اتب‪jj‬اع المع‪jj‬ايير والمب‪jj‬ادئ التوجيهي‪jj‬ة (مث‪jj‬ل واجه‪jj‬ة‬ ‫مايكروسوفت ويندوز ‪ ،‬وغيرها‪).‬‬ ‫‪4‬‬  ‫المبادئ العامة لتصميم واجهات‬ ‫المستخدم الرسوماتية‬ ‫ إعطاء المستخدم التحكم في الواجهة‪ ،‬و ذلك باالتي‪:‬‬ ‫يجب أن تكون اإلجراءات نتيجة صريحة لطلبات‬ ‫–‬ ‫المستخدمين ‪.‬‬ ‫يجب أن تتم اإلجراءات على وجه السرعة ‪.‬‬ ‫–‬ ‫يجب أن يكون المستخدم قادرًا على ايقاف اإلجراءات او‬ ‫–‬ ‫إنهاؤها ‪.‬‬ ‫يجب أن يشعر المستخدم بأنه متحكم بالنظام‪.‬‬ ‫–‬ ‫بجب أن تتسلسل األفكار و األعمال‪.‬‬ ‫–‬ ‫توفير الكفاءة ‪.‬‬ ‫–‬ ‫استخدام األلفة و استخدام االستعارات بواقعية‪.‬‬ ‫–‬ ‫‪5‬‬  ‫المبادئ العامة لتصميم واجهات‬ ‫المستخدم الرسوماتية‬ ‫ توفير المرونة من خالل دعم‪:‬‬ ‫– المستخدم لالستفادة من معارفه ومهاراته‬ ‫– التفضيل الشخصي للمستخدم‬ ‫– عادات المستخدم‬ ‫ توفير رسائل أخطاء بناءة عند حدوث الخطأ‪.‬‬ ‫ توفير طريقة للتخلص من االخطاء و العودة الفورية إلى نقطة معينة‬ ‫عند حدوث الخطأ‪.‬‬ ‫ تقديم البساطة‪.‬‬ ‫– جعل اإلجراءات المشتركة بسيطة‪.‬‬ ‫– التوحيد‪.‬‬ ‫الشفافية‪.‬‬ ‫ ‬ ‫– يجب على المستخدم اال يشعر بالقلق ازاء المشاركة‪.‬‬ ‫‪6‬‬  ‫الواجهات الرسوماتية المتطورة‬ ‫‪Advanced graphical interfaces‬‬ ‫ توج‪jjjj‬د الكث‪jjjj‬ير من الواجه‪jjjj‬ات الرس‪jjjj‬وماتية‬ ‫المتط‪jjjj‬ورة و ال‪jjjj‬تي تحّس ن من إمكاني‪jjjj‬ات‬ ‫المس‪jjj‬تخدم في الوص‪jjj‬ول إلى المعلوم‪jjj‬ات و‬ ‫استكش‪jj‬اف وتجس‪jj‬يد المعلوم‪jj‬ات‪.‬مث‪jj‬ال على‬ ‫ذلك‪:‬‬ ‫– الص‪jjjjjj‬ور المتحرّك‬ ‫ة التفاعلي‪jjjjjj‬ة ‪interactive‬‬ ‫‪animations‬‬ ‫– البيئات االفتراضية ‪virtual environments‬‬ ‫‪7‬‬  ‫الواجهات الرسوماتية المتطورة‬ ‫‪Advanced graphical interfaces‬‬ ‫ واجه‪/‬ات الوس‪/‬ائط المتع‪/‬ددة ‪multimedia‬‬ ‫هي الواجه‪j‬ات ال‪j‬تي تجم‪j‬ع وس‪j‬ائط ‪ media‬تفاعلي‪j‬ة مختلف‪j‬ة‬ ‫–‬ ‫في واجهة واحدة‪.‬‬ ‫مث‪j‬ل أش‪j‬كال مختلف‪j‬ة من الرس‪j‬ومات و النص‪j‬وص و الفي‪j‬ديو‬ ‫–‬ ‫الصوت والصور المتحرّكة‪.‬‬ ‫يق‪jj‬وم المس‪jj‬تخدم ب‪jj‬النقر ‪ click‬على الرواب‪jj‬ط ‪ links‬في‬ ‫–‬ ‫ج أو‪j‬ج ‪j‬ز‪j‬ء م‪j‬ن‬‫ص‪jj‬ورة‪ j‬أو‪j‬نّص في‪j‬ظه‪jj‬ر ج‪jj‬ز ‪j‬ء‪j‬آخ‪jj‬ر‪j‬م‪j‬ن‪j‬البرن‪jj‬ام ‪j‬‬ ‫رّكة‪j‬أو ي‪j‬تم ت‪j‬ش‪j‬غّيل لق‪j‬ط‪j‬ة ف‪j‬ي‪j‬ديو‪.j‬بع‪j‬د‬‫ب‪j‬رن‪j‬ام‪j‬ج آخ‪j‬ر‪j‬أو ص‪j‬ور‪jj‬متح ‪j‬‬ ‫رج‪j‬ع إلى مكان‪j‬ه أو االن‪j‬تق‪j‬ال‪j‬إلى‬ ‫ذل‪j‬ك‪j‬يس‪j‬تطيع المس‪j‬تخدم أن ي ‪j‬‬ ‫مكان آخر عن طريق الروابط‪.‬‬ ‫الش‪jj‬كل الت‪jj‬الى ي‪jj‬بين بيئ‪jj‬ة تعلمي‪jj‬ة بالوس‪jj‬ائط المتع‪jj‬ددة من‬ ‫–‬ ‫‪BioBlast‬‬ ‫‪8‬‬ ‫الواجهات الرسوماتية المتطورة‬ ‫‪Advanced graphical interfaces‬‬ ‫‪.‬بيئة تعليمية بالوسائط المتعددة‬ ‫‪9‬‬  ‫الواجهات الرسوماتية المتطورة‬ ‫‪Advanced graphical interfaces‬‬ ‫ الحقيق‪/‬ة االفتراض‪/‬ية والبيئ‪/‬ات االفتراض‪/‬ية ‪Virtual reality‬‬ ‫‪and virtual environments‬‬ ‫تزوي‪j‬د محاك‪j‬اة للواق‪j‬ع عن طري‪j‬ق الحاس‪j‬وب وهي تعطي المس‪j‬تخدم إحس‪j‬اس‬ ‫–‬ ‫ن الم‪j‬الحظة الخا‪j‬رجية لمثل‪ j‬هذه البيئة‪.‬‬ ‫االشتراك‪j‬ف‪j‬ي بيئة‪ j‬صناع‪j‬ية‪jj‬بدال م ‪j‬‬ ‫الش‪j‬كل الت‪j‬الى يوض‪j‬ح تص‪j‬ميمًا ثالثي األبع‪j‬اد و تص‪j‬ميمًا ثن‪j‬ائي األبع‪j‬اد لنفس‬ ‫–‬ ‫اللعبة‪.‬‬ ‫تق‪jj‬دم أنواع‪ًjj‬ا جدي‪jj‬دة من التجرب‪jj‬ة‪ ،‬تمّكن المس‪jj‬تخدمين من التفاع‪jj‬ل م‪jj‬ع‬ ‫–‬ ‫ثالثي األبع‪j‬اد ‪.D space 3‬‬ ‫األجسام ‪j‬و ال‪j‬تنّقل ف‪j‬ي فضاء ‪j‬‬ ‫تخل‪j‬ق تج‪j‬ارب ‪ experience‬تفاعلي‪j‬ة جّذاب‪j‬ة ج‪j‬دا للمستخدم ‪.‬‬ ‫–‬ ‫من مس‪j‬اوئ الواجه‪j‬ات الحقيق‪j‬ة االفتراض‪j‬ية وخصوص‪j‬ا البيئ‪j‬ات االفتراض‪j‬ية‬ ‫–‬ ‫ض الم‪j‬حمول‪jj‬ة‪j‬على‬ ‫المدم‪j‬ج‪jj‬ة‪ /augmented realityj‬أن ش‪j‬اش‪jj‬ات الع‪jj‬ر ‪j‬‬ ‫‪j‬ل‬ ‫خد‪j‬م‪j‬في‪jj‬التفاع ‪j‬‬ ‫‪j j Head-mounted displays jj‬و ال‪j‬تي تس‪j‬ت ‪j‬‬ ‫ال‪j‬رأس ‪j‬‬ ‫ن الن‪j‬اتج من‬‫ب الغثي‪j‬ا ‪j‬‬ ‫ن‪j‬تس‪ّj‬ب ‪j‬‬ ‫ع الو‪j‬اج‪j‬ه‪j‬ة‪ ،‬غ‪j‬ير مريح‪j‬ة‪ j‬في‪ j‬اللب‪j‬س ك‪j‬م‪j‬ا‪j‬ي‪j‬مكن أ ‪j‬‬ ‫م‪j j‬‬ ‫الحركة ‪ motion sickness‬و‪j‬التضليل ‪.disorientation‬‬ ‫‪10‬‬ ‫الواجهات الرسوماتية المتطورة‬ ‫‪Advanced graphical interfaces‬‬ ‫شاشات العرض المحمولة على الرأس التي‬ ‫تستخدم في التفاعل مع واجهة البيئات االفتراضية‬ ‫‪11‬‬ ‫المدمجة‬ ‫الواجهات الرسوماتية المتطورة‬ ‫‪Advanced graphical interfaces‬‬ ‫االختالف في التصميم ثالثي األبعاد و ثنائي األبعاد لأللعاب‬ ‫‪12‬‬  ‫اللغة الطبيعية‬ ‫‪Natural language‬‬ ‫‪ -5‬اللغة الطبيعية ‪Natural language‬‬ ‫– هذا الن‪j‬وع من ان‪j‬واع التفاع‪j‬ل لم ينجح تمام‪j‬ا في ح‪ّj‬ل‬ ‫عملي لواجه‪j‬ات المس‪j‬تخدم‪.‬و ذل‪j‬ك بس‪j‬بب ص‪j‬عوبة‬ ‫تط‪jj‬بيق أنظم‪jj‬ة عالي‪jj‬ة الكف‪jj‬اءة معتم‪jj‬دة على اللغ‪jj‬ة‬ ‫الطبيعي‪jjj‬ة‪.‬ه‪jjj‬ذا الن‪jjj‬وع من التطبيق‪jjj‬ات في أغلب‬ ‫األحي‪jjj‬ان مس‪jjj‬تند على تقني‪jjj‬ات ال‪jjj‬ذكاء الص‪jjj‬ناعي‬ ‫‪ Artificial Intelligence‬مث‪jj‬ل ش‪jj‬بكات االنتق‪jj‬ال‬ ‫المدمجة ‪augmented transition networks‬‬ ‫‪13‬‬ ‫االستفسار ‪ Query‬أو أسلوب سؤال ‪ /‬جواب ‪Question/answer‬‬ ‫‪ -6‬االستفسار ‪ Query‬أو أسلوب سؤال ‪ /‬جواب‬ ‫‪Question/answer‬‬ ‫أس‪j‬اوب االستفس‪j‬ار يوّج ه المس‪j‬تخدم خالل التفاع‪j‬ل عن‬ ‫ ‬ ‫طريق سلسلة من األسئلة‪.‬‬ ‫يستخدم أغلب األحيان في أنظمة المعلومات‪.‬‬ ‫ ‬ ‫مث‪jj‬ال للغ‪jj‬ات االستفس‪jj‬ار ‪ SQL‬ال‪jj‬تي تس‪jj‬تعمل لبن‪jj‬اء‬ ‫ ‬ ‫االستفس‪jjj‬ارات و‪j‬الس‪jjj‬ترجاع‪j‬المعلوم‪jjj‬ات من‪j‬قواع‪jjj‬د‬ ‫البيانات‪.‬‬ ‫االس‪jj‬تخدام الفع‪jj‬ال للغ‪jj‬ة ‪ SQL‬يتطلب فهم أساس‪jj‬يات‬ ‫ ‬ ‫قواع‪j‬د البيان‪j‬ات و ترك‪j‬يب الل‪j‬غة ‪.language syntax‬‬ ‫‪14‬‬