هل ترنو إلى موقع إلكتروني مميز؟ تود معرفة خبايا تجربة المستخدم وكيفية تحسينها؟ تريد نجاح تسويقك عبر الإنترنت؟ 

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

محمد المقدم| UI-UX Designer 

خبرة أكثر من 7 سنوات بمجال الـ UI-UX Design وحاصل على شارة الـ Top rated من منصة UPwork للعمل الحر.

دعني قبل البدء أخبرك السبب وراء حدوث تلك المقابلة

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

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

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

ما سبب إهمال الناس للموقع الإلكتروني؛ ولماذا أو ما هو الدليل على أنه أفضل من منصات التواصل الاجتماعي| Social media platforms؟

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

لكن بالطبع الموقع الإلكتروني أفضل من منصات التواصل الاجتماعي وذلك لأسباب عدة:

1- تجربة المستخدم

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

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

2- الظهور في محركات البحث

بحسب إحصائية لعام 2012 فإن البحث على Google يستحوذ على نسبة 70% من البحث الكلي على الإنترنت؛ ولا غرابة في ذلك وأول معرفتنا جميعًا بعالم الإنترنت تكن من خلاله. وبالتالي ظهورك في حالة امتلاك موقع إلكتروني تكن أكبر بكثير من ظهورك في حالة امتلاكك لمواقع تواصل اجتماعي فقط. 

3- كثرة المنافسين على منصات التواصل الاجتماعي

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

4- المشتتات على وسائل التواصل الاجتماعي

بأخذك كمثال؛ تخيل معي أنك دخلت للتصفح على الـ Facebook، فهل يكون عقلك منتبه ومتقبل للمعلومات بصورة كافية أم أنه سرعان ما يتشتت بين المنشور وما قبله وما يليه؟

سؤال آخر؛ إذا صادفك منشور لشيء جديد (خدمة، تدريب...) وأعجبت به، هل بعد خروجك من المنصة تتذكر ما حصلت عليه من معلومات أو تتذكر هذا الشيء الجديد؟

وأخيرًا؛ هل إذا حوصرت بين محتويين ترفيهيين يتوسطهم محتوى مفيد ستتمسك بتكملة المحتوى المفيد أم تتخطاه للمسلي؟

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

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

أشار محمد في كلامه عن تجربة المستخدم/ User Experience فأنتقلنا لسؤاله عنها: ما هي تجربة المستخدم؟

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

نظرية باب نورمان  (ليس مستخدم غير واعي؛ بل تصميم سيء)

إذا تعرضت سابقًا للموقف الفكاهي من الوقوف أمام باب أحد المحلات الموضوع عليها يافطة بـ(ادفع/ اسحب) وفعلت العكس، ثم ضحكت وسخرت من نفسك وشككت في ذكائك؛ فستحب "دون نورمان" الذي يقول في نظريته:

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

ومن هنا أنصح كل من يريد التطور في مجال UX design ويتعمق في فهم تجربة المستخدم بقراءة الكتابين الآتيين:

The design is everything

كتاب لـ"دون نورمان" سيجيب عن كل أسئلتك من أجل تجربة مستخدم أفضل.

Don't Make me think

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

وهنا عقبت أروى قائلة (لا تجعل العميل يحرق دهون ليفهمك) 

كان هذا اقتباسًا حصلت عليه من كتاب Building your story brand؛ وأشارت أنه برغم اختلاف المجال الذي يتكلم فيه الكاتبان إلى أن الشيء ذاته أشارا على أهميته بنفس الطريقة!

لذا يمكن أن نتخذها قاعدة عامة:

في أي مجال كنت؛ "لا تجعل من أمامك يبذل مجهود كي يصل لمرادك." 

قبل معرفة خصائص تجربة المستخدم عليك الاهتمام بنقطتين:

1- معرفة وتحديد هدفك من واجهة المستخدم.

2- طريقة حساب تقدمك نحو هذا الهدف.

الهدف من تجربة المستخدم الجيدة:

السبب الرئيسي هو الـ ROI (العائد على الاستثمار/ Return on investment)

يتم حسابه عن طريق الـ Conversion Rate:

عبارة عن إجمالي نسبة عدد الزوار للموقع وعدد متخذي القرار المطلوب منهم، ويساوي (عدد الزائرين عدد متخذي القرار).

كلما كان الـ Conversion Rate أعلى كلما كان التصميم يحقق تجربة مستخدم جيدة.

هرم احتياجات المستخدم

لتحقيق الخصائص علينا اولًا معرفة احتياجات المستخدم والتي تأتي بشكل هرمي مقسمة لمجموعتين مكونتين من 6 طبقات كل مجموعة تحوي 3 طبقات.

