👩‍👩‍👦‍👦 🗨️ 🕠 قائمة فحص UX ذات 30 نقطة لتطبيقات الأجهزة المحمولة 🏹 👧 🙇🏻

هذه المقالة عبارة عن تذكير بما تحتاج إلى التحقق مرة أخرى من تصميم التطبيق قبل إرساله إلى AppStore / GooglePlay. القائمة مقسمة إلى كتل موضوعية:

تسجيل الدخول / تسجيل
التجربة الأولى
التفاعلات اليومية
إشعار
إعدادات الحساب
شريط
بحث
AppStore / GooglePlay

تمت ترجمة هذه المقالة بدعم من EDISON Software ، وهي شركة تقوم بتطوير التطبيقات والمواقع ، وكذلك التعامل مع واجهات المستخدم .

1. تسجيل الدخول / التسجيل

1. شاشة التوقف

يتم عرض شاشة البداية عند بدء تشغيل التطبيق. هذا هو أول ما يراه المستخدم ، وهذا يخلق الانطباع الأول للمنتج ، حتى قبل بدء العمل.

شاشة البداية لشعار Gleb Kuznetsov

رايدر إطلاق الانتقال من قبل اوبر

وهنا بعض النصائح لصنع شاشات توقف جيدة .

2. نسيت كلمة مرورك

الشخص العادي مسجل في 90 خدمة عبر الإنترنت تتطلب كلمة مرور. لذلك ، غالبًا ما يتم نسيان كلمات المرور. وفقًا للإحصاءات ، ينسى 21٪ من المستخدمين كلمة المرور الخاصة بهم لمدة أسبوعين ، وينسى 25٪ كلمة المرور مرة واحدة على الأقل يوميًا. إذا كان التطبيق الخاص بك يتطلب كلمة مرور ، فعليك العناية بنموذج استعادة كلمة المرور.

نسيت كلمة المرور التدفق من قبل إيمانويل توريس

2. التجربة الأولى

3. شاشة الترحيب / التعليمات عند التشغيل لأول مرة (Onboarding)

Onboarding هو مصطلح تصميم UX يعني كيفية فهم المستخدم ما يجب القيام به مع التطبيق الخاص بك ، وكيفية التنقل فيه ، ومكان النقر. يزيد الاعتماد الجيد على إمكانية أن يصبح "القادمون الجدد" دائمًا.

تجربة على متن الرسوم المتحركة من قبل كوبرتو

فيما يلي بعض النصائح العملية للحصول على معلومات جيدة .

وهنا مفاهيم مبتكرة ل onboarding .

4. الشاشة مع إخطار بنجاح تأكيد البيانات

تطلب العديد من تطبيقات الهاتف المحمول تأكيد البريد / الهاتف. يظهر إشعار حول نجاح عملية تأكيد البيانات بعد أن يكمل المستخدم كل ما هو ضروري.

شاشات التأكيد ديانا كاباليرو

لهذه الشاشة ، من الضروري ضمان:

القدرة على إرسال رمز التأكيد مرة أخرى (للهواتف)
إرشادات حول كيفية العثور على رسالة تأكيد (البحث حسب العنوان ، البحث في البريد العشوائي ، إلخ.) (للبريد)

5. بذرة "لا يوجد محتوى حتى الآن"

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

بدلاً من ترك فراغ ، قم بإدخال برنامج تعليمي أو تعليمات حول ما يجب القيام به بعد ذلك.

وظائف التطبيق التعاطف دولة فارغة

6. الصورة الرمزية للمستخدم الافتراضي

معظم المستخدمين (~ 95٪ وفقًا لـ Jared M. Spool ) لا يغيرون الإعدادات الافتراضية. هذا يعني أن المستخدمين سيحصلون على الصورة الرمزية التي اخترتها لهم.

الصورة الرمزية للمستخدم الافتراضي لطيف في Dropbox

فيما يلي بعض الأفكار حول كيفية جعل الصورة الرمزية الافتراضية .

3. التفاعلات اليومية

7. قرار شاشة الطلب

عندما يفتح المستخدم تطبيقًا جديدًا ، فإن آخر شيء يريد أن يراه هو الكثير من العناصر المنبثقة التي تسأل:

