UI/UX

سمعنا الفترة اللي فاتت عن مجال الـ UI/UX فخلينا نأخذكم في جولة ونكلمكم عنه شوية

 الـ UI هو اختصار لـ User Interface ومعناها واجهة المستخدم ودي الواجهة اللي بيشوفها المستخدم لما يدخل موقع معين أو تطبيق علي الموبايل علي سبيل المثال.

 الـ UX هو اختصار لـ User Experience ومعناها تجربة المستخدم وهي كل ما يخص التجربة اللي بيقوم بيها المستخدم جوا موقع أو تطبيق مثلًا وبتعتمد علي تسهيل التجربة الخاصة بيه عن طريق سهولة الوصول للعناصر وجعل التجربة سهلة وسلسة بدون أي تعقيدات.

تعالو ناخد مثال يوضحلنا المفهومين وازاي هما مكملين لبعض

وانت في طريقك للكلية من اتجاه بوابة علوم هتلاقي تفرعين، طريق مخصص للمشاة و تفرعات جانبية ممهدة بالزرع والسؤال هنا هل هتمشي في الطريق الممهد ولا هتمشي بين المزروعات وتقصر عليك الطريق؟

من الاجابة هتكتشف انك بتختار الطريق الأسهل لتوفير الوقت، فهنا فشل التصميم واتحققت تجربة مستخدم أسهل

كمان اذا كان الطريق جميل وواسع وارصفته مدهونة بألوان لطيفة وعنوان واضح وسهل الوصول إليه هل هيتحقق الـ UI/UX؟ الإجابة ايوا ولكن لو كان العنوان معقد وصعب الوصول اليه وقتها الـ UX مبيتحققش .

ودلوقتي خلينا نتكلم عن الـ UI/UX بشكل عملي أكتر

 الـ UX بيهتم بالعمليات اللي الـ User هيعملها .. بمعنى أنا عايز مثلًا App بنطلب منه أوردر قهوة فـ كـ UX هعمل شوية خطوات:

 أقعد مع المستخدم واعرف منه محتاج إيه في الـ App.

 ببدأ أحللها وارتبها واظبط أفكاري.

 بشوف الـ Apps الموجودة فعلياً بتقدم نفس المنتج، وأفكر ممكن ازود عنهم إيه.

 برسم علي ورقة شوية شخبطة بتوضح شكل بسيط للـ App، وده اسمه Wireframe.

وبعدها بشوف أقصر وأحسن طريق الـ User يطلب منه القهوة ..

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

وكمان يحدد الفئة المستهدفة ويظبط الألوان عليها فلو App لقهوة بيعمله من درجات البني ودا إسمه الـ Persona.

بعدها بعمل Prototype أو اسكتش ولو عجب العميل ببعت شغلي للـ UI يكمل عليه.

ودلوقتي جه دور الـ UI..

وببساطة بياخد شغل الـ UX ويحوله لـ ديزاين بشكل فعلي، يعمل الزرار ويظبط الـ icons ويظبط الأشكال الفنية ..

ومن هنا نوصل لتعريف أشمل لواجهة المستخدم (UI) وهي عملية بيستخدمها المصمم عشان يبنى واجهة البرنامج بس بيركز أكتر على المظهر أو النمط اللى هيظهر بيه بحيث إنها تكون سهلة وممتعة.

طب إيه البرامج اللى ممكن استخدمها عشان أقدر أعمل واجهة مستخدم؟

 برنامج Adobe XD أو Experience Design أو Figma علي Windows OS

 برنامج Sketch علي Mac OS

دول يعتبروا أهم البرامج الموجودة حالياً

وبكدا نكون فهمنا إيه هو الـ UI/UX والفرق بينهم و قد إيه هما بيكملوا بعض.

حابب تبدأ في المجال دا!

هتلاقي لينك في أول كومنت مجمع معظم المصادر الـ هتحتاجها.