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

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

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

مبادئ وقواعد التنظيم الإدراكي.

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

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

قانون تشابه.

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

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

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

قانون القرب.

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

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

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

ولفهم أفضل سنقتبس جزءًا من شرح ويكيبيديا:

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

قانون جيد الشكل.

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

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

نظرية اللون والفهم والتطبيق.

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

مواصفات اللون.

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

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

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

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

أعلى كثافة لكل لون هو اللون الموضح على عجلة الألوان، بينما أقل كثافة هو اللون الرمادي.

تباين الألوان.

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

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

وفقا ليوهانس إيتن،  هناك سبعة تباينات لونية، ثلاثة منها مذكورة هنا.

تباين النغمة.

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

التباين التكميلي.

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

تباين الضوء الداكن.

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

الكريات والسيطرة على التناقضات.

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

خاتمة.

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