كيفية إنشاء لوحة الألوان الجميلة

الصورة

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

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

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


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


من اليسار إلى اليمين: Super Mario Run ، Monument Valley ، Alto's Odyssey ، Lara Croft Go

عندما نفكر في مجموعات من الألوان ، يجب أن نفكر في تفاعلها: هل يجب أن يبرز بعضها أو يختلط مع بعضها البعض؟ وهذا ما يسمى النقيض.

غالبًا ما تأتي عملية اختيار الألوان الجميلة لاختيار التناقضات المناسبة لتصميمك.

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

السطوع (الضوء / الظلام)

السطوع هو نوع من التباين يسهل تصوره. على محدد لون HSB ، يتوافق هذا مع الحركة على المحور الرأسي:


السطوع

في الحالة العامة ، يمكننا ببساطة زيادة التباين بين اللونين ، ببساطة عن طريق زيادة الفرق في سطوعها.


تباين السطوع

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

النقيض نغمي

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


تباين الظل


التشبع (المحور الأفقي لـ HSB) والتباين التشبع

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


ظلال مختلفة والتباين الفقراء


تشبع مختلفة والتباين الفقراء

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

تدرج الرمادي هاك

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


قيم الدرجة اللونية الداخلية للظلال المختلفة

دعونا نرى كيف تبدو هذه القيم اللونية في محدد لون HSB. لاحظ أيضًا كيف تتغير التغييرات في قيم الدرجة اللونية في الطيف لكل تدرج اللون (كما هو موضح في العمود أقصى اليمين):


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


تباين التشبع: التباين العالي أعلاه ، التباين السيئ أدناه.


تباين الظل: التباين العالي أعلاه ، التباين السيئ أدناه.

دعنا نلقي نظرة أخرى على الألعاب الموضحة أعلاه ، ولكن الآن بتدرج الرمادي.


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

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

التناقضات الجميلة تؤدي إلى إنشاء لوحات ملونة جميلة ، لذلك أقدم لك ...

صيغة لاختيار لوحات الألوان الجميلة


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

1: تحديد حيث نحتاج التباين

قم بإنشاء إطار التصميم الخاص بك ، ثم حدد أي مناطق الإطار تحتاج إلى مزيد من التباين وأيها أقل.

2: تلوين التصميم في ظلال رمادية

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

3: اختيار الألوان الأساسية

اختر الظلال الأساسية للألوان التي تريد العمل معها. هذه خطوة ذاتية ، ويمكنك استخدام أدوات مثل ShapeFactory's Pigment أو Adobe Color CC لتحديدها. حقيقة ممتعة: بعض مجموعات الألوان تحظى بشعبية كبيرة لدرجة أنها حصلت على حالة الممر .

4: اضبط الألوان ليكون لها قيم لونية مناسبة

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

مثال 1


(1) الإطار و (2) التباين الرمادي المفضل


(3) الألوان الأساسية المحددة

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


نطاقات الدرجة اللونية المقابلة للألوان الأساسية

الآن يمكننا تحديد مجموعات الألوان من أي جزء من هذه المناطق:


(4) عدة خيارات لوحة الألوان

مثال 2

إليك شكل هذه العملية عند تطوير تطبيق Overlink:


العملية من اليسار إلى اليمين ، من الأعلى إلى الأسفل: الإطار السلكي ، التدرج الرمادي ، الألوان الأساسية ، التصميم النهائي

مبروك! آمل أن يساعدك ذلك في اختيار مجموعات من الألوان التي تتباين حيث تريدها ، وتمزج بين ما لا تحتاج إليها ، وتبدو جميلة بشكل عام.

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

الصورة

Source: https://habr.com/ru/post/ar441278/


All Articles