السلام عليكم , إن شاء الله تكونوا بخير 🙂

من فتره طويله . بدء تبقى نسبه متصفحى المواقع من الموبيل لا يستهان بيها , فى الحقيقه بدأت تنافس بشكل شرس جدا فى الفتره الاخيره نسبه المتصفحين عن طريق الاجهزة المكتبية. شخصيا , اخر مجموعه مشاريع , كان نسبه تصفح الموبيل فيها اعلى من 60٪ ! يعنى بالنسبه دى , و بطريقه الزياده , فى الغالب انا بقيت بستهدف زوار من الموبيل بس على المدى البعيد.

ك UXer يهمنا جدا ان المشاريع تعيش فتره طويله. موش كل يوم هنشتغل على نفس المشروع من جديد. دا فى حد ذاته فشل. فى الفقرات الجايه , فى كذا فكره حطهم فى اعتبارك وانت شغال للموبيل .. هتطلع بنتيجه افضل بأذن الله.

١. RWD & AWD :

حاليا ٩٠٪ من البروجيكتس ريسبونسيف , دا شئ جميل , بس غير كافى .. الريسبونسيف مهما كان بيحدد امكانياتك بشكل ما , مرهق فى بعض الاوقات , و نتايجه موش الافضل دايما. فى الاول و الاخر انت بتعيد ترتيب محتوى موجود بالفعل , ودى ك تجربه موبيل موش حلوه , ممكن بنفسك تجرب تزور موقع بيعرض نفس الداتا عنده ريسبونسيف , و تشوف موقع شغال Adaptive web design , فى الادبتيف انت هترتاح اكتر , رغم انك شخص بيتعامل مع التكنولوجيا بشكل كبير جدا. ما بالك باليوزر العادى.

هنا انا موش بقولك متشتغلش ريسبونسيف ! لا . انت هتشتغل ريسبونسيف عادى جدا 🙂 بالعكس , موش هتغفل اى حاجه فى الريسبونسيف , هتشتغل كأنه الحل الوحيد اللى هتعتمد عليه , و هتتقنه بشكل كامل.

لكن فى نفس الوقت , هتشتغل برده نسخه adaptive ! المقصود بالادبتيف هو ان المحتوى بيتغير ويناسب حجم او مجموعه احجام للشاشات .. موش مجرد انه بيتغير شكله او الاستيل الخاص بيه او ترتيبه , لا المحتوى نفسه بيتغير. ودا هيتيح ليك الوصول لدرجه افضل من اليوزر اكسبرينس..تصميم بيعتمد على التقنيتين , يكاد يكون تصميم دون اخطاء من ناحيه تجربه المستخدم اذا تم بطريقه سليمه.

فى حل تانى “نسخة الموبيل” !

الحل دا بصراحه انا بشوفه افضل! موش بيعتمد على انى بهلك او بعمل اى حاجه على جهاز المستخدم تماما .. وبتبقى النسخه اخف بكتير جدا , و بحدد طريقه الاستخدام بشكل مريح اكتر. الحل الاخير دا بشكل مختصر , بيعنى انك هتشتغل الموقع بشكل عادى جدا ريسبونسيف , و فى نفس الوقت , هتعمل نسخه مخصصه للموبيل. الريسبونسيف هينقذك فى حاله ان اى مستخدم انت مقدرتش تحدد هو بيشتغل من ايه , او دخل من شاشه مهما كان حجمها. و نسخه الموبيل . تقدر من خلال تعمل تصميم موقعك ك تطبيق . دا هيفرق كتير جدا معاك , و مع اليوزر , و نتايجه هتكون مضمونه تقريبا :).

٢. فهمك لوقت المستخدم :

مستخدم الموبيل , فى الغالب مشغول , او بيقضى بالكتير ٥ دقايق ولا ١٠دقايق ولا حتى نص ساعه ! موش كفيله انك تهوسه اعلانات , و الموقع يحمل بشكل بطئ ولا حتى انك تعمله كونتينت يتقرى فى ١٠ سنين !

موش بقول انك تخلى المحتوى خفيف لدرجه ان اليوزر ميكملش دقيقه و يكون عرف كل اللى هو عاوزه و سابك ! لا .. بس موش معنى كده انك تدوشه  .. فى طريقه ناجحه اكتر و من غير ما يكون دمك تقيل على المستخدم.

