الفرق بين UI & UX

UI اختصارا ل User Interface : وهي واجهة المستخدم، كيفية تصميم واجهة المستخدم، وكيفية وضع الأزرار والصناديق والصور ... إلخ

UX اختصارا ل User Experience: وهي تجربة المستخدم، أي كيف كانت نظرة المستخدم حول المنتج، هل ارتاح باستخدامه بشكل عام، هل أتعبه، هل كان صعباً في جزئيات معينة، مثلاً لم يستطع إيجاد زر التسجيل، أو أن العملية كانت صعبة، أو مثلا الألوان صاخبة وغير مريحة، أو أنه لم يعرف كيف يستخدم المنتج أو البرنامج من الأساس.

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

بينما المنتج الثاني ( الصورة اليمينية) اهتموا بالواجهة، ولكنهم اهتموا أيضاً بتجربة المستخدم، فالكاتشاب في الحالة الثانية أسهل في الاستخدام من الأولى.

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

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

هذا مصدر رائع للقراءة أكثر عن الموضوع :

هل هي تقريبا نفس مهام ال front end developer

لا وظيفة front-end غير وظيفة مصمم UI / UX .

وظيفة مصمم UI / UX :

هي المرحلة ما قبل التكويد وعمل front-end وهو التصميم وتجربة المستخدم الذي يصممه مصمم ui ux على برامج مثل photoshop و adobe xd يصمم صفحات على هذه البرامج على حسب قوانين معينة لكي يكن التصميم بتجربة مستخدم رائعة وجميلة وهي أول مرحلة في إنشاء موقع ويب .

وظيفة مصمم FRONT-END :

هو تكويد التصميم الذي تم إنشاءه من قبل مصمم UI/IX تنفيذ التصميم بلغات البرمجة الخاصة بالفرونت أيند وبدء التكويد وجعل الموقع ديناميك بعض الشئ .

فهما وظيفتين مختلفتين ويمكن دمجهم لدى شخص واحد ولكن هذا الشخص سوف يكن لديه القدرة على تنفيذ مهام اثنين موظفين .

الفرق بين ui و ux هو أن:

تجربة المستخدم (UX) هي تفاعل وخبرة المستخدمين مع منتجات الشركة وخدماتها. مثلًا: عند التفكير بطلب الطعام عبر الإنترنت، فإن UX تشمل تفاعل المستخدم مع وضع طلبه على موقع الشركة، وتجربة تناول الطعام، وكذلك رضاه عنه.

واجهة المستخدم (UI) هي مادة العرض المحددة التي يتفاعل معها المستخدمون. على سبيل المثال، يمكن لواجهة المستخدم التعامل مع المفاهيم التقليدية مثل عناصر التصميم المرئي كالألوان والطباعة.

وأخيرا سأتركك مع المقالة التالية:

لتتعرف أكثر عن الفرق بينهما.

واجهة المستخدم - UI - User Interface

تجربة المستخدم UX - User Experince

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

اما الثانية تجربة المستخدم، هي فاعلية الواجهة في تقديم كل المعلومات اللازمة والتفاعل مع المستخدم بافضل صورة ممكنة

وهذان الامران لايشملان المواقع فقط، بل يشملان كل شيء تراه وتتفاعل معه في الحياة حتى الاجهزة الالكترونية

فغسالة الملابس تحتوي على نصوص وازرار

وتجربة المستخدم يجب ان تضمن للمستخدم عدة اشياء في هذه الواجهة حتى تجعل من استخدامه اسهل وافضل ما يمكن

مثلاً نستخدم الاحمر للامور الخطرة او للحذف، والازرق او الاخضر للضغط المطلوب كالحفظ وما اشبه، نستخدم كلمات معروفة فحتى لو انحذف منها حرف او اثنين تكون مفهومة، ونستخدم الوان متناسقة ومتوافقة وكل لون او درجة حرارة ترمز لشيء معين