المجموعة الأولى خاصة بالمنتج وتتكون من:

1- عمل الموقع بشكل فعّال ويلبي احتياجات العميل.

2- الموثوقية التي تُمكّن المستخدم من الاعتماد على الموقع.

3- سهولة الاستخدام ومنطقية الأقسام.

المجموعة الثانية خاصة بخدمة المستخدم وتتكون من:

1- الانتباه لأي عائق يمكن أن يمنع المستخدم من استخدام منتجي. عليك اتباع العدل لا المساواة بالتصميم:

- المساواة: هي عمل تطبيق بسمات ثابتة لا تتغير لجميع المستخدمين.

- العدل: هو إتاحة مزايا وخصائص _اختيارية_ مختلفة للموقع/ التطبيق؛ تساعد من يواجه مشكلة مع التصميم الطبيعي.

2- أن يكون ممتع.

3- وجود قيمة وفائدة له.

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

لِما يمثل الموقع الإلكتروني عامل كبير في نجاح عملية الشراء يا محمد؟

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

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

نعود مع سؤال جديد؛ ما هي وظائف تجربة المستخدم؟

لفهم الوظائف علينا أولًا أن نعي ثلاث تصنيفات وظيفية للعاملين بالمجال:

1- Generalist

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

نتخيله كخط أفقي من اليسار لليمين؛ مارًا بكل المهارات.

2- Specialist

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

نتخيله كخط رأسي من الأعلى للأسفل؛ تعلم مهارة ثم تعمق فيها للنهاية.

3- T Shape

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

وظائف مجال الـ UI-UX

1- Interaction designer

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

2- Value designer

هو المهتم بالشكل العام الذي يظهر به الموقع من الألوان، الرسومات التوضيحية، الأيقونات... إلخ.

3- Motion designer

يحدد ما يظهر للمستخدم عندما يأخذ فعل انتقال داخل الموقع/ التطبيق؛ فهو يهتم بشعور المستخدم أثناء التنقل بين الصفحات والأقسام.

4- Virtual Reality

هو الذي يعمل ليُشعر المستخدم أنه بعالم حقيقي، وهذا بالمؤثرات الصوتية والإضاءات.

عند التكامل بين الـ4 وظائف السابقة وتناغمها في حل المشاكل التي قد يواجهها المستخدم؛ يتم إنتاج تصميم مطابق لمعايير تجربة المستخدم الجيدة .

حدثنا قليلًا عن المليار مستخدم المحتملين لدخول الانترنت أو نظرية الـ Next billion user؟

الـNext billion user تقول أن هناك بليون شخص محتمل دخولهم إلى الإنترنت لكن لا يتمكنوا من هذا بسبب مشاكل يواجهونها بالوقت الحالي، مثل:

1. مشاكل مادية.
2. أمية تكنولوجية.
3. عدم توفر إنترنت.
4. أمية علمية.

معايير إذا أخذتها في الاعتبار ستتمكن من جذب البليون مستخدم المحتملين:

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

Color blind simulator

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

هل يوجد طريقة نختبر بها الموقع الإلكتروني قبل إطلاقه؟ 

اختبار الموقع قبل إطلاقه شيء رئيسي من العملية الكاملة لبناء المواقع ويوجد طرق عدة لإتمامه بالاضافة لوجود وظيفة مخصصة لعمله يقوم بها الـ Tester.

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

ويوجد مواقع تقوم بإختبار تجربة المستخدم مثل:

User testing websites

دعونا ننتقل للسؤال المحير، ما الأساسيات التي يجب تواجدها بـ Portfolio مصمم واجهات المستخدم؟

ليس من الضروري وضع صورة مباشرة للموقع؛ لكن عليك ألا تنسى وضع:

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

ما أنصحك به كي لا تقع في خطأي، أظهر مجهودك بالـ Portfolio بكل الطرق الممكنة.

بخبرتك في التعامل مع عملاء من مختلف الجنسيات؛ من الأفضل العميل المصري أم الأجنبي؟

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

السؤال المهم هنا هو: كيف تجذب العميل الجيد؟

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

بذكر العميل ننتقل لكيفية أخذ الـ Brief من العميل؟

يمثل الـ Brief أزمة لدى الكثير ومن ضمنهم العميل، حل هذه الأزمة يكون عن طريقك أنت كـ UX designer وهذا بالتفرقة بين 3 أشياء:

1. البيانات: 

جميع المعلومات التي تسمعها من العميل سواء باجتماع، مكالمة، رسائل... .

