علم نفس التصميم وعلم الأعصاب في UX الرائع

استمع إلى النسخة الصوتية من هذه المقالة

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

دماغ الإنسان كسول ومتحيز وعرضة للاختصارات.

يمكن أن تكون دراسة تجربة المستخدم للإدراك البشري طريفة وغير علمية ومليئة بالافتراضات الخاطئة - ربما يكون ذلك خطأ من دماغ كسول.

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

أدخل علم الأعصاب.

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

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

لنبدأ بمقدمة حول "التفكير السريع" التفاعلي ونقدم بعض النصائح للمصممين للمساعدة في الاستفادة من قوة علم الأعصاب من أجل إنشاء تجارب مستخدم رائعة.

علم نفس التصميم: التفكير السريع ، التفكير البطيء

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

هل أنا في المكان "الصحيح"؟ هل يجب أن أثق في هذا الموقع؟

حدد الباحث في YouTube UX Javier Bargas-Avila في دراسة عام 2012 أن الأشخاص يشكلون ردود فعل جمالية على صفحة ويب في أول 17 إلى 50 مللي ثانية بعد التعرض .

لوضع ذلك في المنظور الصحيح ، يستغرق الأمر 300-400 مللي ثانية لتومض بالعين. قد يتلقى منتجك المحاكمة ، والحكم ، والحكم في أقل من غمضة عين.

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

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

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

النظام 1: سريع ، آلي ، متكرر ، عاطفي ، نمطي ، لاوعي.

تفكير النظام 1 هو رد فعل - مسؤول عن الإدراك المعقد ولكن الغريزي مثل تحديد المسافة بين الأشياء أو تحديد الاستجابات العاطفية. يتخلف دماغك الكسول عمومًا عن تفكير النظام 1.

النظام 2: بطيء ، مجهود ، منطقي ، حسابي ، واعي ، غير متكرر.

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

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

عند اتخاذ القرارات بسرعة ، يمكن للدماغ أن يعتمد بشكل مفرط على المخططات أو النماذج العقلية - أنماط مألوفة للمعلومات والتفاعل. عندما يتم تفعيل تفكير النظام 1 ، لا يتم تفعيل النظام 2 أبدًا. قد لا يكون الناس على دراية باختصار عملية صنع القرار في أدمغتهم ، لكنها تؤثر بشدة على سلوكياتهم وتصورهم للمنتج.

علم النفس في التصميم

يستهلك الدماغ البشري 25٪ من أكسجين الجسم على الرغم من أنه يشكل 2٪ فقط من كتلته. الدماغ كسول كآلية للبقاء - التعرف على الأنماط والاختصارات تعني طاقة أقل تنفق بوعي في معالجة الموقف . يحدد الدماغ الأشياء ويصنفها ويتجاهلها حتى تصبح ذات صلة مرة أخرى.

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

قفز عدد قليل من تقنيات علم الأعصاب مؤخرًا إلى أبحاث UX ، مما ساعد الباحثين على إلقاء الضوء على الأشياء التي تحفز "التفكير السريع".

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

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

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

النصيحة الأولى لعلم نفس التصميم: اجعلها سهلة التحديد

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

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

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

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

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

النصيحة رقم 2 في علم نفس التصميم: حدد ما هو قادم

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

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

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

النصيحة رقم 3 في علم نفس التصميم: نظِّم القراء الكسالى

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

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

كسر النمط F - على سبيل المثال ، وضع المعلومات المهمة في الركن الأيمن السفلي - سيجعل من الصعب العثور عليها.

ترويض النص الخاص بك

وفقًا لدراسة Nielsen Norman لـ 45237 مشاهدة للصفحة ، قرأ الناس حوالي 20٪ فقط من النص الموجود على الصفحة. والأسوأ من ذلك ، في المواقع التي تحتوي على المزيد من المحتوى ، خصص الأشخاص حوالي 4 ثوانٍ إضافية لكل 100 كلمة إضافية من النص.

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

• الكلمات الرئيسية المميزة
• عناوين فرعية ذات مغزى
• قوائم نقطية
• فكرة واحدة لكل فقرة
• نمط الهرم المقلوب - ابدأ بالنتيجة
• نصف عدد الكلمات (أو أقل) من الكتابة التقليدية

العمل مع اللون البوب ​​والتباين

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

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

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

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

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

تساعد أي ميزات أو مصممي المعلومات على إلغاء تحديد الأولويات المستخدم في التركيز مباشرة على معظم التفاعلات أو المعلومات التي يتم استيرادها.

النصيحة رقم 4 في علم نفس التصميم: فحص القناة الهضمية

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

تعد الاختبارات التي تبلغ مدتها 5 ثوانٍ أداة قوية لتحديد ما إذا كانت تصميماتك مفهومة على الفور أم لا.

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

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

المصممين كـ "قراء العقل"

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

تصميم تجربة المستخدم الرائعة ليس سحرًا - إنه علم. علم الأعصاب.

تمت كتابة هذا المقال بالتعاون مع الباحثة في تجربة المستخدم Caitria O'Neill ، التي تعمل سابقًا في Facebook ، وتعمل حاليًا في Airbnb ، وزميلة في مدرسة d.school بجامعة ستانفورد .

• • •

مزيد من القراءة على مدونة Toptal Design:

• تجربة مستخدم التجارة الإلكترونية - نظرة عامة على أفضل الممارسات (باستخدام مخطط المعلومات الرسومي)
• أهمية التصميم المتمحور حول الإنسان في تصميم المنتج
• أفضل مجموعات مصممي UX - أمثلة ودراسات حالة ملهمة
• مبادئ ارشادية للواجهات المتنقلة
• التصميم التوقعي: كيفية إنشاء تجارب مستخدم سحرية