طراح تجربه کاربری. علاقهمند به طراحی محصول دیجیتال
تئوری رنگها و نحوه استفاده از آن
تا حالا به این فکر کردید که اگه دنیا رو سیاه و سفید میدیدیم زندگیمون چطور میشد؟ اگه رنگها نبودن چه اتفاق میفتاد؟ رنگ نقش حیاتی در زندگی ما داره؛ میتونه چشم ها رو به یک چیز خیره کنه، حالت یا احساس خاصی رو تحریک کنه و میتونه یادآور خاطرات یا حاوی پیام مهمی باشه. با رنگها میتونیم بدون استفاده از کلمات، درباره موضوعات مختلف صحبت کنیم.رنگها تقریبا در همه حوزهها کاربرد دارن. این روزها، این دانش در معماری، تبلیغات، صنعت مد و لباس و طراحی محصول اهمیت بیشتری پیدا کرده. رنگها در فرهنگهای مختلف، پیامهای متفاوتی دارند؛ بعنوان مثال، رنگ سفید در هندوستان و کشورهای آسیای شرقی معمولا یادآور دنیای پسین است و در مواقع عزاداری ازش استفاده میشه اما همین رنگ، در اروپا و ایران نماد پاکی و نجابت است. رنگ قرمز در چین تداعی کننده قدرته و در غنا نماد عزا؛ بههمین دلیل در چین، موقع ازدواج، و در غنا موقع سوگواری لباس قرمز رنگ میپوشند. چه طراح باشید، چه نباشید، مبحث رنگها جذابیت خاص خودش رو داره.
تئوری رنگ
از فرهنگها که بگذریم، هر رنگ، پیام منحصر به فرد خودش رو داره؛ بعنوان مثال، رنگ قرمز نشاندهنده قدرت و تحرک، رنگ نارنجی نماد دوستی، شادی و سرزندگی، رنگ سبز نماد طبیعت و سلامتی، بنفش نماد جوانی و وفاداری، آبی نماد امنیت و اطمینان و مشکی نماد اصالت و رسمیت هستند. علم تئوری رنگها یعنی اینکه چه رنگی رو کجا و با چه مقدار و غلظتی بهکار ببریم. با تئوری رنگها میتونیم کاری کنیم که یک جسم، در کنار جسم هماندازهاش بزرگتر به نظر برسه، پیام “خطر” رو انتقال بدیم یا احساس “اطمینان” ایجاد کنیم. با تئوری رنگها، میتونیم کاری کنیم که در شکل زیر رنگ مربع کوچک وسط مربع زرد، متفاوت از مربع کوچک وسط مربع آبی بهنظر برسه، در حالی که همرنگ هستند و یک کد رنگی دارند.میتونید با نرم افزارهای گرافیکی تست کنید.حتی میتونیم یه جسم رو بزرگتر از اون چیزی که هست نشون بدیم یا یک رنگ رو درخشنده تر یا کدرتر کنیم.برای مثال رنگ قرمز روی بکگراند سیاه درخشندهتر و شفافتر به نظر میرسه. از اینجور مثالها توی کتاب هنر رنگ ایتن هست.
بهصورت کلی، سه دسته رنگ وجود داره:
۱) رنگهای اصلی، شامل قرمز، زرد و آبی، ۲) رنگهای ثانویه، مثل بنفش، نارنجی و سبز که از ترکیب رنگهای اصلی به وجود میان ۳) رنگهای دسته سوم، که از ترکیب رنگهای اصلی و ثانویه بهدست میان. این رنگها رو میتونید توی شکل زیر ببینید. وقتی همه این دستههای رنگی کنار هم قرار میگیرند، چرخه رنگ رو تشکیل میدن
مولفههای رنگ
هر رنگ، دارای سه مولفه اصلی است. خود رنگ یا Hue، غلظت یا Saturation و روشنایی یا Brightness. مولفه Hue، در واقع خود رنگی هست که انتخاب میکنیم؛ مثل قرمز، زرد یا آبی.
مولفه Saturation همان میزان موجودیت رنگ است. غلظت رنگ مانند زمانی است که یک قلمو را در رنگ فرو ببرید و اونو روی سطح بکشید.طبیعیه که هرچه مقدار فشار به قلمو بیشتر باشه مقدار رنگ بیشتری هم به سطح منتقل میشه.هرچه مقدار غلظت رنگ کمتر باشه رنگ به سمت بیرنگی یا رنگ خاکستری کشیده میشه.
مولفه Brightness، میزان روشنایی یا تیرگی رنگ رو نشون میده.مقدار نزدیکی رنگ به رنگ سفید یا سیاه مقدار روشنایی اون رو مشخص میکنه.برای مثال توسط کم و زیاد کردن روشنایی رنگ قرمز ما میتونیم رنگ صورتی یا قهوهای رو بدست بیاریم.
همنشینی رنگها
حالا که با چرخه رنگها و مولفههای رنگی آشنا شدیم، دیگه وقتشه که بریم سراغ همنشینی رنگها. برای این کار باید از چرخه رنگها کمک بگیریم. برای همنشینی رنگها بهصورت عمده، شش روش یا فرمول وجود داره که در ادامه اونها رو توضیح میدم.
۱: تک رنگ یا Monochromic
در این روش، یکی از رنگهای چرخه رنگ رو انتخاب میکنیم و بر اساس مولفههای رنگی (غلظت و روشنایی) باقی مشتقات رنگ رو بهدست میاریم. مزیت این روش اینه که رنگهای انتخابی بیشترین شباهت و نزدیکی رو با هم دارند و اگه کنار هم قرار بگیرند چشم رو اذیت نمیکنند. از این روش برای انتخاب رنگ یک المان، هاور و فعال یا غیر فعال بودن میشه استفاده کرد.در مثال زیر من رنگ آبی رو انتخاب کردم و تونستم مشتقاتی ازش رو بدست بیارم.
۲: همسایه یا Analogous
رنگهایی که در چرخه رنگها کنار هم قرار میگیرند، همسایه هم هستند. بعنوان مثال، رنگهای قرمز، آتشی و نارنجی همسایه هم هستند. با این روش میتونیم ترکیبهای رنگی گرم یا سرد رو بهوجود بیاریم.
۳: مکمل یا Complementary
رنگهای مکمل به رنگهایی گفته میشه که در چرخه رنگ، با زاویه ۱۸۰ درجه، روبروی هم قرار دارند. در استفاده از این روش باید خیلی دقت کنیم. رنگهای مکمل وقتی کنار هم قرار میگیرند،چشم رو میزنند و اذیت میکنند. مثل رنگ قرمز و سبز، و آبی فیروزهای و نارنجی که به ترتیب در لوگوی خندوانه و همراه اول به کار برده شده. اگه میخواید از رنگهای مکمل استفاده کنید، بهتره که مولفههای رنگیشون (غلظت و روشنایی) رو تغییر بدید. با این کار، میزان اذیت کردن چشم کم میشه؛ بعنوان مثال، ترکیب قرمز روشن و سبز تیره، کمتر چشم رو اذیت میکنه. علاوه بر این، میتونید از روش بعدی هم برای بهتر شرکت ترکیب رنگهای مکمل استفاده کنید.
۴: اطراف مکمل یا Split Complementary
در این روش، برای انتخاب رنگ دوم یا سوم، رنگهای همسایه مکمل رنگ اول رو انتخاب میکنیم؛ به همین خاطر، به این روش، اطراف مکمل گفته میشه. این روش، نسبت به روش مکمل، سطح بهتری از کنتراست رو بهوجود میاره و میتونیم بهجای دو رنگ (رنگهای مکمل) سه رنگ رو داشته باشیم.
۵: سهگانه یا Triad
در روش سهگانه، سه رنگ از چرخه رنگها با فاصله یکسان (گوشههای مثلث متساویالاضلاع) انتخاب میشن. اگه میخواید ترکیبات رنگی دلنشین رو داشته باشید، از این روش استفاده کنید. دلیلش اینه که رنگهایی که با این روش انتخاب میشن، از لحاظ Hue کاملا از هم دور هستند.
۶: چهار گوشه یا Tetradic
در روش آخر، یک چهار ضلعی رو باید روی چرخه رنگ تشکیل بدیم و رنگهایی که در هر گوشه قرار میگیرند انتخاب کنیم. این روش چالشهای خاصی داره و نمیشه یک چهار ضلعی ثابت برای همه ترکیبهای رنگی چهارتایی بهدست آورد. باید با آزمون و خطا، ترکیبهای رنگی که مناسب هستند رو بهدست بیاریم.
جمعبندی
همهی فرمولا و روشهای بالا رو توی سایتهای زیر میتونید استفاده کنید و پالت رنگی خودتون رو بسازید:
https://www.sessions.edu/color-calculator/
انتخاب رنگهای چشمنواز احتیاج به تمرین داره. در اینجا چند نکته رو میگیم که کمک میکنه رنگها و ترکیبهای رنگی خوبی رو درست کنیم:
• ترکیب رنگ سهگانه، بهترین روش برای انتخاب رنگهایی هست که بهخوبی کنار هم قرار میگیرند.
• اول با یک رنگ شروع کنیم و با تغییر Satuarion و Brightness بهبودش بدیم.
• یادمون باشه که همیشه اولین رنگ، بهترین رنگ نیست.
• کنتراست رنگها رو رعایت کنیم.اگر میخواین راجب کنتراست بیشتر بدونید مقاله منو راجب کنتراست بخونید. مقدار کنتراست رنگها رو میتویند از این وبسایت بهدست بیارید.
• بعد از انتخاب رنگ، اون رو در نمایشگرهای مختلف چک کنیم.
• برای بهتر دیده شدن رنگها استانداردهای فضای خالی(White Space) رو در نظر بگیریم.
• رنگها رو به اطرافیامون نشون بدیم و نظر و حسشون رو بدونیم.
• معانی و پیام رنگها رو در فرهنگهای مختلف مد نظر داشته باشیم.
• طراحی مینیمال داشته باشیم؛ توصیه میشه که در طراحی، از بیشتر از ۴ رنگ استفاده نکنیم.
• از رنگها بعنوان وزن برای جلب توجه استفاده کنیم. توصیه میشه که در پسزمینه طراحی از یک رنگ خنثی مثل سفید، خاکستری یا سیاه استفاده کنیم تا رنگهای دیگه تاثیر خودشون رو بتونند نشون بدن.
• برای شروع، از شرکتهای موفق استفاده کنیم و از نمونههای رنگی اونها الهام بگیریم.
• ترند(مد) روز رو در نظر بگیریم. این روزها رنگهای فلت (Flat) و گرادینت (Gradient) بیشتر به کار برده میشن.
مطلبی دیگر از این انتشارات
چگونه پرسونا مناسب بسازیم
مطلبی دیگر از این انتشارات
مشتریان تپسی، یه ماشین پرنده میخواستن!!
مطلبی دیگر از این انتشارات
آموزش طراحی رابط کاربری نئومرفیسم ( Neumorphism )