ما هي أساسيات UI/UX؟
لقد تطور التصميم كثيرا بعد الطفرة النوعية التي شهدتها التكنولوجيا الحديثة وأصبحت هناك العديد من المجالات المهمة في التصميم ومن أبرزها تصميم تجربة وواجهة المستخدم.
كثيرا ما يتكرر هذا المصطلح على مسامعنا وربما لا تعرف حتي الآن لا ماهو ولا أساسياته.
لذلك في هذا الموضوع دعني اخبرك بأهم أساسيات تصميم UI/UX التي علىيك معرفتها اذا كنت ترغب في ان تصبح مصمم ui/ux.
دعنا نبدأ اولا بـ…
مقدمة بسيطة عن واجهة المستخدم UI
كلمة UI باللغة الإنجليزية مشتقة من “User Interface” ومعناها واجهة المستخدم وهي تعني ايضا التخطيط الرسومي للتطبيق او الموقع.
تشمل واجهة المستخدم الأزرار التي ينقر عليها المستخدمون والنص الذي يقرؤونه والصور وأشكال التمرير وحقول إدخال النص وجميع العناصر المتبقية التي يتفاعل معها المستخدم.
يتضمن ذلك تخطيط الشاشة والانتقالات والرسوم المتحركة للواجهة وكل تفاعل صغير.
يجب تصميم أي نوع من هذه العناصر المرئية أو التفاعل أو الرسوم المتحركة بشكل جيد.
تقع هذه الوظيفة على عاتق مصممي واجهة المستخدم بمساعدة مبرمجي الفرونت اند.
حيث أنهم يقررون كيف سيبدو التطبيق، وعليهم أن اختيار كل شئ من أنظمة الألوان وأشكال الأزرار وعرض الخطوط المستخدمة للنص.
الأمر متروك لهم للتأكد من أن واجهة المستخدم جذابة من حيث المظهر وذات طابع ملائم لتتناسب مع الهدف الاساسي الذي يرجوه المستخدم ويسعي لتقديمه صاحب الموقع او التطبيق.
مقدمة بسيطة عن تجربة المستخدم UX
كلمة UX مشتقة من كلمة User Experience والتي تعني تجربة المستخدم وتتحدد مدي جودتها من خلال سهولة تفاعل ذاك المستخدم مع تلك الواجهة.
بمعنى هل التجربة سلسة أم مربكة؟
هل يمنح تفاعل المستخدم مع واجهة التطبيق او الموقع هذا الإحساس بأنه ينجز ما يريده بكفاءة أم لا؟
يتم تحديد تجربة المستخدم من خلال مدى سهولة أو صعوبة التفاعل مع العناصر المختلفة التي أنشأها مصمموا واجهة المستخدم.
لذلك يهتم مصممو UX أيضًا بواجهة المستخدم ، وهذا هو سبب ارتباك الناس بشأن الاختلاف بين الاثنين.
ولكن بينما يتم تكليف مصممي واجهة المستخدم بتحديد شكل واجهة المستخدم، فإن مصممي UX مسؤولون عن تحديد كيفية عمل واجهة المستخدم.
يحدد مصممو UX مدي التوافق بين العناصر ووظيفتها وكيفية وسهولة استخدامها وربطها ببعضها البعض.
باختصار، هم يصممون كيفية عمل الواجهة.
إذا كانت تعمل بشكل جيد ويشعر مستخدمها بالسلاسة، فسيتمتع هذا المستخدم بتجربة جيدة والعكس صحيح.
اذا كنت ترغب في المزيد من المعلومات فقط اقرأ: ماهو ui/ux design
أساسيات تصميم UI/UX
بعد التعرف على ماهية هذين المصطلحين، آن الأوان للدخول في صلب الموضوع والحديث عن أساسيات UI/UX.
كما اخبرتك بالاعلي علي الرغم من انهما مختلفان في المعني الا ان المصطلحان متكاملان بشكل كبير مع بعضهمها.
فلاخراج تجربة مستخدم ممتازة يجب ان تكون واجهة المستخدم ممتازة والعكس صحيح
دعنا نبدأ اولا باهم الاساسيات وهي…
1- تلبية احتياجات المستخدمين
أحد أهم أساسيات تصميم UI/UX هي التركيز على تلبية احتياجات المستخدمين طوال عملية التصميم.
يوضح مصطلح تجربة المستخدم نفسه أن عملك يحتاج إلى التركيز على تحسين تجربة المستخدمين مع منتجك أو خدمتك.
وبالتالي، فأنت بحاجة إلى معرفة ما يبحث عنه المستخدمون في التصميم (من خلال اختبار المستخدم وطرق أخرى).
من الممكن أن يكون التصميم رائعًا بالنسبة لك، لكن تذكر أنك لست المستخدم.
اقرأ أيضا: مهارات المصمم الجرافيكي ( 12 مهارة عليك تطويرها )
2- قدم معايير عالمية
اذا كنت ترغب في تصميم يصل لكل شخص في العالم فعليك تصميم منتجك تبعا للمعايير العالمية بحيث يتم استخدامه في كل مكان حول العالم.
اذا كان تطبيق قدم نسخ للاجهزة المختلفة وباللغات المختلفة اذا كان موقع بالتأكيد يمكنك عمل نفس الشئ.
المنتجات ذات المعايير العالمية وبساطة التصميم في الغالب هي التي تصل للجميع.
فكر في حزمة برامج مايكروسوفت واجهة المستخدم UI الخاصة باي برنامج في الحزمة متشابهة بشكل كبير.
وبالتالي من يستطيع استخدام احد البرامج بأمكانه استخدام واحد اخر او تعلمه ببساطة بدون تعقيد.
3- اعرف مكانك الصحيح في عملية التصميم
بالنسبة لمصممي UX الجدد الذين بدأوا لتوهم أو لا زالوا في مناصب صغيرة، يمكن أن تكون عملية التصميم صعبة. يتم بذل الكثير من العمل في التصميم، لذا فإن معرفة مكانك وقدراتك الحقيقية في العملية أمر مهم من عدة نواحٍ.
أولاً، ستحتاج إلى استخدام أدوات مختلفة لكل مرحلة، فأمجال تصميم تجربة المستخدم مجال تطوري ولا يقتصر على مرحلة معينة. ثانيًا، تساعدك معرفة مرحلة التصميم أيضًا على طرح الأسئلة الصحيحة لأبحاث المستخدم. على سبيل المثال، ليست هناك فائدة من اختيار لون الزر إذا كنت لا تعرف المكان الذي يجب وضعه فيه بعد في التصميم.
4- أن يكون لديك تسلسل هرمي واضح
هدف التسلسل هذا هو مساعدة المستخدمين علي ايجاد المحتوي الاهم وملاحظته اولا.
من السهل اعتبار التسلسل الهرمي أمرًا مفروغًا منه، ولكنه من أهم أساسيات UI/UX حيث يضمن التنقل السلس في جميع أنحاء التصميم.
هناك نوعان من التدرجات الهرمية الرئيسية التي تحتاج إلى ملاحظتها يأتي أولاً:
- التسلسل الهرمي المرتبط بكيفية تنظيم المحتوى أو المعلومات في جميع أنحاء التصميم.
على سبيل المثال، عند فتح موقع ويب أو تطبيق، ستلاحظ شريط التنقل الذي يتضمن الأقسام الرئيسية. هذا هو التسلسل الهرمي الأساسي. عند النقر فوق هذا الشريط أو التمرير فوقه، ستلاحظ فتح المزيد من الفئات الفرعية للمحتوى، مما يأخذك بشكل أعمق إلى التطبيق أو الموقع.
- هناك أيضًا تسلسل هرمي مرئي، والذي يسمح للمستخدمين بالتنقل بسهولة داخل صفحة أو قسم.
لذلك، لإنشاء تصميم سلس وسهل للمستخدمين، تحتاج إلى وضع المحتوى المهم في مكان بارز.
5- إمكانية الوصول
قاعدة مهمة بشكل متزايد من بين أساسيات تصميم تجربة المستخدم هي التصميم مع وضع إمكانية الوصول في الاعتبار. بعبارة بسيطة، تتمثل مسؤولية المصمم في التأكد من أن تصميمه قابل للاستخدام لأكبر عدد ممكن من الأشخاص. هذا يعني أن التصميم الخاص بك يجب أن يكون في متناول الأشخاص ذوي الإعاقة أيضًا.
تحقيقا لهذه الغاية، يجب عليك إزالة العقبات التي قد تعيق مثل هذه الفئات. على سبيل المثال، يمكنك استخدام ألوان متباينة في تصميمك. يساعد ذلك المستخدمين المعاقين بصريًا (وكذلك المستخدمين في إعدادات الإضاءة المنخفضة) على قراءة المحتوى على الشاشة بسهولة أكبر.
اقرأ أيضا: مهام ومؤهلات المصمم الجرافيكي ( المطلوبة في الوظائف )
6- وفر حرية الاستخدام في واجهتك للمستخدم
مستخدم الواجهة الخاصة بك سواء لبرنامج او تطبيق او موقع او غيره له الحق في اتخاذ الاجرء المناسب علي الموقع في الوقت الذي يعتقد انه مناسب.
سواء قرر اتخاذ اجري معين علي الموقع او التراجع عنه او الخروج من الموقع.
هناك ايضا بعض الافكار الجيدة التي توفر مثل تلك الحرية بل وتزيد عليها بخاصية مثل الحفظ التلقائي لما قام به المستخدم.
اشهر مثال هنا هو Google sheets والخدمات الاخري المشابهة لخدمات برنامج الاكسيل من مايكروسوفت.
هنا جوجل يتيح للمستخدم القيام بكل شئ بدون الحاجة الي الحفظ بعد الانتهاء فيجنبه بهذا فقدان ما كان يقوم به في حالة حدوث اي ظرف طارئ.
7- السياق هو المفتاح
عند التصميم، يجب أن تأخذ في الاعتبار سياق المستخدم.
الموقع هو عامل سياقي مفهوم بشكل شائع، يعني هل أنت تصمم لشخص ما أثناء التنقل أو لشخص جالس على مكتب؟
ولكن هناك أشياء أخرى يجب مراعاتها، بما في ذلك الوقت المتاح للمستخدم وحالته العاطفية والجهاز الذي يستخدمه والأشخاص الذين يؤثرون عليه وغير ذلك.
تساعدك كل هذه العوامل على فهم سلوك المستخدم.
وبمجرد أن يكون لديك نظرة شمولية على ذلك، يمكنك إعداد تصميم يزيد من تحسين تجربة المستخدم.
8- سهولة الاستخدام وبساطة التصميم
يركز تصميم UX بالكامل على حل مشكلات المستخدمين، مما يجعل سهولة استخدام التصميم أحد أهم مبادئ تصميم تجربة المستخدم.
بغض النظر عن مدى جودة عملك من الناحية الجمالية، فقد يكون كل ذلك بلا فائدة في حال لم يكن سهلا الاستخدام.
مثال على ذلك هو تصميم الموقع.
أي موقع فوضوي لا بد أن يفقد الزوار وكمصمم، مهمتك هي التأكد من أن كل رمز وزر ومقتطف من المعلومات الموجودة داخل التصميم له غرض.
ركز على لفت انتباه المستخدم فقط إلى الميزات المفيدة.
سهولة الاستخدام هي السبب في أن الأزرار البارزة والتصميم البسيط بعناصر قليلة يزيدان من نسبة النقر إلى الظهور (CTR).
وقد ضاعفت شركة Precision Marketing Group نسبة النقر إلى الظهور على زر الحث على اتخاذ إجراء عن طريق تغيير شكل الزر وحجمه.
من المهم ايضا ان كل شاشة تحتوي فقط على المكونات المتعلقة بالمهمة التي يتم تنفيذها من قبل المستخدم، بحيث توفر وسائل واضحة ومرئية للتنقل إلى محتوى آخر بصورة سهلة.
وكخلاصة، يجب عليك إجراء اختبارات سهولة الاستخدام طوال عملية تصميم تجربة المستخدم UX، بما في ذلك المراحل الأولية للتصميم، وأثناء التصميم، وفي نهاية التصميم.
9- استخدم لغة بسيطة
مثلما أصبحت البساطة من أفضل الممارسات في التصميم المرئي، يجب أن تتأكد أن محتوى ذاك التصميم أيضا بسيط وتختار لغة بسيطة تلائم المستخدم.
ليس الجميع سيفهم ما تفهمه أنت، لذا استخدم الكلمات الأقرب إلى أفكار المستخدم في تصميمك.
من السهل فهم اللغة البسيطة، مما يعزز سهولة استخدام التصميم الخاص بك.
تحتاج إلى احتساب 4 نقاط عند اختيار كلمات بسيطة لتصميمك. هؤلاء هم:
- الجمهور والغرض من التصميم: اسأل عن جمهورك، وما هي المعلومات التي يمتلكونها،؟ وما الذي يحتاجون إليه؟ وما الذي يريدون تحقيقه؟
- الهيكل: اسأل عن الهياكل السهلة والمعروفة لدى المستخدمين، يعني ما هي الهياكل التي يعرفها القراء؟ والتسلسل الذي سيكون من السهل قراءتها؟
- التعبير: ضع في اعتبارك النبرة والأفعال وطول الجملة والمصطلحات واختيار الكلمات الملائمة للمستخدم
- التقييم: اطلب من شخص ما مراجعة النص الذي تضعه في صيغته النهائية وإجراء اختبار قابلية الاستخدام
تعرف علي: اهم 9 مصطلحات في الجرافيك ديزاين
10- التأكيد قبل التنفيذ
الحوادث تحدث في كل وقت، قد يقوم شخص ما عن غير قصد بتقديم طلب.
يجب أن يساعد التصميم الخاص بك في تصحيح هذا، قم بوضع نافذة خاصة بتأكيد الطلبات قبل تنفيذها.
وهذا بالتأكيد سيضمن تجربة مستخدم أفضل.
تعرف على: أفضل مواقع تصميم واجهات مستخدم
11- رسائل خطأ واضحة
هناك بالتأكيد اخطاء تحدث عند تصفح موقع او تطبيق.
فمثلا بعض المواقع قد تقوم بحذف بعض المحتوي منها ولكن مع ذلك قد يصل شخص بطريقة ما الي هذه الصفحة التي تم حذف محتواها.
وبدلا من هبوط الشخص الي صفحة مليئة بأكواد البرمجة المعقدة ظهرت ما تسمي صفحة الخطأ شائعة بأسم ( الصفحة غير موجودة ).
عند فقدان الاتصال بالانترنت ايضا تظهر لنا رسالة خطأ في الغالب من التطبيق او الموقع الذي نستخدمه.
الافضل من ظهور صفحة خطأ جامدة هو وجود تعليمات تساعد المستخدم علي الانتقال من صفحة الخطأ هذه الي صفحة اخري في الموقع بها معلومات تساعده.
وهكذا ننتهي من اهم أساسيات ui/ux التي عليك معرفتها قبل البدء.
ولان اخبرني….
لماذا تجد تصميم ui/ux مناسب لك؟ وهل كانت تلك الاساسيات مفيدة للبدء؟
المصادر
0 تعليق