1.معلومات عامة

اسم المساق رقم المساق الساعات المعتمدة
تصميم واجهات المستخدم 133208 2
الفصل الثاني من العام الاكاديمي: 2023 - 2024

3.وصف المساق والاهداف

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


4.المخرجات التعليمية

أهداف مساق مادة تصميم واجهات المستخدم باستخدام Adobe XD بإيجاز:

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

2. اكتساب مهارات استخدام Adobe XD لتصميم واجهات المستخدم.

3. تطبيق مبادئ التصميم لتحسين تجربة المستخدم.

4. تطوير التفاعلات والحركات لتعزيز جاذبية الواجهات.

5. تحليل وتقييم الواجهات وتحسينها بناءً على الملاحظات.

6. تعزيز المهارات الإبداعية والتفكير التصميمي.

7. إنشاء مشاريع عملية لتطبيق المفاهيم المكتسبة.

8. تواصل فعال وتعاون مع الزملاء في عمليات التصميم والتقييم.


5.المخطط التفصيلي

الأسبوع المحتوى التفاصيل
1 مقدمة للمادة وأهدافها.
2 تعلم نظرية الألوان ومدلولاتها. كيفية استخدامها بالشكل الصحيح بالتطبيقات وتصميمات التطبيقات وصفحات الويب. كيفية دمج الألوان بشكل متناسق وفعال.                                
3 أنواع الخطوط ومعانيها. دلالات استخدامها وكيفية استخدامها. المبادئ الخاصة باستخدامها.                                   امتحان قصير #1
4 مقدمة لبرنامج Adobe XD وميزاته الأساسية.                                  
5 استكشاف أساسيات تصميم الواجهات UI.      تطبيق التحليل النظري على تصميم واجهة مبسطة باستخدام برنامج Adobe XD                    واجب #1
6 مفهوم تجربة المستخدم وأهميتها.                                   الفرق بين تجربة المستخدم وتصميم واجهة المستخدم. أوجه التشابه بين تجربة المستخدم وتصميم واجهة المستخدم. تعيين المشروع
7 مبادئ تصميم التجربة وفهم احتياجات المستخدم.  تطبيق مفاهيم تصميم الواجهات المختلفة مثل تخطيط الشاشة واختيار الألوان والصور.  مشاريع تطبيقية لتحسين مهارات التصميم. امتحان قصير #2
8-9 التعرف على عملية تصميم الواجهات بشكل كامل: –Client brief –Wireframe. –Prototype الامتحان النصفي
10-13 تطوير مشاريع متقدمة باستخدام Adobe XD وتحليلها. تحسين مهارات التصميم الخاصة بهم من خلال تعلم التقنيات المتقدمة لتصميم الواجهات.       استعراض الممارسات الجيدة في التصاميم. اختبار وتقييم تجربة المستخدم باستخدام تقنيات التصميم الأساسية.  واجب #2 & #3 امتحان قصير #3
14 استخدام المكونات الجاهزة والأصول في Adobe XD لتسريع عملية التصميم.  إضافة تفاعلات وحركات للعناصر في الواجهة باستخدام Adobe XD. تصميم وتحريك الرسومات والرموز لإضافة جاذبية للواجهة.
15 مراجعة وتحليل تصميمات الواجهة مع التركيز على التجربة النهائية للمستخدم.  تحسين التصميمات بناءً على ملاحظات المستخدمين والاختبارات. مناقشة وتسليم المشروع
16 الامتحان النهائي                                  

6.السياسات المتبعة

  • يتم تطبيق السياسة الخاصة بالجامعة على حالات الحضور والغياب.
  • يتم عمل اختبارات قصيرة تذكير الطالب بالمادة بشكل مستمر.
  •  أي محاولة غُش تؤدي الى العلامة صفر.
  • التأخر في تسليم المشروع او الواجبات يؤدي الى خصم، كالتالي:
  • بعد يوم واحد ١٠٪ وبعد يومين ٢٠٪ وبعد ثلاث أيام ٣٠٪ وما أكثر تُعطى العلامة 0.


7.اساليب التقييم

معيار التقييم العلامة ملاحظات
امتحانات قصيرة 10
مشروع 20
امتحان نصفي 30
امتحان نهائي 40

8.المراجع والمادة الداعمة

هذه بعض الموارد المفيدة لتعلم تصميم واجهات المستخدم (UI/UX) باستخدام Adobe XD:

      1. كتب:

        • "Designing Interfaces: Patterns for Effective Interaction Design" لجينيفر تيدر.
        • "Don't Make Me Think" لستيف كروغ.
        • "The Design of Everyday Things" لدونالد نورمان.
        • "100 Things Every Designer Needs to Know About People" لسوزان واي.
        • "The Elements of User Experience" لجيسي جيمس جاريت.
        1. Adobe XD Tutorials:
        1. Adobe XD يقدم مجموعة واسعة من الدروس التعليمية على موقعهم الرسمي. يمكنك العثور على دروس حول كيفية البدء في استخدام البرنامج، وكيفية إنشاء تصاميم متقدمة، واستخدام الميزات المختلفة.
        1. Adobe XD website: https://www.adobe.com/products/xd/learn.html
        1. موارد مجتمع Adobe XD:
        1. المجتمع الخاص بـ Adobe XD على موقع Behance يحتوي على العديد من الأعمال والمشاريع والموارد المفيدة التي يمكن الاستفادة منها.
        1. يمكنك الاطلاع على أعمال المصممين الآخرين، ومشاركة أسئلتك، والتفاعل مع المجتمع للحصول على تعليمات ونصائح إضافية.
        1. YouTube Tutorials:
        1. YouTube يحتوي على مجموعة كبيرة من الفيديوهات التعليمية حول Adobe XD، بما في ذلك دروس للمبتدئين والمتقدمين.
        1. يمكنك البحث عن مقاطع الفيديو حسب مواضيع محددة مثل تصميم الرموز، وإنشاء تجارب المستخدم، واستخدام الميزات المتقدمة في Adobe XD.
        1. دورات عبر الإنترنت:
        1. مواقع مثل Udemy و Coursera و LinkedIn Learning توفر دورات تعليمية متخصصة في Adobe XD وتصميم واجهات المستخدم.