2. المعرفة:

 تحصل عليها بتصنيفك وترتيبك وتحليلك للبيانات.

3. الحكمة: 

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

متى يكون طلب العميل غير قابل للتطبيق؟

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

بماذا تنصح شخص يريد أن ينمي نفسه بالمجال ويصبح متقدم به؟

• كورس Google UX: 

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

• عمل Portfolio قوي، يمكن أن يساعدك هذا الموقع:

Portfolio Template

• عرض الشغل على متخصص ومستخدم: 

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

قبل سماع أسئلة الحضور نختم بسؤال، كيف أُصبح مبدع بهذا المجال؟

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

مصادر تساعدك في هذا:

• Material Design color tool 
• Contrast checker
• Contrast checker 
• Extract text from image
• Typography Scale
• Random Faces for ppl doesn’t exist 
• Random Faces

شرعنا هذه اللحظة في تلقي الأسئلة..

وبدأ "موكا" فقال: ما نصيحتك كي نجعل الإعلانات بالمواقع لا تسبب ضيق للمستخدم؟

1.  لا تُكثر منها بطريقة تكن أشبه بالزن، اجعلها بالقدر المنطقي المتعارف على أنه لن يزعج المستخدم.
2.  مهد للمستخدم قبل ظهور الإعلان ووضح الفائدة التي تعود عليه إذا استجاب لندائك.
3. اتبع الـ Information architecture، التي تجعلك ترتب عرض المعلومات بصورة ناجحة من الخطوة الأولى حتى الطلب المباشر.

وسأل "حسام" هل هناك خطوات منظمة يتم اتباعها لتصميم واجهات المستخدم أم تختلف، وما أوجه الاختلاف إن وجد؟

يوجد خطوات منظمة يجب اتباعها، وإن وجد إختلاف فهناك خطوات لا يمكن التخلي عنها وهي:

1.   العصف ذهني.
2.   تحديد مشاكل المستخدم.
3.  عمل التصميم.
4.  اختبار التصميم.
5.   إطلاق المشروع.

وبين هذه الـ 5 تختلف الخطوات والعمليات التي تجرى بناءً على الخدمة المقدمة والميزانية المتوفرة... إلخ.

كيف أبدا الـ UX Research في بداية بناء موقعي الإلكتروني بدون وجود مستخدم فعلي؟

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

وسألت "ريم" أريد معرفة طريق أسير عليه كي أتمكن من التميز بمجالي كـ UI-UX Content creator؟

يجب أن تأخذي مسار لتعلم UX research كامل؛ تحديدًا جزء الـ Information architecture، وبجانب هذا مهم أن تكوني متقنة للغة التي تكتبين بها  ولشتى قواعدها.

يوجد طاقم كبير ومتطلبات وظيفية عدة للعمل على موقع إلكتروني، فما الحد الأدنى الذي يمكن تواجده بدون ضرر على المشروع؟

عادة نعود للميزانية في هذا الأمر؛ هذا الموقع هدفه تحقيق ربح -عادة- ففي حالة نقص الميزانية يمكن الاستعاضة عن مهارات معينة بالأدوات التقنية كي نتعامل مع الوقت الحالي، لكن بالتأكيد السير على العملية بشكل كامل يكون أفضل بكثير.

ثم أستفسرت "ندى" كـ UX Writer هل الخطوات المستخدمة للعمل على الموقع الإلكتروني تختلف عن تطبيقات الموبايل؟

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

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

لا، يمكن أن يتم عمل تغييرات بسيطة بها لكن لا تجعلني أشعر أنني بموقع أخر.

تحقيق الاختلاف الناجح يكون بما يظهر لكل فئة على حسب نيتها وسلوكها الشرائي.

بعدها سألت "بدور" هل يوجد كلمات معينة يبحث عنها العميل وتشجعه على إتخاذ القرار أتبعها وأنا أكتب الـ Micro copy؟

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

وأختتم "أحمد" هل يوجد بدائل أوفر من المواقع الإلكترونية وتؤدي نفس غرضها يمكن عرضها على العميل؟

يوجد بدائل وهي:

• عمل Landing Page وهي صفحة واحدة يتم بها عرض تفاصيل الخدمة بشكل مختصر و CTA واضح ومباشر.
• موقع بعدد صفحات قليلة.
• استغلال الـ Wordpress في تقليل تكلفة بناء موقع من البداية.

وبهذا تكون رحلتنا في عالم المواقع الإلكترونية وعقل العميل قد إنتهت!

أتمنى أنك حظيت بجلسة قراءة ممتعة، أضافت لعقلك سُكّان جدد من المعلومات المفيدة، طاب يومك.