طراحی - داستان رنگ: بخش اول - چگونه رنگ مناسب پیدا کنیم؟ و یکم بیشتر

یکی از مهم‌ترین نکات برای طراحی اینه که چطوری رنگ یا رنگ‌های مناسبی برای کارمون انتخاب کنیم که اون رنگ‌ها به‌قول معروف به هم بیان و هارمونی خوبی داشته باشن. برای این کار، یا می‌شه رفت تئوری‌های شناخت رنگ و روش‌‌ها و مدل‌های انتخاب رنگ‌ها رو خوند یا اینکه از سایت‌هایی که برای همین منظور ساخته شدن و پَلِت‌های رنگی (Color Palettes) پیشنهاد می‌کنن استفاده کنیم.

تو این سری پست‌ها می‌خوام بعد یکم صحبت راجع‌به رنگ و معرفی لینک‌ها کاربردی برای شناخت خود داستان رنگ‌ها بیام چندتا از همین سایت‌ها که بهش اشاره شد رو معرفی کنم و نظر خودمو راجبشون بنویسم. ترتیب معرفی سایت‌ها هم از اونایی که بیشتر استفاده می‌کنم شروع میشه تا اوناییکه فقط جنبه معرفی دارن!

سعی می‌کنم مطالبی که می‌نویسم، همش رو منبع یا لینکی برای مطالعه بیشتر بذارم پس شما هم به مطالب این پست‌ها اکتفا نکنین و یه سری به لینک‌ها بزنین.

فقط اینم بگم که هر نظر یا انتقادی به نحوه نوشتن و مطالبی که بیان می‌کنم بود حتمن بهم بگین، ممنون.

بخش اول: داستان رنگ‌ها

داستان زندگی رنگ‌ها ارتباط خیلی نزدیکی به زبان آدم‌ها داره. زبان‌های توسعه یافته کلمات زیادی برای رنگ‌ها دارن اما زبان‌هایی هم پیدا می‌شن که کلمات کمتری برای رنگ‌ها داشته باشن. مثلا یکی از این زبان‌ها زبان Wobe هست که کلا ۳ تا کلمه برای رنگ داره؛ تیره، روشن و قرمز! یا مثلا توی کتاب ادیسه هومر خیلی واژگان محدودی برای رنگ‌ها بکار رفته و مثلا رنگی که برای خون، امواج دریا و شراب بکار رفته همگی یکی و یه چیزی تو مایه‌های بنفش بوده. حالا اینکه بررسی علمی این داستان چیه و چرا جای خود داره ولی نکته‌ای که باید بهش توجه بشه اینه که رنگ خیلی چیز قرار دادی می‌تونه باشه و اون چیزی که ما می‌بینیم ممکنه با چیزی که فرد دیگه‌ای میبینه متفاوت باشه مثل همون استریوتایپ معرف که اقایون نسبت به خانم‌ها رنگ‌های کمتری رو تشخیص می‌دن. [۱]

روش‌های متنوعی برای انتخاب رنگ‌ها وجود داره که به چندتاش اشاره می‌کنم. اما قبل از اون برای پرداختن به این روش‌ها نیاز به آشنایی با چیزی به نام Color Wheel داریم. این چرخه از رنگ‌های اصلی (قرمز، آبی و زرد) شروع میشه و با ترکیب کردن اون‌ها کامل میشه تا جاییکه یک طیف پیوسته از رنگ‌ها داریم. حالا روی این چرخه رنگی میان یه سری رنگ‌ها رو گروه‌بندی می‌کنن.

- رنگ‌های اصلی (Primary Colors): که همون سه رنگ قرمز، آبی و زرد هستند.

- رنگ‌های ثانویه (Secondary Colors): رنگ‌هایی که از ترکیب سه رنگ اصلی به‌دست میان. نارنجی (ترکیب قرمز و زرد)، سبز (ترکیب آبی و زرد) و بنفش (ترکیب آبی و قرمز).

- رنگ‌های ثالث یا میانه (Tertiary Colors): که از ترکیب رنگ‌های ثانویه به‌دست میان.

حالا بعد آشنایی با چرخه رنگی بریم سراغ یه نکته دیگه، اساسا رنگ مانند هر چیز دیگری با یک سری پارامترها شناخته میشه. مهم‌ترین این پارامتر‌ها عبارتند از:

- فام (Hue): که همون رنگ هست (اینکه مثلا آبی هست یا قرمز)

- غلظت (Saturation): درجه خلوص اون رنگ

- روشنایی (Brightness): میزان روشنایی رنگ

مطالعه بیشتر [۲]

بخش دوم: روش‌های انتخاب رنگ‌ها

۱- روش تک رنگ (Monochromatic color)

در این روش از یک رنگ با غلظت‌ها و روشنایی‌های متفاوت استفاده می‌کنند. مثلا گرادیانی رو تصور کنین از سفید تا رنگی که مشخص کردین.

۲- روش آنالوگ (Analogous colors)

در این روش از رنگ‌های که در چرخه رنگی در کنار هم قرار دارند استفاده می‌کنند. مثلا آبی‌ها و سبزها یا قرمزها و نارنجی‌ها.

۳- رنگ‌های مکمل (Complementary colors)

این روش یکی از روش‌های پرطرفدار و معروف است. در این روش از رنگ‌های که در چرخه رنگ روبروی هم قرار دارند استفاده می‌کنند. مثل ترکیب‌های معروف آبی و نارنجی یا قرمز و سبز.

۴- رنگ‌های مکمل جدا از هم (Split Complementary colors)

