كيفية التصميم لـ Great Mobile UX

نشرت: 2018-08-06

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

دعونا نلقي نظرة على الإحصائيات.

وفقًا لـ Smart Insights ، تجاوزنا النقطة التي تجاوز فيها عدد مستخدمي الأجهزة المحمولة عدد مستخدمي سطح المكتب. حدثت نقطة التحول هذه في عام 2014. ومنذ ذلك الحين ، استمر عدد مستخدمي الأجهزة المحمولة في العالم في الارتفاع بقوة بينما زاد عدد مستخدمي أجهزة سطح المكتب بشكل أقل سرعة.

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

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

لنلقي نظرة.

كيفية التصميم لـ Great Mobile UX: ما تقوله الإحصائيات

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

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

إليك حالة أخرى مثيرة للاهتمام للغاية تكشف في الواقع أكثر مما يبدو للوهلة الأولى.

وفقًا لتقرير Adobe's Mobile Retail ، فإن التحويلات أعلى بمقدار 2.8 مرة على سطح المكتب منها على الأجهزة المحمولة. إذا كنت تعتقد أن هذا يعني أنه ليس من المهم التحسين للجوال ، ففكر مرة أخرى. هذا في الواقع سبب إضافي للالتزام بإستراتيجية الجوال أولاً ، خاصة وأن الهاتف المحمول لا يزال يمثل حركة مرور أكثر من سطح المكتب.

من المحتمل أن يرجع السبب في ارتفاع التحويلات على سطح المكتب إلى حقيقة أن تجارب الجوّال ليست محسّنة كما ينبغي - وليس لأن الأشخاص لا يفضلون التسوق والتحويل على الهاتف المحمول ، حيث يكون ذلك أكثر ملاءمة لهم في المقام الأول !

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

إنه في متناول يدك. إليك ما يجب القيام به.

تصميم للإبهام ... ولكن ليس بشكل أساسي للإبهام

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

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

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

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

الطرق الست هي:

  • مهد (يد واحدة تدعم الهاتف بينما تنقر الإبهام باليد الأخرى)
  • اضغط ولمس (يد واحدة تدعم الهاتف بينما تنقر إصبع السبابة في اليد الأخرى)
  • يدان للتوجيه الأفقي (فكر في كيفية حمل جهاز ألعاب محمول باليد مثل Nintendo 2DS XL)
  • يد واحدة - الطلب الأول (يد واحدة تمسك الهاتف بينما ينقر الإبهام على نفس اليد)
  • يد واحدة - ترتيب ثانية (يد واحدة تمسك الهاتف بينما ينقر الإبهام على نفس اليد ، ولكن من موضع بدء أعلى)
  • يدان للتوجيه العمودي (فكر في كيفية حمل جهاز ألعاب محمول باليد ، هذه المرة ، مثل Nintendo Gameboy القديم)

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

  • النقر على الروابط - يتم الضغط على معظمها والنقر أو المهد
  • مربعات التحقق - معظم المهد أو اضغط واضغط
  • الكتابة - يستخدم معظمهم إصبعين أو إبهام في وقت واحد أو الاستمرار والنقر
  • التمرير القصير - معظم الضغط والنقر أو المهد
  • التمرير الأطول - في معظم الحالات ، يمكنك الضغط أو الضغط

الخلاصة: صمم موقعك للجوّال ليلائم نطاق هذه الطرق المختلفة التي يمسك بها الأشخاص هواتفهم.

الأزرار الأكبر هي الأفضل

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

  • صعوبة النقر على الأزرار بشكل صحيح
  • مشاكل في رؤية الأزرار في المقام الأول
  • تواجه صعوبة في فهم أنه يمكن النقر فوق الزر أو التفاعل معه بطريقة أخرى

الخطأ الأكبر هو الأفضل.

تضمن الأزرار الأكبر تجربة مستخدم أكثر سلاسة للمتسوقين والعملاء والزوار وما إلى ذلك.

هذا يطرح السؤال ، ما هو الحجم بالضبط؟

وفقًا لإرشادات حجم هدف اللمس لتصميم المواد الخاصة بجوجل ، يجب أن تصل أزرار الهاتف المحمول إلى حجم شاشة تعمل باللمس يتراوح بين 7 و 10 ملليمترات. بمعنى آخر ، يجب أن تمتلك الأزرار حجمًا ماديًا يبلغ حوالي سنتيمتر واحد ، بغض النظر عن الشاشة التي تظهر عليها. هذا يضمن توازنًا كبيرًا بين:

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

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

إعطاء الأولوية للمحتوى الأكثر أهمية

إجابة السؤال ، كيف تصمم تجربة مستخدم رائعة للهاتف المحمول؟ تكمن أحيانًا في ما تطرحه بدلاً من الجمع. في حالة المحتوى المعروض على الشاشة ، يتم تطبيق هذه القاعدة بنسبة 100٪.

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

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

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

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

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

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

ركز على المستخدم النهائي

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

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

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