نظرية الألوان.. الجزء الرابع

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

ملحوظة هذا مقال مترجم لقراءة المقال الأصلي اضغط هنا

لقراءة الجزء الأول.. اضغط هنا

لقراءة الجزء الثاني.. اضغط هنا

لقراءة الجزء الثالث.. اضغط هنا

كنه اللون | Hue

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

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

أمثلة

اللون الأولي المختار في الخلفية وأغلب النصوص هنا هو.. الأحمر الساطع!

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

estilorama

الأحمر الصريح هو لون شائع جدًا في تصميم المواقع.

mix

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

steveottenad

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

صفاء اللون | Chroma

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

أمثلة

moviestills

اللون السماوي هنا لديه درجة نقاء عالية جعلته بارزًا جدًا بالمقارنة بالأسود والأبيض حوله.

canalconnection

تصميم آخر بلون أزرق شديد النقاء، كما يحتوي على ألوان وظلال أقل نقاءً.

fruehjahr

الألوان ذات النقاء العالي هي الأفضل في الاستخدام في التوازن والاعتدال مثل هذا التصميم.

التشبع | Saturation

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

أمثلة

sifrvault

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

disfrutasanjuan

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

craftsale

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

sunrisesoya

مثال آخر يؤكد على الفكرة السابقة.

القيمة | Value

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

أمثلة

creativespark

القيمة العالية من الأصفر تبدو أكثر بروزًا مقابل القيمة الأقل من الأسود والرمادي.

oysterdesign

يجمع التصميم ما بين قيمتين من الأزرق، فالقيم المختلفة تعطي تباين كافٍ لإظهار التصميم مما يعطي شكل عام جذاب.

copimaj

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

whoseview

الأحمر هنا هنا قيمته أقل من الأزرق الفاتح والذي بدوره أقل قيمة من الأبيض.

colourpixel

العين البشرية يمكنها أن تلقط الفرق بين القيم المختلفة حتى في تصميم كهذا.

الدرجة | Tone

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

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

أمثلة

lakesideheritage

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

brightkite

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

mmuller

يمكن تدعيم درجات الألوان بدرجات من الرمادي حولها مثل هذا التصميم.

mergeweb

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

metalab

بعض الألوان قد نظنها لون رمادي إلا أنها ألوان أخرى خفيفة الدرجة جدًا.. مثل هنا الخلفية لونها أزرق إلا أنه يحوي الكثير من الرمادي.

الظلال | Shades

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

أمثلة

jonathanmoore

يحوي هذا التصميم على تنوع من ظلال الأرجواني بالإضافة لدرجتين منه.

vuumedia

استخدام ظلال مختلفة يبدو جيدًا طالما هناك تباين مرضي بينهم.

alilot

تشكيلة فعالة من الظلال والدرجات في رأس الموقع.

skipvine

خلفية أخرى تحوي ظلال وتدرجات مع  انحدار لوني في الخلفية ذات الملمس.

stuffandnonsense

جمع الظلال مع تنوع الملمس أعطى مظهر مثير للإهتمام.

مشيج اللون | Tint

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

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

أمثلة

caiocardoso

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

fernandosilanes

الأزرق الباهت هنا أعطى مظهر أنيق وناعم.

duboutdesyeux

الأزرق الباهت شائع الاستخدام في تصوير السماء وزخارف الطبيعة.

smallwhitebear

الألوان الباهتة شائعة الاستخدام كذلك في التصاميم المعتمدة على نمط الألوان المائية.

iamgarth

استخدمت الألوان الباهتة هنا بانحدار لوني أنيق.

إلى هنا ينتهي هذا الجزء.. انتظرونا في أجزاء قادمة بإذن الله.


  1. Eyad
    22 مايو 2012 - 6:05 م

    شكراً جزيلاً على الجزء الرابع من المقال

  2. taki
    25 مايو 2012 - 11:52 ص

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

  3. غزی
    8 نوفمبر 2015 - 1:47 م

    مرحبا ممکن کیفیه تغییرpsd الی html ???