شو هو الـ UI & UX
تعرّف على مفهوم واجهة المستخدم (UI) وتجربة المستخدم (UX)، والفرق الأساسي بينهما، وأهميتهما لمهندس جودة البرمجيات أثناء عملية الفحص.
قبل ما تبدأ
- Usability Testing اختبار قابلية الاستخدام
الخلاصة بنقاط
- واجهة المستخدم (UI) تركز على المظهر البصري للتطبيق مثل الألوان، الخطوط، الأزرار، والترتيب الشكلي.
- تجربة المستخدم (UX) تركز على السلوك والسلاسة والشعور العام للمستخدم أثناء التنقل داخل التطبيق.
- الـ UI هو ما يراه المستخدم (Look & Feel)، بينما الـ UX هو ما يشعر به ويجربه (Overall Experience).
- فحص الـ UI يضمن مطابقة التصميم المعتمد، بينما فحص الـ UX يضمن سهولة الاستخدام ومنطقية الخطوات.
يُعد كل من UI (User Interface) و UX (User Experience) من المفاهيم الجوهرية في تصميم وفحص البرمجيات، ورغم ارتباطهما الوثيق إلا أنهما يعبران عن جانبين مختلفين كلياً:
1. واجهة المستخدم (User Interface - UI)
تُمثل الجانب البصري والجمالي للتطبيق والذي يتفاعل معه المستخدم بشكل مباشر.
- التركيز: العناصر الملموسة مثل الأزرار، القوائم، الألوان، أنواع الخطوط، والأيقونات.
- الهدف: تقديم تصميم جذاب، متناسق، ومريح للعين.
- دورة الـ QA: يتأكد المهندس من مطابقة التصميم الفعلي لتصاميم Figma أو Adobe XD (متحاذاة النصوص، تناسق المسافات والألوان).
2. تجربة المستخدم (User Experience - UX)
تُمثل الانطباع والسهولة العامة التي يشعر بها المستخدم أثناء رحلته داخل التطبيق لتحقيق هدف معين.
- التركيز: التدفق (User Flow)، البنية الهيكلية للمعلومات، وسرعة وسلاسة الوصول للحلول.
- الهدف: حل مشكلة المستخدم بأقل جهد ممكن وبدون ارتباك.
- دورة الـ QA: يتأكد المهندس من أن الخطوات منطقية، وأن التنقل بين الشاشات واضح ولا يتطلب ضغطات غير ضرورية.
الخلاصة: يمكن تشبيه التطبيق بالسيارة؛ الـ UI هو شكل السيارة الخارجي، لونها، وتصميم مقاعدها، بينما الـ UX هو مدى سلاسة القيادة، راحة المقاعد، وسهولة التحكم أثناء الطريق.
التمييز بين مشاكل الـ UI ومشاكل الـ UX
- المشكلة الأولى: زر "التالي" لون الخط فيه غير واضح بسبب الخلفية المماثلة. حدد هل هذه مشكلة UI أم UX.
- المشكلة الثانية: للوصول لصفحة الدفع، يتعين على المستخدم المرور بـ 7 شاشات مختلفة وإدخال بيانات مكررة. حدد نوع هذه المشكلة.
تذكر دائماً: الـ UI يركز على العناصر البصرية، بينما الـ UX يركز على الرحلة والجهد المبذول للوصول للهدف.
اكشف الحل
- المشكلة الأولى: UI Issue (لأنها تتعلق بالمظهر البصري ووضوح الألوان والعناصر).
- المشكلة الثانية: UX Issue (لأنها تتعلق بطول رحلة المستخدم والتصميم المعقد للخطوات).
شاهد 90% من الفيديو حتى ينحسب هذا الدرس مكتمل.





النقاش 🔻