آشنایی با مفهوم کنتراست و انواع آن6 دقیقه

کنتراست چیست

مقدمه

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

پیشنهاد

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

کنتراست نقش مهمی در سازماندهی اطلاعات در یک صفحه داره و مثل یک راهنما عمل می‌کنه؛ یعنی به مخاطب نشون می‌ده که اول به کجا نگاه کنه و مهم‌ترین و برجسته‌ترین نکته یک طرح چیه. برای تاثیرگذاری بیش‌تر، این اختلافات باید کاملاً آشکار و واضح باشند.

استفاده از تضاد تنها در طراحی گرافیک کاربرد نداره و در موارد دیگه هم از جمله طراحی رابط کاربری (UI) و  بازاریابی و تبلیغات هم کاربرد زیادی داره.

در ادامه با انواع کنتراست آشنا می‌شیم:

انواع کنتراست

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

کنتراست اندازه

به تصویر زیر نگاه کنید:

کنتراست اندازه

اول کدوم عنصر توجه شما رو به خودش جلب کرد؟ عنصر کوچکتر یا بزرگتر؟

هنگامی که یک طرح رو میبینیم به صورت ناخودآگاه اول میریم سراغ عناصر بزرگتر و با خودمون میگیم: “بزرگتر یعنی مهمتر”.

کنتراست اندازه

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

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

تضاد اندازه

کنتراست شکل

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

کنتراست شکل

به عنوان مثال، اگه شما طرحی دارید که همه عناصر از مستطیل تشکیل شده‌اند‌، اما درست در وسط طرح یک دایره وجود داشته باشه، توجه بیننده مستقیماً به دایره جلب میشه؛ چون با بقیه عناصر متفاوته. به شکل زیر با دقت نگاه کنید:

کنتراست اشکال

حالا شما بگید؛ در تصویر بالا اول کدوم شکل رو دیدید؟

کنتراست رنگ

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

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

وقتی در کنار رنگ‌های سرد از رنگ‌های گرم استفاده میشه، ما به صورت ناخودآگاه به رنگ‌های گرم توجه بیشتری نشون میدیم. به همین دلیلِ که در اکثر وبسایت‌ها از رنگ‌های گرم برای دکمه‌های CTA (دعوت به عمل) استفاده می‌کنند.

کنتراست رنگ‌ها به 6 دسته تقسیم میشه. برای درک مفهوم انواع کنتراست باید با مفهوم چرخ رنگ آشنا باشیم.

پیشنهاد

برای آشنایی با چرخ رنگ مقاله راهنمای ترکیب رنگ رو بخونید.

انواع کنتراست رنگ

1- تضاد رنگ خالص

ساده‌ترین نوع تضاد رنگیه که از کنار هم قرار گرفتن رنگ‌های اصلی ایجاد میشه و درجه کنتراست بسیار بالایی هم داره. استفاده از این تضاد باعث ایجاد حس تحکیم‌سازی و عزم اراده قوی میشه.

کنتراست رنگ خالص

2- تضاد همزمانی

هر رنگی که می‌بینیم، همواره تحت تاثیر رنگ هاییه که اطراف اون رنگ رو احاطه کرده. به تصویر زیر توجه کنید:

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

تضاد همزمانی

3- تضاد تیره و روشن

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

کنتراست تیره و روشن

4- تضاد مکمل

این نوع کنتراست همونطور هم که از اسمش پیداست از دو رنگ مکمل (دو رنگ روبه رو در چرخه رنگی) ایجاد میشه. درجه کنتراست نسبتا بالایی داره.

تضاد رنگ مکمل

5- تضاد کمیت

تضاد کمیت از دو یا چند رنگ با وسعت و درجه کنتراست متفاوت ایجاد میشه و بین شدت رنگ و فضایی که اشغال میکنه نسبت معکوس وجود داره.

نکته مهم: رنگ های اصلی و فرعی از نظر ارزش و قدرت رنگی یک ضریب نسبی برای خودشون دارند که ما باید متناسب با این ضرایب میزان فضای اشغال کننده رو تعیین کنیم.

تضاد کنتراست کمیت

مثلا اگر بخوایم برای رنگ زرد و بنفش یک تضاد کمیتی ایجاد کنیم، با توجه به ضرایب هر دو رنگ بنفش(3) و زرد(9)، نسبت محیط بنفش به محیط زرد باید یک سوم باشه.

تضاد کمیت

6- تضاد کیفیت

تضاد کیفیت از کنار هم قرار گرفتن دو رنگ اشباع و غیراشباع ایجاد میشه.

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

تضاد کیفیت

کنتراست نوشته

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

کنتراست نوشته

جمع بندی

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

مقالات تیم UxNet به صورت تخصصی تهیه و منتشر شده است. انتشار مطلب تنها با ذکر منبع (UXNet) بلامانع است.

چقدر این مطلب برات مفید بود؟
5/5 (6)
از این مقاله خوشت اومد؟ برای دوستات بفرست:

Uxnetمشاهده نوشته ها

با یوایکس نت هم اطلاعاتت رو بالا ببر و هم کسب و کارت رو ارتقا بده

اشتراک
اطلاع از
guest
0 نظرات
Inline Feedbacks
نمایش همه نظرات




    × از من بپرس...