إرشادات بسيطة حول التصميم للهاتف المحمول

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

يشير جوش كلارك مؤلف كتاب "تصميم تطبيقات آيفون رائعة تستحق النقر Tapworthy: Designing Great iPhone Apps" إلى وجود ثلاثة أنماط للتفكير تشغل أذهان مستخدمي الهاتف المحمول:

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

يمكن أن نضيف إلى هذه القائمة أصنافًا أخرى ظهرت بعد تأليف جوش كتابه في مرحلة مبكرة من عصر الهواتف الذكية:

التفاعل المطوَّل: عندما يتفاعل المستخدم مع المحتوى لفترة طويلة من خلال عدد لا متناهٍ من حركات التمرير والنقر والانتقال.
الانتباه المتقطع: عندما تجذب الإشعارات المستخدم ليتفقد النشاطات أو الحالات الجديدة أو أي شيء آخر. لاحظ أن هذا لا يُعَد دائمًا أمرًا إيجابيًا، فالإشعارات تثير انتباه المستخدمين للعودة بلا سبب مستعجَل، وذلك بهدف تلبية احتياجات التطبيق من مقاييس الارتباط والتفاعل.

تحت مسمى "احترام الأولويات"، تقدم شركة مايكروسوفت مجموعةً من الإرشادات التي تخصّ الصنف الأخير، وهي تضم الاتجاهات الخمسة التالية:

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

الاعتبارات الأساسية للتصميم من أجل الهاتف المحمول

لنسلط الضوء على بعض الجوانب الخاصة التي يجب الانتباه لها عند التصميم للهاتف المحمول.

الشاشات الصغيرة

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

تساعد الخطوات التالية على تسهيل عملك:

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

إعطاء الأولوية للمهمة الأساسية

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

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

يجب الاهتمام بمدى إلحاح المهمة وأولويتها، كما هو الحال في زر تطبيق شازام.

تبسيط التنقل

لا توفر لوحات الأزرار وشاشات اللمس تنقلًا دقيقًا قياسًا بدقة الفأرة في الحاسوب، لذا حاول:

إعطاء أولوية التنقل للمهام الأكثر أهمية.
تقليل الحاجة للتنقل.
التحقق من دقة مسميات التنقل ووضوحها.
توفير مفاتيح اختصار من أجل الوصول للميزات المختلفة.
ضرورة تخصيص 10 ملم على الأقل لكل زر.

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

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

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

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

اختصار المحتوى قدر الإمكان

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

تقليل البيانات المطلوبة من المستخدمين

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

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

مراعاة مشكلة عدم استقرار اتصال الهاتف المحمول بالإنترنت

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

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

تكامل التجارب واستمرارها بين الأجهزة

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

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

الخلاصة

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

ترجمة -وبتصرّف- للمقال Simple Guidelines When You Design for Mobile.