كيف يؤثر اللون على تجربة المستخدم وسلوك المستخدم
نشرت: 2016-12-24اللون: عندما يكون التصميم صحيحًا ، فمن المحتمل ألا تلاحظه أبدًا - ولكن عندما يخطئ؟ لا يهم ما إذا كانت خلفية ساطعة للغاية ، أو خلفية جذابة ، أو نص أسود على خلفية رمادية داكنة ، يمكن أن تدمر خيارات الألوان غير المتكافئة حتى التطبيق الأكثر فاعلية. مثل الكثير من جوانب التصميم ، اللون ليس موجودًا فقط لإضفاء الحيوية على التطبيق. يمكن أن يكون اللون أداة مثل أي ميزة أخرى لتجربة المستخدم.
فلسفة تصميم الرسوم المستخدمة في تصميم التطبيق - من حجم كل عنصر ، إلى كيفية انزلاقه عبر واجهة المستخدم ، إلى نعم ، اللون - تؤثر على سلوك المستخدم. هناك سبب وجيه وراء قضاء المصممين في كثير من الأحيان الأشهر الأولى من المشروع في معاناة من لوحات الألوان وليس الإطارات السلكية ، بعد كل شيء.
يمكن أن يكون اختيار اللوحة المثالية هو الفرق بين تصميم تطبيق التأمل الذي يساعد المستخدمين فعليًا على الاسترخاء وبين تصميم تطبيق يجعلهم يرغبون في إلقاء هواتفهم على الحائط. إنه الفرق بين التطبيق المصرفي الذي يجعلك متوترًا بشأن التحقق من رصيدك والتطبيق الذي يمكنه تهدئة مخاوفك بشأن موعد وصول شيك الراتب التالي.
إذن كيف تحصل عليه بشكل صحيح - وماذا يمكنك أن تفعل لإتقان اللون في تصميمك؟
فلسفة التصميم الجرافيكي: نظرية اللون
قبل الدخول في فلسفة التصميم الجرافيكي (وعلم النفس!) ، من المهم فهم بعض المبادئ الأساسية للون والتصميم. على الرغم من أن اللون قد لا يبدو كموضوع معقد للغاية ، إلا أن هناك سببًا وجيهًا يجعل كل فصل فني يبدأ ليس فقط بدرس حول كيفية استخدام الألوان ولكن أيضًا كيفية صنع الألوان.
الأساسيات - كما هو موضح بواسطة عجلة الألوان - بسيطة: يمكن دمج الألوان الأساسية (الأحمر والأصفر والأزرق) لإنشاء ألوان ثانوية (الأخضر والأرجواني والبرتقالي). وبالمثل ، يمكن إضافة أجزاء مختلفة من اللون الأبيض إلى اللون لإنشاء الصبغات ، ويمكن إضافة اللون الأسود لإنشاء الظلال.
تعتبر الألوان المقابلة لبعضها البعض (مثل الأحمر والأخضر ، أو الأزرق والبرتقالي) مكملة. تتناقض هذه الألوان بشدة ، مما يجعلها تبرز عندما تكون بجوار (أو فوق) بعضها البعض.
تعتبر الألوان المجاورة لبعضها البعض مماثلة. تتميز هذه الألوان بتباين أقل بكثير ، مما يعني أنها لا تبرز كثيرًا عندما تكون قريبة من بعضها البعض.
لا يوجد شيء "صحيح" أو "خطأ" بطبيعته في الألوان ذات التباين العالي أو المنخفض. في بعض الأحيان ، يتطلب التطبيق ألوانًا زاهية تتناقض بشكل صارخ مع بعضها البعض. في أوقات أخرى ، سترغب في شيء ألطف قليلاً. بشكل عام ، كلما أردت إبراز شيء ما ، زاد الاعتماد على الألوان المتباينة.
أفضل طريقة للتعرف على كيفية سير الألوان (ولا تتماشى) معًا هي اللعب بها. حتى إذا كنت لا تعمل في مشروع في الوقت الحالي ، فإن الدوران السريع لعجلة ألوان Adobe قد يجعل عقلك يفكر في اللون بطريقة جديدة.
عينات من العاطفة: اللون وعلم النفس
عندما تقوم بترسيخ فلسفة تصميم الجرافيك وراء تطبيقك ، لا يمكنك مجرد التفكير في شكل الأشياء - عليك التفكير في شعورها. نحن لا نتحدث عن ردود الفعل اللمسية أيضًا. منذ أن درس Johann Wolfgang Goethe التأثيرات الفسيولوجية للون ، أصبحنا مهووسين باستخدام اللون لإنتاج تأثيرات جسدية وعاطفية.
حتى اليوم ، يحتل اللون مركز الصدارة في فلسفة التصميم للعديد من العلامات التجارية. تميل الرعاية الصحية ، والأعمال التجارية ، والحكومة إلى استخدام اللون الأزرق ، لأنه يعطي إحساسًا بالثقة والاحتراف. يُنظر إلى اللون الأخضر على أنه لون شبابي مليء بالطاقة - وبالطبع يعكس الشعور بالبيئة والقرب من الطبيعة. اللون الأحمر مفعم بالحيوية والاندفاع ، ويعطي انطباعًا بالسرعة والكفاءة والقوة. كل لون نراه (وبالتأكيد كل لون نربطه جوهريًا بعلامات تجارية معينة) يشير إلى شيء ما ، سواء بشكل مباشر أو غير مباشر ، يساعد في دفع تصورنا للعلامات التجارية الفردية.
فكر في العلامات التجارية والرموز التي تتعرف عليها على أنها شديدة التركيز على الألوان. تتميز كل من Apple و Wikipedia و The New York Times بألوان رمادية ترمز إلى الهدوء الجدير بالثقة. تعتبر هذه العلامات التجارية متوازنة وموثوقة. تتميز كل من Whole Foods و John Deere و Starbucks بظلال خضراء في شعاراتها ، وتربط الطبيعة والكمال بعلامتها التجارية ومنتجاتها.
حتى أن بعض الألوان تتجاوز علاماتها التجارية ، وتحدد صناعات بأكملها. فكر في عدد مطاعم الوجبات السريعة أو سلاسل المطاعم التي تستخدم أنظمة اللون الأحمر أو الأصفر ، على سبيل المثال. تساعدنا هذه الألوان على تحفيزنا عقليًا ، وتضعنا في مكان نفسي معين يهيئنا لشراء نوع من المنتجات.
في حين أن هذا شيء اكتشفه المسوقون منذ فترة طويلة ، فإن العلم يبرر الكثير من مشاعرنا المتبادلة حول اللون. الأحمر ، على سبيل المثال ، وجد أنه يجعل بعض الناس يتفاعلون بشكل أسرع وأكثر قوة مع محفزات معينة. يمكن أن يخيف أيضًا: وجد الباحثون أنه عندما رأى المتقدمون للاختبار اللون الأحمر ، كانت درجاتهم أسوأ.
حتى الغريب؟ لون حبوب منع الحمل له تأثير خفيف على كيفية عملها. تعمل الحبوب الزرقاء بشكل أفضل كمهدئات ، بينما يعمل اللون الأصفر بشكل أفضل كمضاد للاكتئاب ، وفي جميع الحالات ، تعمل الألوان الزاهية بشكل أفضل. في حين أن هذا من المحتمل أن يكون مجرد تأثير وهمي يعزز استجاباتنا للأدوية الفعالة ، إلا أن التأثير قوي بما يكفي لكي تضعه الشركات في الاعتبار عند إنتاج أدوية جديدة.
الآن ، لا نقول إن استخدام نظام ألوان أصفر في تطبيق تتبع الحالة المزاجية سيجعله فعالًا كمضاد للاكتئاب ، لكن لوحة الألوان التي تختارها يمكن أن يكون لها تأثير معقول على الحالة المزاجية للمستخدم - لذا اختر بحكمة.
موصى به لك:
كيف ستحول Metaverse صناعة السيارات الهندية
ماذا يعني توفير مكافحة الربح بالنسبة للشركات الهندية الناشئة؟
كيف تساعد الشركات الناشئة في تكنولوجيا التعليم في تطوير مهارات القوى العاملة في الهند وتصبح جاهزة للمستقبل ...
الأسهم التقنية في العصر الجديد هذا الأسبوع: مشاكل Zomato مستمرة ، EaseMyTrip تنشر Stro ...
تتخذ الشركات الهندية الناشئة اختصارات في مطاردة للتمويل
منصة التسويق الرقمي Logicserve Bags INR 80 Cr Funding، Rbrands as LS Dig ...
اللون وسهولة الاستخدام
لا يقتصر التصميم على المظهر الجميل فحسب - بل يتعلق بالوظيفة وسهولة الاستخدام ، وهما المبدأان اللذان يمكن القول أنهما الأهم لأي مصمم UX. إذا لم تكن UX سلسة ، فلا يهم كم هي جميلة لوحة الألوان التي اخترتها ، أو مدى روعة واجهة المستخدم الخاصة بك. إذا لم يتمكن المستخدم من التمرير عبره بكفاءة ، فلن يتمتع بأي قوة باقية.
لكن ما علاقة اللون بكل ذلك؟
بسيط: اللون هو أداة يمكن أن تساعد في توجيه العين . إذا كان بإمكانك استخدام الألوان بكفاءة ، فيمكنك توجيه مستخدم جديد من خلال تطبيقك بدون برنامج تعليمي طويل أو سلسلة من مقاطع الفيديو المعقدة أو حتى كلمة واحدة. تستخدم واجهة المستخدم البديهية اللون لتوجيه ليس فقط انتباه المستخدم - ولكن أيضًا لتفاعلاتهم مع التجربة بأكملها.
تخيل ، لثانية واحدة ، أنك تطور تطبيقًا لشركة تموين تساعد المؤسسات الكبيرة على تخصيص طلبات الطعام بسهولة. يقوم العميل المحتمل بتنزيل تطبيقك لأول مرة وفتحه. ماذا يرون؟
في التطبيق ، يتم تلوين معظم عناصر القائمة - بما في ذلك الخلفية وأي مربعات معلومات - في لوحة باهتة باهتة من ألوان التدرج الرمادي. الاستثناء الوحيد هو المربع الأحمر البرتقالي الذي يشير إلى "طلب". بصفتك المصمم ، فأنت تعلم أن الشيء الأول الذي يريد المستخدمون القيام به عند استخدامهم لتطبيقك هو إعداد طلب الطعام الخاص بهم دون عناء. بدلاً من إخفاء هذه الميزة في عمق التطبيق ، أو مطالبتهم بالتمرير لأسفل صفحة تلو الأخرى للوصول إليها ، فأنت تضعها في المقدمة وفي المنتصف. ليس هذا فقط ، لكنك تجذب انتباههم إليه على الفور. يساعد اللون على الظهور ، ويظهر للمستخدمين الجدد المكان الذي يحتاجون إليه بالضبط.
وبالمثل ، فإننا نتفاعل مع اللون بطرق مختلفة بشكل يومي ونبني بعض الارتباطات الاجتماعية في أذهاننا. خذ إشارة توقف ، على سبيل المثال: الأخضر يعني الانتقال ، والأحمر يعني التوقف ، والأصفر يعني الإبطاء (أو ينبهنا إلى شيء ما في المستقبل). من خلال وضع تحذير مهم باللون الأصفر ، أو باستخدام اللون الأحمر لإبراز شيء ما ، يمكنك نقل رسالة قوية تهيئ المستخدم لإدخالاته.
ومع ذلك ، يمكن استخدام نفس المنطق لأكثر من مجرد شاشات تحذير. يمكن أن يؤثر تغيير لون زر في تطبيقك يؤدي إلى عمليات شراء داخل التطبيق بشكل كبير على معدلات التحويل.
على الرغم من عدم وجوده داخل التطبيق ، وجد HubSpot أنه بإمكانه زيادة معدل التحويل بنسبة 21٪ ببساطة عن طريق جعل الزر أحمر بدلاً من اللون الأخضر. الآن ، هذا لا يعني أنه يجب عليك تغيير كل زر شراء داخل التطبيق إلى لون قرمزي لامع ، ولكن هناك حجة هنا أن اللون لا يمكن أن يكون مجرد جزء من فلسفتك في التصميم: يجب أن يكون مركزيًا في فلسفة تطوير التطبيق بالكامل.
استخدام اللون بحكمة: فلسفة التصميم وإمكانية الوصول
في Proto.io ، تكون إمكانية الوصول دائمًا في طليعة فلسفتنا في التصميم. لكي نكون صريحين ، فإن إمكانية الوصول هي شيء يجب تصميمه جيدًا. إذا لم يكن موجودًا ، فالتصميم ببساطة ليس جيدًا جدًا.
يعاني حوالي 8٪ من الرجال و 0.5٪ من النساء من شكل من أشكال عمى الألوان. على عكس الفكر الشائع ، لا يوجد نوع واحد من عمى الألوان ، لكن عمى الألوان الأحمر / الأخضر يميل إلى أن يكون الأكثر شيوعًا. سيواجه الشخص الذي يعاني من هذا النوع من عمى الألوان مشكلة بشكل عام في رؤية الاختلافات في كل من الأحمر والأخضر. في حين أن شدة هذا النوع من عمى الألوان تختلف قليلاً ، حتى عمى الألوان الأحمر / الأخضر المعتدل يمكن أن يجعل استخدام العديد من التطبيقات أمرًا مستحيلًا تقريبًا.
بعيدًا عن عمى الألوان ، غالبًا ما يكافح المستخدمون الذين يعانون من قصر النظر لقراءة نص بتباين منخفض ما لم يحركوا الشاشة بالقرب من وجوههم - وهو أمر يمكن أن يكسر قابلية استخدام العديد من التطبيقات.
حل هاتين المشكلتين بسيط إلى حد ما: تجنب استخدام ألوان غير متباينة عند عرض نص على خلفية . بينما لا يمكنك ضمان أن يتمكن الجميع من رؤية تطبيقك بالطريقة التي تريدها ، إذا كنت تستخدم ألوانًا متباينة ، فإنك على الأقل ستمنح الأشخاص تطبيقًا يمكنهم استخدامه. وبالمثل ، فإن استخدام ألوان عالية التباين سيجعل قراءة النص أسهل للجميع - حتى لو لم يكن لديهم مشكلة في الرؤية.
هناك خيار آخر لزيادة إمكانية الوصول وهو تقديم لوحات ألوان قابلة للتبديل في تطبيقك. على الرغم من أن هذا ليس خيارًا متاحًا للجميع ، إلا أنه يمكن أن يعزز بشكل كبير إمكانية الوصول إلى تطبيقك. يمكنك أيضًا السماح للمستخدمين بتغيير لون ميزات معينة. على سبيل المثال ، يمكن أن يكون لديك خيار يغير لون تمييز تطبيقك أو لون النص في جميع أنحاء التطبيق. على الرغم من أن كلا الخيارين قد يبتعدان عنك بعضًا من التحكم ، إلا أنهما سيضمنان إمكانية وصول تطبيقك إلى جمهور أوسع.
إذا كنت لا تزال تكافح لمعرفة كيفية دمج اللون في فلسفة التصميم الخاصة بك بطريقة لا تضر بإمكانية الوصول إلى تطبيقك ، فنحن نقترح مراجعة مكتبة تصميم المواد في Google.
اختيار اللوحة المثالية: ترسيخ فلسفة التصميم الخاصة بك
على الرغم من أنه يجب أن يكون واضحًا أن هناك بعض القواعد التي يجب اتباعها عندما يتعلق الأمر بالألوان ، إلا أنه ليس بالضرورة علمًا أيضًا. غالبًا ما يتعلق اللون بأشياء أكثر تجريدًا ، مثل الشعور. حتى إذا كان تطبيقك لا يحاول إظهار نوع من المشاعر لدى المستخدم ، فهذا لا يعني أنه لن يفعل ذلك. في حين أن العثور على اللوحة المثالية ليس محاولة بالأبيض والأسود ، فإننا نقترح البدء بشيء من التدرج الرمادي .
أنشئ نموذجًا أوليًا مسطحًا لتطبيقك بتدرج الرمادي واستخدمه كخط أساس. قم بتدوين كيف يبدو الأمر وملمسه: مرره لفريق ضمان الجودة الخاص بك ، واطلع على ما سيقولونه. هل عملية الإعداد الخاصة بك غامضة بدون ألوان؟ هل تلفت الانتباه إلى الأجزاء الخاطئة في تطبيقك؟ مع هذه الملاحظات ، صمم المزيد من النماذج ، هذه المرة جلب اللون. لا تعتمد على لوحة واحدة. بدلاً من ذلك ، خذ إشارة من موقع تصميم المواد من Google والعب مع عدد قليل من حواملها.
أرسل هذه المراجعات إلى سؤال وجواب أيضًا. لا تخف من اختبار أ / ب ضد بعضهما البعض (وضد النسخة الأصلية بتدرج الرمادي). تأكد من طرح بعض الأسئلة الصعبة حول الألوان التي تجلبها إلى المعركة. هل تستخدم الألوان لتوجيه عين المستخدم في التطبيق؟ هل تقوم فقط برمي الألوان على الشاشة من أجل إضافة شرارة؟ هل يصرف اللون انتباه المستخدم عن الوصول إلى المكان الذي يريد الذهاب إليه؟
لا تنس علم نفس المستخدم أو إمكانية الوصول. إذا كنت تقوم بإنشاء تطبيق سفر ، فهل تريد حقًا أن يكون كل شيء باللون الأحمر الفاتح؟ إذا كنت تنشئ تطبيقًا للرعاية الصحية ، فهل يجب أن تكون خلفيتك خضراء حقًا؟ هل تتباين ألوانك بدرجة كافية ليكون النص مقروءًا؟
يأخذ تصميم UX الجيد كل هذه الأسئلة في الاعتبار - بعد كل شيء ، للون تأثير حاسم على سلوك المستخدم ومتعته. إذا كانت فلسفتك في التصميم لا تأخذ ذلك في الاعتبار ، فيمكنك إنشاء تطبيق لا يمكن الوصول إليه أو استخدامه كما تعتقد. تأكد من أنك تقوم بعمل نماذج أولية لتصميمك في كل خطوة على الطريق ، ولا تعلق كثيرًا على لون أو لونين.
جرب ، اختر لونًا آخر ، واستمر في المراجعة حتى تصل إلى لوحة ألوان مثالية لك.