ما هو الـ Ui و Ux ؟ ما الفرق بينهما ؟
إذا كنت تظن أن تصميم المواقع مجرد شخبطات وتلاعب بالأشكال وإضافة للخطوط والألوان فأنت غلطان يا صديقي
ماهو الفرق بين واجهة المستخدم وتجربة المستخدم؟
ما هو ال Ui ؟
الـ Ui هي اختصار لل User Interface والتي تعني بالعربية واجهة المستخدم
بمعنى أيش ؟
يعني هي المرحلة النهائية من تصميم الموقع، الي يظهر فيها بالشكل الاخير من الوان وصور وازره (يتفاعل) معها المستخدم
حلوين
طيب كيف طلعت فكرة واجهة المستخدم؟ مين بدأها؟
لكن مايكروسوفت و آبل بدأو يستخدمون الرسوم في الشاشه
وصارت تحط تصميم الواجهة في كود مستقل عن كود الوظائف
بحيث ماتصير مشاكل وعند حدوثها توضح الملف المُستخدم
طيب اوكي فهمت عليك بس وش الهدف منها؟
الهدف منها ياطويل العمر هو تمكين المستخدم من التفاعل مع الواجهة دون العبث في أكوادها سواءً كانت تطبيق أو موقع
حلوين؟ 🤝🏻
ننتقل لتجربة المستخدم 👇🏻
ما هي ال Ux ؟
ال UX تعني تجربة المستخدم
من وجهة نظر هي مُكملة لواجهة المستخدم وهي بكل بساطة
بناء واجهة الموقع مع مراعاة احتياجات المستخدم ✨
اعطيك مثال👀؟
موقع لرفع الصور ،كموقع صور بحاجة إلى أساسيات يجب أن تتوفر لكي ترضي المستخدم ، خيار لإضافة صورة ثم لحذف الصورة وغيرهم
طيب نجي للكلام الجد؟ وش الفرق بينهم؟
عملية البناء الي هي الاساس هي مركز الاختلاف بينهم
يعني مصمم واجهة المستخدم مو مقيد بأي شروط أثناء عمله ، فأنا كمصمم واجهات اقدر اصمم الي ابي اخلي الخلفية بيضاء مع خط اصفر
بينما
مصمم تجربة المستخدم مقيد كثيرًا
لازم يلبي احتياجات المستخدم ورغباته
كلها في التصميم مع توقع كافة المشاكل التي تواجه المستخدم لطرح الحلول لها وأن يعرف الأمور التي يحبها المستخدم في مشروعه والأمور التي يكرهها ليتجنبها
لذلك انت كصمم واجهة المستخدم تقدر تحدد الاتجاه الي تبيه
وانت كمصمم تجربة المستخدم تتعامل مع الموقع كانك مستخدم له تتوقع وش ممكن يخطر في باله
نصائح للمبتدئين ..
1. استخدم اللون الأبيض دائماً كخلفية وركز على ألوان العناصر الأخرى في التصميم.
تابع 👇
2.استخدم خط Cairo للعربي
وخط Roboto للغة الانجليزية.
لتحميل الخطوط :
تابع 👇
3. استخدم هذ الموقع لاختيار تنسيقات ألوان جاهزة ومناسبة لتصميمك.
4. استخدم صور حية بتصاميمك لتضيف لمسة جمالية للتصميم وإعطائه بعض المشاعر.
وهنا جمعت فيها أفضل المواقع لتحميل الصور:
5. استخدم أيقونات احترافية مجانية وقابلة للتعديل من هذا الموقع.
6. لاتبدأ من الصفر، أعد تصميم تطبيقات جاهزة الموجودة على جوالك أو من مواقع الإلهام البصري مثال على هذه المواقع:
مصدر ميم واصيل
تعليقات
إرسال تعليق