این روش مانند روش قبل است با این تفاوت که از یک رنگ با رنگ‌های اطراف رنگ روبروی آن استفاده می‌کنند. این روش رنگ‌های بیشتری رو برای طراحی در اختیارمون می‌ذاره.

۵- روش مثلثی (Triadic)

در این روش از سه رنگ که فاصله یکسانی در چرخه رنگی دارند استفاده می‌کنند.

۶- روش مستطیلی (Tetradic)

در این روش از ۴ رنگ که دوبه‌دو مکمل هستند استفاده می‌شود. این روش برای طراحی‌هایی مناسب است که یک رنگ به عنوان رنگ اصلی و رنگ‌های دیگر به عنوان رنگ‌هایی برای تاکید (Accent) در اطراف اون مورد استفاده قرار می‌گیرند.

مطالعه بیشتر [۳]

بخش سوم: سیستم‌های رنگی

به‌طور کلی دو سیستم رنگی برای رنگ‌ها وجود داره، رنگ‌های کاهشی (Subtractive Colors) یا رنگ‌های افزایشی (Additive Colors). رنگ‌های افزایشی رنگ‌هایی هستند که از طریق صفحه‌های دیجیتال مثل تلویزیون، مانیتور، صفحه گوشی و یا پروژکتورها نشون داده می‌شن و ماهیتشون اینه که خود نور هست که به چشم ما وارد میشه و رنگ رو در چشم ما می‌سازه. این رنگ‌ها سه رنگ اصلی RGB (به ترتیب سه رنگ قرمز، آبی و سبز) هستند. نکته قابل توجه برای این نام‌گذاری این هست که رنگ‌های افزایشی با سه رنگ RGB شروع شده و با افزودن رنگ بیشتر به سمت رنگ سفید می‌روند. مانند پیکسل‌های تشکیل دهنده تمام صفحات دیجیتال که اگه با ذره‌بین یا حتی با چشم از نزدیک دیده باشین از این سه رنگ تشکیل شده‌اند و روشن بودن هر سه رنگ، رنگ سفید و خاموش بودن هر سه، رنگ سیاه رو می‌سازه و باقی رنگ‌ها با ترکیب این سه رنگ تولید می‌شن.

رنگ‌های کاهشی اما رنگ‌هایی هستند که در چاپ استفاده می‌شن. این رنگ‌ها از ۴ رنگ اصلی CMYK (به ترتیب سیان (Cyan)، مَجِنتا (Magenta)، زرد و سیاه) هستند. در چاپ اینجوری هست که رنگ پرینت شده توسط جوهرها روی کاغذ رو می‌بینیم و در حقیقت اون چیزی که رنگ رو تو چشم ما می‌سازه بازتاب نور حاصل از برخورد با جسم و رسیدن امواج جذب نشده از اون به چشم ما هست. پس چیزی که می‌بینیم خود امواج نور نیست (تصویر زیر). نام گذاری این رنگ‌ها هم به این دلیل هست که ترکیب همه این رنگ‌ها رنگ سیاه رو تولید می‌کنه و نبود هیچ یک، رنگ سفید (با فرض سفید بودن کاغذ :)). اگه به پرینتر‌ها دقت کرده باشین این ۴ رنگ اصلی جوهرها رو حتمن دیدین.

در چاپ نیز مانند پیکسل‌های نمایشگر‌ها که بهشون اشاره شد تصاویر چاپ شده از یک سری نقاط (Spot) تشکیل شدند که می‌تونید توی تصویر زیر مشاهدشون کنین. به این فرآیند چاپ تصویر که بر اساس یک سری نقاط رنگی تصویر تشکیل می‌شه half-toning میگن.

پس اگه طراحی قراره مثلا روی محیط وب کار بشه و با صفحات دیجیتالی دیده بشه باید مود رنگی اون RGB باشه ولی اگه قراره چاپ بشه باید مود رنگی اون CMYK‌ باشه. البته اوضاع به همین سادگی نیست. مشخصا همه رنگ‌هایی که تو سیستم رنگی RGB وجود داره توی CMYK وجود نداره. احتمالا زمان طراحی و انتخاب رنگ توی نرم افزارهای ادوبی شده که بعد انتخاب یک رنگی، در گوشه طیف رنگی، رنگ انتخاب شده رو توی یه مربع کوچیک که نشون میده، یه مثلث اخطار هم بغلش براتون ظاهر شده. این مثلث اشاره به همین موضوع داره و میگه که این رنگ رو اگه بخواین چاپ کنین اینیکه دارین می‌بینین نمیشه و اصطلاحا WISIWYG (یعنی What you see is what you get) نیست. برای اینکه رنگی که موقع چاپ به‌دست میاد رو ببینین دو بار روی اون مثلث کلیک کنین. البته برای این مشکل یه سری راه‌حل‌هایی ارائه شده که مثلا برای رفع اون میشه از رنگ‌های کمپانی پنتون استفاده کرد که تضمین می‌کنه رنگی که مشاهده می‌کنین بعد چاپ هم همین رنگ خواهد بود.

در ادامه جا داره یه این هم اشاره کنم که سیستم‌های دیگری هم برای رنگ‌ها به غیر از RGB و CMYK وجود داره که یکی از پرکاربردترین اون‌ها HSB یا (Hue, Saturation, Brightness) هست.

لیست منابع و لینک‌ها:

[۱] The surprising pattern behind color names around the world (+)

[۲] Color Basics (+)

[۳] Color Theory (+), (+)

[۴] What is CMYK Color? (+)

[۵] What’s the difference between RGB, CMYK and Spot (PMS) colors? (+)

[۶] Designing for Print: RGB vs CMYK (+)

و Some useful infographics (+), (+), and (+)