السماح للتطبيق بالدخول إلى موقعك.
السماح للتطبيق بالوصول إلى جهات الاتصال الخاصة بك.
السماح للتطبيق بالوصول إلى الكاميرا

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

حوار إذن الإخطار من قبل أنتون تكاشوك

هنا بمزيد من التفاصيل حول طلب الإذن .

8. مختلف الدول للعناصر التفاعلية

الأزرار والعناصر التفاعلية الأخرى لها عدة حالات. من المهم للغاية التفكير في الحالات الافتراضية / المضغوطة / غير المتاحة لكل عنصر تفاعلي في التطبيق الخاص بك.

ثلاث حالات الزر

زر تصميم المواد بواسطة Vadim Gromov

فيما يلي نصائح حول كيفية تصميم الأزرار .

9. مجموعة أيقونة

سيكون من الأفضل إذا كانت الرموز الخاصة بك من نفس النمط.

أيقونات شريط علامات التبويب في تطبيق Twitter لنظام التشغيل iOS

إليك قائمة تدقيق للرموز .

10. رسائل خطأ

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

خطأ التفاعل من قبل Dwinawan

فيما يلي بعض الحالات التي تحتاج إلى التفكير في رسائل الخطأ:

لا يوجد اتصال بالإنترنت. فكر فيما يجب أن يراه المستخدم عند عدم وجود اتصال.
أدخل المستخدم البيانات بشكل غير صحيح.
خطأ في النظام

إليك مقالة إرشادية حول كيفية إنشاء رسائل خطأ جيدة .

11. عملية التمهيد

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

يعد مؤشر التقدم المتحرك هو أكثر أشكال توفير حالة النظام للمستخدمين شيوعًا عند حدوث شيء ما أو تحميله.

Smile loader لتصميم منتجات AI من Gleb Kuznetsov

فيما يلي بعض النصائح لإنشاء مؤشرات التحميل .

12. الرسالة التي فعلت كل شيء بشكل صحيح

حالات النجاح عبارة عن شاشات نعرضها للمستخدمين عند إكمال المهام. يجب على المصممين مراعاة الأنواع التالية من شروط النجاح:

الدول مذهلة (النجاح الأول). في الوقت الذي يؤدي فيه المستخدم مهمة مهمة لأول مرة ، لديك فرصة كبيرة لإنشاء اتصال عاطفي إيجابي بينه وبين المنتج الخاص بك. دع المستخدمين يعرفون أنهم ينجحون ، مع الاعتراف بتقدمهم والاحتفال بالنجاح مع المستخدم.
شاشة التأكيد. شاشة التأكيد هي شاشة مطلوبة لتطبيقات التجارة الإلكترونية. في الوقت الذي يكمل فيه المستخدم عملية الشراء ، نحتاج إلى عرض شاشة توفر جميع المعلومات اللازمة عن عملية الشراء.

شاشة التأكيد في Booking.com

13. الملء التلقائي

يجب أن يسعى المصممون دائمًا إلى تقليل تكلفة التفاعل عن طريق إزالة الإجراءات غير الضرورية. تعمل ميزة الإكمال التلقائي على تبسيط إدخال المستخدم عن طريق تقليل عدد النقرات التي يجب على المستخدم إكمالها لإكمال الطلب.

الصورة: لويز تشانغ

14. قم بإلغاء العملية

كلنا نرتكب أخطاء ، ولكن عندما يتعلق الأمر بالتفاعل مع المستخدم ، من المهم للغاية توفير خيار يساعد المستخدم على استعادة البيانات المهمة.

التراجع عن حذف العنصر. الصورة: Sashoto Seeam

التراجع عن إرسال البريد الإلكتروني. الصورة: تايلر بوشامب

15. التعريب / التدويل

نظرًا لأن العديد من فرق التطوير لديها خطط للوصول العالمي ، من المهم جعل التعريب / التدويل جزءًا طبيعيًا من عملية التصميم. يجب تحديد الخصائص المرئية للعناصر (مثل الحجم) ونسخ UX بناءً على التعريب / التدويل.

زر التصويت في لغات مختلفة. الصورة: Chier Hu

16. مساعدة / تعليمات

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

مساعدة وردود الفعل من قبل أليكس ميونخ

17. إمكانية الوصول