تقدر تتبع معاه اسلوب كلامك مع اى شخص عادى , بمعنى ! انى مثلا بتكلم مع واحد صاحبى بخصوص موضوع ما , من المتوقع . انى ممكن انقل كلامى لمواضيع مرتبطه. وضحت الفكره ؟

انت هتديه الكونتينت اللى هو محتاج يشوفه , و بعدين تديله كونتنت مرتبط باللى بيقراه , بمعنى ادق , هتاخده من مكان لمكان لمكان , من غير ما يحس بيك. لكن اى يوزر , هيدخل يلاقى موقعك متروس كونتنت , موش هيبصلك تانى 🙂 شوف اغلب التصميمات الجديده . هتلاقى ان المحتوى بدء يقل , و يبقى موش بيعتمد على عدد المحتوى او الكم , لكن بيعتمد على النوعيه ومدى ارتباطها بالمستخدم نفسه. تقدر تشوف مدى تطبيق دا حتى فى الاعلانات اللى بتظهرلك فى اى موقع.

٣. المحتوى المتوقع :

المستخدم زى ما قولنا , انه مستعجل ! براحته 😀 , بس فى حاجه تقدر تسيطر بيها اكتر على المستخدم , و تديله تجربه افضل. انك تنقى المحتوى الخاص بيه. فى معلومات كتير انت تقدر تعرفها عن مستخدميك , ممكن تظهر المحتوى بناء على البيانات دى. الطريقه دى هتوفر وقت اليوزر بشكل كبير , و هيحس انه الموقع دا مخصص ليه , مهتم بيه هو بالاخص ! دا هيفرق كتير فى الارتباط اللى ممكن يحصل بين اليوزر و بين مشروعك.

٤. امكانيه الضغط او “Clickability” :

دى نقطه مهمه جدا فى الموبيل. كل العناصر المرتبطه بأكشن عند الضغط عليها , لازم يكون فيها امكانيه ضغط من ناحيه المساحه مريحه للمستخدم. دا لوحده موش كفايه. فى حجات تانيه من البديهى انها موش موجوده . زى مثلا فى عرض المقال , تبقى حاطت زرار “إقراء المزيد” .. هحاول استوعب انها مناسبه للمستخدم من الديسك توب “لو ان دا غلط تماما” , لكن فى الموبيل ! الموضوع ملوش ادنى حجه او تفسير منطقى !

كل الايقونز , العناوين المرتبطه بروابط , التحكم بالكامل , لازم تراعى فيه ان دا يوزر من شاشه صغير , مينفعش يبقى بيحسس على الشاشه علشان يضغط صح على شئ ما هينقله لخطوه او لصفحه تانيه ! النقطه دى كفيله انه يقفل تصميمك و هو باله مرتاح و حاسس انه انقذ نفسه من حبل المشنقه !

٥. تناسب الواجهه مع الموبيل :

فى تصميم الموبيل , لازم تبقى فاهم كويس ان دا فى الاول و فى الاخر تصميم للموبيل .. يعنى البيئه حوليك كلها ماشيه بشكل ما , و اليوزر نفسه مناسب ليه الشكل دا , او متوقعه .. لازم متروحش لبعيد عن الاسس دى .. لازم يبقى الشكل قريب للبيئه الكامله اللى هتكون حوليه , و كذلك فى الاكسبرينس. من ناحيه القوايم و غيرها.

 

دى خمس نقط بساط , ممكن يفتحوا ليك نقط تانيه من خلال قرايتهم , يارب تكونوا استفدتوا ..

دمتم سالمين 🙂

 

More Readings,

The Aesthetic-Usability Effect is a condition whereby users perceive more aesthetically pleasing designs to be easier to use than less aesthetically pleasing designs. The effect has been observed in several experiments and has significant implication...

The cognitive walkthrough is a usability evaluation method in which one or more evaluators work through a series of tasks and ask a set of questions from the perspective of the user. The focus of the cognitive walkthrough is on understanding the syst...

Contextual inquiry is a semi-structured interview method to obtain information about the context of use, where users are first asked a set of standard questions and then observed and questioned while they work in their own environments. Four pri...

Capturing the day-to-day context in which people engage with your product or service This captures what customers do, think, and use as they set out to achieve a goal that involves your product or service. It provides a framework that desig...

An imageboard or image board is a type of Internet forum which operates mostly via posting images. The first imageboards were created in Japan and inspired the creation of a number of English language imageboards. They are based on the textboard conc...

An interviewing technique that reveals connections between a product’s characteristics and personal values It builds on Means–End Theory, which posits that people make purchasing decisions based on consequences afforded by using the produc...