ايضا نستعمل تنسيق وتوزيع عناصر التصميم بشكل مدروس

تجربة المستخدم باختصار يجب ان تضمن للمستخدم التجارب التالية:

• السهولة في الفهم / التعلم

• سهولةفي التذكر

• ان تكون بديهية ومعتاد عليها (اي مثل تصاميم سبق وراها وتعود عليها)

• ان تكون ممتعة في الاستخدام (مثلا صدور صوت مختلف لكل زر يجعل من المستخدم يستمتع في استخدامها ويعرف اي زر من الصوت)

• واذا كانت لعبة فيجب ان توفر تجربة تحدي

• وهكذا بصراحة نسيت باقي عناصر تجربة المستخدم ههه ^^

أعتقد زملائي وضحوا لك ما الفرق بين UI/UX، ولكن سأوضح بعض النقاط هنا:

• تصميم UI/UX يبقى في النهاية تصميم مبني على تحليل تجربة المستخدم ليتم التعامل معه بشكل سلس وسهل للمستخدم.

-لا يمكن لمصمم UI/UX أن يرفع تصاميمه أو يربطها مع الباك اند لانها تبقى تصاميم وليس كود برمجي !

• لا يوجد غنى عن UI/UX في أي مشروع ، لذلك تكون مرحلة تحليل المشروع وتصميم الواجهات في أولى المراحل وقبل بداية برمجة المشروع.

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

• في تصاميم UI/UX يتم تحديد مقاييس الشاشات المستخدمة سواء ويب او موبايل ، وتحديد درجة الالوان بدقة ، وهذا كله يفيد مبرمج الفرونت اند.

أي في النهاية مبرمج الفرونت اند يحول تصاميم UI/UX الى اكواد بلغة html & css.

واجهة المستخدم UI

بشكلٍ أساسيٍّ، UI هي سلسلةٌ من الشاشات، الصفحات، والعناصر المرئية – مثل الأزرار والأيقونات – والتي تمكن الشخص من التفاعل مع المنتج أو الخدمة. ببساطة، هي أي شيء قد يتفاعل معه المستخدم عند استخدام منتجٍ أو خدمةٍ رقميةٍ، ويتضمن ذلك كل شيءٍ بدءًا من الشاشات، شاشات اللمس، لوحات المفاتيح، والأصوات، وحتى الأضواء، ولفهم تطور واجهة المستخدم، من المفيد معرفة المزيد عن تاريخها وكيفية تطورها.

تجربة المستخدم UX

بالمقابل فإن تجربة المستخدم UX، هي ما يجربه الشخص عندما يتفاعل مع كل جزءٍ من منتجات الشركة وخدماتها، وقد تطورت UX، كنتيجةٍ للتحسينات في UI. فعند وجود شيء يتفاعل معه المستخدمون، فإن تجربتهم، غيرت شعورهم تجاه تلك التفاعلات، سواء أكانت هذه التجربة إيجابيةً أم سلبيةً أم محايدةً.

يعود الفضل للعالم ” Don Norman” في ابتكار مصطلح “تجربة المستخدم” في أوائل التسعينيات أيضًا عندما كان يعمل في شركة Apple، ويعرفها كما يلي: تشمل “تجربة المستخدم” جميع جوانب تفاعل المستخدم النهائي مع الشركة وخدماتها ومنتجاتها.

لقد وجدت لك هذا الكتاب الرائع فى شرح الux . ارجو ان يفيدك فى عملك مع تمنياتى لك بالتوفيق.

وعليكم السلام ورحمة الله وبركاته

UI هي اختصار واجهة المستخدم وهي لوحة التحكم الخاصة بالمستخدم

UX هي إختصار تجربة المستخدم بمعنى إيجاد الحلول لتسهيل واجهة المستخدم لتصبح أكثر سلاسة

هذا بإختصار والنت مليء بالمقالات التفصيلية