كيفية تطوير موقع الويب أو التجارة الإلكترونية أو مخططات ألوان التطبيق

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

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

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

ما هي أهمية اللون؟

  • ادعى 85٪ من الناس أن اللون له تأثير كبير على ما يشترونه.
  • تعزز الألوان التعرف على العلامة التجارية بمعدل 80٪.
  • انطباع اللون مسؤول عن 60٪ من قبول أو رفض المنتج.

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

  1. لون أصلي - اختر لونًا يناسب طاقة منتجك أو خدمتك.
  2. ألوان العمل - هذا مفقود من مخطط المعلومات أدناه ، ولكن تحديد لون الإجراء الأساسي ولون الإجراء الثانوي مفيد للغاية. إنه يعلم جمهورك التركيز على عناصر محددة لواجهة المستخدم بناءً على اللون.
  3. Aألوان إضافية - اختر المزيد الألوان التي تكمل لونك الأساسي ، الألوان المثالية هي التي تجعل لونك الأساسي فرقعة.
  4. ألوان الخلفية - اختر لونًا لخلفية موقع الويب الخاص بك - ربما يكون أقل عدوانية من لونك الأساسي. ضع في اعتبارك أيضًا الوضع المظلم والفاتح .. المزيد والمزيد من المواقع تدمج أنظمة الألوان في الوضع الفاتح أو الداكن.
  5. ألوان الخط - اختر لونًا للنص الذي سيكون موجودًا على موقع الويب الخاص بك - تذكر أن الخط الأسود الخالص نادر الحدوث ولا يوصى به.

كمثال ، شركتي Highbridge طورت علامة تجارية عبر الإنترنت لمصنِّع ملابس أرادت إنشاء موقع تجارة إلكترونية مباشر للمستهلك حيث يستطيع الناس ذلك شراء الفساتين عبر الإنترنت. لقد فهمنا جمهورنا المستهدف وقيمة العلامة التجارية - ولأن العلامة التجارية كانت في الغالب رقمية ولكن كان لديها أيضًا منتج مادي - فقد ركزنا على مخططات الألوان التي تعمل بشكل جيد عبر الطباعة (CMYK) ولوحات القماش (Pantone) ، وكذلك رقمي (RGB و Hex).

اختبار مخطط الألوان باستخدام أبحاث السوق

كانت عمليتنا لاختيار مخطط الألوان لدينا مكثفة.

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

خزانة 52 نظام الألوان

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

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

الألوان والمسافة البيضاء وخصائص العنصر

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

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

إليك موقع التجارة الإلكترونية الناتج باستخدام نظام الألوان

  • Closet52 - شراء فساتين عبر الإنترنت
  • صفحة مجموعات Closet52
  • صفحة منتج Closet52

قم بزيارة Closet52

سهولة استخدام الألوان وعمى الألوان

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

عمى الألوان هو عدم القدرة على إدراك الاختلافات بين بعض الألوان التي يمكن للمستخدمين غير ذوي الإعاقة الملونة تمييزها. يؤثر عمى الألوان حول خمسة إلى ثمانية بالمائة من الذكور (حوالي 10.5 مليون) وأقل من واحد في المائة من الإناث.

Usability.gov

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

كيفية اختيار نظام الألوان لموقعك على الويب