تتيح إمكانية الوصول للأشخاص الذين لديهم كافة القدرات إمكانية إدراك منتجك وفهمه والتفاعل معه. إليك ملخصًا رائعًا من ليليان شياو حول ما يحتاج المصممون لمعرفته حول توفر الأجهزة المحمولة.

وهنا قائمة من الأدوات لفحص تباين الألوان .

4. الإخطارات

18. الإخطارات التطبيق / الإخطارات دفع

هل تعلم أن الإخطارات الرديئة هي السبب الرئيسي وراء قيام المستخدمين بإلغاء تثبيت التطبيق؟

الإخطارات المزعجة هي السبب في قيام الناس بإلغاء تثبيت تطبيقات الأجهزة المحمولة (يقول 71٪ من المشاركين).

ومع ذلك ، يمكنك تحويل هذا UX antipattern إلى شيء مفيد ومفيد لكل من العمل والمستخدم. لتحقيق نتائج جيدة من خلال الإشعارات في التطبيق ، يحتاج المصممون إلى استراتيجية للنشر تكون أكثر ملاءمة للأجهزة المحمولة.

إليك مقالة توفر معلومات حول كيفية إنشاء إشعارات جيدة .

وإليك بعض أفكار التصميم الملهمة .

19. إعدادات الإخطار

إنه لمن دواعي سروري دائمًا منح المستخدمين حرية الاختيار. في سياق إشعارات الجوال ، يعني ذلك القدرة على اختيار الإشعارات التي يريدون تلقيها.

اضبط خيارات الإشعار في Slack

5. إعدادات الحساب

20. أداة لزراعة صورة الملف الشخصي

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

تحرير الصورة الرمزية لسكوت توماس

21. شاشات لعرض / تغيير البيانات الشخصية

اسمح للمستخدمين بتعديل بياناتهم الشخصية مباشرةً في تطبيق الهاتف المحمول. قم بإنشاء شاشات لمعاينة معلومات الشحن / الفوترة ولإضافة هذه المعلومات إلى قائمة قابلة للتحرير.

عناوين المنزل والمكتب قابلة للتحرير. حدد عنوان الشحن من Dhiraj S. Karki

22. تسجيل الخروج

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

تسجيل الدخول في الفيسبوك لنظام التشغيل iOS

23. شروط الاستخدام

أضف شروط الاستخدام إلى التطبيق الخاص بك لتجنب اتخاذ إجراءات قانونية.

الصورة: كريستيان دينا / شترستوك

24. إعدادات الخصوصية

اسمح للمستخدمين بمعرفة البيانات التي يرسلونها إليك والسماح لهم بالاختيار.

الصورة: فيتالي فريدمان

فيما يلي بعض النصائح حول كيفية التعامل مع الخصوصية في التطبيقات .

25. إرسال الملاحظات

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

يتيح Skype for iOS للمستخدمين خيار "ترك التعليق" أو "الإبلاغ عن مشكلة" أو "اقتراح ميزة".

6. الشريط

26. التمرير

شاشات المحمول صغيرة. لتوفير مساحة على الشاشة ، يرغب المصممون غالبًا في تحسين المعلومات المعروضة وإخفاء كل شيء ليس ذا قيمة للمستخدم. هذا هو السبب في أن العديد من شاشات القنوات لها حالتان: الحالة الافتراضية (الشاشة التي يراها المستخدمون عند دخولهم القناة) وحالة التمرير (عندما ينتقل المستخدم لأعلى لرؤية المزيد من المحتوى).

لاحظ أن منطقة العنوان تنهار عند التمرير. Craiglist Mobile الرسوم المتحركة بواسطة Aurélien Salomon

البحث داخل التطبيق

27. السلوك الافتراضي

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

28. حصة / المرجعية

السماح للمستخدمين بمشاركة وتحديد ما يعثرون عليه.

مثل ، المرجعية ومشاركة الخيارات في التطبيق AE من قبل مارتن بيربيسون

29. نموذج فارغ لـ "لا توجد نتائج"

ماذا سيرى المستخدمون ما إذا كانوا يبحثون عن شيء ما ، ولكن لا توجد نتائج بحث؟ يجب أن لا تعني شاشة "لا نتائج" النهاية. أخبر المستخدم بالخطوة التي يجب اتخاذها بعد ذلك.