یک راهنمای سریع برای انتخاب پالت رنگی
آموزشتلگرامتوئیتر

یک راهنمای سریع برای انتخاب پالت رنگی

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

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

  1. Hue یا رنگ - به معنای همان رنگ خالص است مثل قرمز یا آبی.
  2. Chroma یا کروم - به معنای خلوص رنگ است، به عنوان مثال رنگ خاکستری که یه رنگ خنثی است مقدار کروم رنگ آن بسیار پایین است.
  3. Saturation یا اشباع - به معنی قدرت یا ضعف یک رنگ است.
  4. Value به معنی میزان تاریکی یا روشنی رنگ است، به عنوان مثال رنگ سفید High Value و رنگ سیاه ‌Low Value است.
  5. Tone یا تن به معنی رنگ ایجاد شده از ترکیب رنگ خالص با رنگ خاکستری است.
  6. Shade یا سایه به معنی رنگ ایجاد شده از ترکیب رنگ خالص با رنگ سیاه است.
  7. Tint یا ته رنگ به معنی رنگ ایجاد شده از ترکیب رنگ خالص با رنگ سفید است.

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

چهار نوع پالت رنگی اصلی

شما می‌توانید با استفاده از ۱۲ رنگ موجود در چرخ رنگ پالت‌های رنگی مختلفی بسازید که در اینجا ما چهار نوع اصلی آن‌ها را معرفی می‌کنیم:

پالت رنگی تک رنگ یا ‌Monochromatic ترکیبی از رنگ خالص و ‌Tone, Shade و Tint همان رنگ است. به عنوان مثال طیفی از رنگ قرمز همراه با ترکیب‌های آن رنگ با خاکستری، سیاه و سفید. این نوع انتخاب طرح رنگ، محافظه کارانه است، استفاده از این نوع پالت‌ها برای کسانی که اطلاعات زیادی درباره‌ی رنگ‌ها ندارند نیز خوب است ولی دقت کنید که استفاده نادرست از این پالت‌ها می‌تواند طراحی شما را زشت و خسته کننده نشان دهد زیرا در این حالت، شما تنها از یک رنگ استفاده می‌کنید و اگر این کار به درستی انجام نشود چشم بیننده را خسته می‌کند.

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

پالت رنگی رنگ‌های مکمل یا ‌Complementary تشکیل شده از رنگ‌هایی هستند که در چرخ رنگ روبروی هم قرار دارند، مانند قرمز-سبز یا آبی-نارنجی. از این پالت‌ها برای برقراری تعادل در طراحی می‌توان استفاده کرد. شما می‌توانید مانند پالت Analogous با استفاده از Tint یا Shade آن رنگ‌ها پالت رنگی خود را افزایش دهید، این کار برای ملایم کردن کنتراست در این نوع پالت کمک بزرگی می‌کند.

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

این‌ها چهار نوع پالت رنگی هستند که بیشترین کاربرد را در طراحی دارند، برای اینکه بتوانید بهتر رنگ‌ها را برای طرح یا پروژه‌ای که روی آن کار می‌کنید انتخاب کنید بهتر است این نکته را بدانید که هر رنگ می‌تواند چه حسی در مخاطب شما ایجاد کند یا به طور کلی تر هر رنگ چه معنایی دارد.

معانی رنگ‌ها

  1. قرمز: انرژی، قدرت، شور و اشتیاق شدید
  2. نارنجی: شادی، شور و شوق، لذت، خلاقیت
  3. زرد: شادی، تفکر و هوش، انرژی
  4. سبز: جاه طلبی، رشد، طراوت، ایمنی
  5. آبی: آرامش، اعتماد به نفس، هوش و ذکاوت
  6. بنفش: لوکس، جاه طلبی، خلاقیت
  7. سیاه: قدرت، ظرافت و زیبایی، رمز آلود
  8. سفید: پاکیزگی، خلوص، کمال

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

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

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

روش بعدی که شما می‌توانید از آن استفاده کنید به قانون ۶۰-۳۰-۱۰‌ معروف است: یک روش قدیمی در طراحی داخلی. استفاده از این روش بسیار کاربردی است به طوری که چشم مخاطب را به سمت موضوعی که می‌خواهید به آن بپردازید به آرامی هدایت می‌کند و استفاده از آن بسیار راحت است، به این صورت که ۶۰٪‌ از طراحی را رنگ غالب شما می‌پوشاند، ۳۰٪ رنگ مکمل ثانویه است و ۱۰٪ باقی مانده می‌تواند یک رنگ دیگر باشد که اصطلاحا به آن رنگ لهجه یا accent color می‌گویند.

یکی از بهترین راه‌هایی که می‌توانید از آن برای درست کردن پالت رنگی استفاده کنید، استفاده از ترکیب رنگ‌ها در طبیعت است. به عنوان مثال از ترکیب رنگ‌های یک منظره‌‌ی غروب خورشید استفاده کنید. شما می‌توانید با استفاده از نرم‌افزار Adobe Capture کد‌های رنگی که در عکس‌ها هستند را مشخص کنید و یک پالت رنگی درست کنید.

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

http://blog.imograph.com/blogDes.php?id=3

منبع:

www.invisionapp.com

سینا کشاورز
نویسنده:سینا کشاورزطراح و گرافیست ایموگراف

نظرات کاربران

نام:
ایمیل:
متن نظر:
  • تفاوت RGB و CMYK
    آموزشتفاوت RGB و CMYK

    اگر شما به تازگی وارد خانواده بزرگ گرافیست‌ها شدید، این مطلب کمک زیادی به هرچه بیشتر آشنا شدن شما با این فضا می‌کند.

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

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

    از آنجا که در نرم‌افزارهای پرکاربردی مانند فتوشاپ و ایلسترتور بیشتر از دو حالت CMYK و RGB استفاده می‌شود، در اینجا به بررسی این دو حالت پرداخته‌ایم.
     تفاوت RGB و CMYK

    CMYK

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

    این حالت که CMYK نام دارد، شامل رنگ‌هایC=cyan آبی ،M=magenta قرمز ، Y=yellow زرد و K=black سیاه است.

    شاید جالب باشد بدانید که Black یا همان رنگ سیاه در اینجا از ترکیب c,m,y به دست می‌آید و به این دلیل با K نشان داده می‌شود که با B=blue در RGB اشتباه گرفته نشود.
     تفاوت RGB و CMYK

    RGB

    RGB که مخففR=Red قرمز، G=Green سبزو B=Blue آبی است و برای سنجش و نمایش تصاویر در سیستم‌های الکترونیکی مانند تلویزیون و کامپیوتر و دوربین‌های عکاسی استفاده می‌شود.
     تفاوت RGB و CMYK

    از آنجا که CMYK دارای محدوده رنگی بیشتری نسبت به RGB است، شما می‌توانید در هنگام تبدیل RGB به CMYK به وضوح از دست دادن رنگ‌ها را مشاهده کنید.

    البته قرمز، سبز و آبی موجود در RGB نیز می‌توانند در ابعاد مختلف ترکیب شوند تا هر رنگی را در میلیون‌ها طیف به دست آورند. شدت سطوح R، G و B می‌توانند از 0تا 100 درصد تغییر کنند.

    به این تصاویر که هر چه بیشتر تفاوتCMYK و RGB را نشان می‌دهند با دقت نگاه کنید.
     تفاوت RGB و CMYK

    در واقع تفاوت اصلی این دو حالت رنگ این است که CMYKدر دنیای واقعی و با استفاده از رنگ‌های شیمیایی به دست می‌آید در حالی که RGB در فضای دیجیتالی مانیتورها و انواع LCD,LED و به وسیله پیکسل‌های رنگی به وجود می‌آید. با این توضیح کاملا واضح است که نمی‌توان از CMYK که یک برنامه 32بیتی است، برای طراحی وب استفاده کرد و در مقابل منطقی نیست که ازRGB نیز برای چاپ استفاده شود، زیرا طرح چاپ شده با نسخه دیجیتالی‌اش اختلاف زیادی خواهد داشت.
     تفاوت RGB و CMYK

    برای اینکه تصویری واضح‌تراز اتفاقی که در چاپ می‌افتد داشته باشیم، بایستی مبنا را بر این بگذاریم که رنگ‌های CMYK در چاپ کمی مات‌تر از رنگی که ما در نسخه اصلی خود آماده کرده‌ بودیم، دیده می‌شوند. تصویر زیر مثال خوبی برای درک بهتر این مساله است.
     تفاوت RGB و CMYK

    منبع:


    http://www.creativebloq.com

    http://www.fastprint.co.uk

    24 دیتلگرامتوئیتر
  • چگونه آیکون‌های خطی با رنگ‌های محدود درست کنیم!!!!
    آموزشچگونه آیکون‌های خطی با رنگ‌های محدود درست کنیم!!!!

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

    مرحله‌ی اول

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

    آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی دوم

    در مرحله‌ی دوم با کشیدن یک خط افقی، قسمت بالایی الماس را جدا کنید، سپس با کشیدن دو خط زاویه دار الماس را به سه قسمت تقسیم کنید. آنها را در یک گروه قرار دهید و ضخامت خط ها را به 3pts تغییر دهید.

     آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی سوم

    آیکون بعدی که طراحی می‌کنیم یک چتر است. با استفاده از ابزار Ellipse یک دایره بکشید، سپس با استفاده از ابزار Selection دایره‌ی کوچک کنار شکل را انتخاب کنید و با حرکت دادن آن دایره‌ی اصلی را نصف کنید. بعد از نصف کردن دایره، پنج دایره‌ی کوچک روی ضلع پایینی نیم دایره بکشید. با استفاده از ابزار Shape Builder و نگه داشتن کلید Alt قسمت‌های پایینی شکل را حذف کنید.

     آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی چهارم

    با استفاده از ابزار Pen خط‌های منحنی روی چتر را بکشید، سپس با استفاده از Line Segment یک خط کوچک در بالا و یک خط بلند در پایین چتر برای دسته بکشید.

     آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی پنجم

    برای درست کردن منحنی پایین دسته‌ی چتر با استفاده از ابزار Ellipse یک دایره بکشید. و با استفاده از ابزار Direct Selection نقطه‌ی بالایی دایره را انتخاب کنید و از را حذف کنید. سپس تمام اجزای چتر را در یک گروه قرار دهید.

     آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی ششم

    برای درست کردن آیکون مدرک با کشیدن یک مستطیل شروع می‌کنیم. با استفاده از ابزار Pen یک مثلث کوچک در پایین سمت چپ مستطیل بکشید. برای درست کردن شکل مهر یک دایره‌ی کوچک داخل مستطیل بکشید و با استفاده از افکت Zig zag آن را به شکل یک مهر دربیاورید.(Effect > Distort & Transform > Zig Zag) چند خط افقی به جای نوشته‌ها درست کنید.

     آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی هفتم

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

     آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی هشتم

    یک دایره‌ی کوچکتر بکشید و مانند دایره‌ی قبلی یک برش روی آن ایجاد کنید، برای قسمت بریده شده هم همین کار را انجام دهید. تعدادی دایره‌ی کوچک ایجاد کنید، همه اجزای آیکون پیتزا را در یک گروه قرار دهید و با استفاده از ابزار Shape Builder و نگه داشتن کلید Alt قسمت های بیرون زده را حذف کنید.

     آموزش ایلوستریتور – آیکون خطی

    درست کردن آیکن‌های رنگی

    مرحله‌ی اول

    برای درست کردن آیکون‌های رنگی ابتدا رنگ‌های مورد نظر را انتخاب کنید. حالا نوبت درست کردن آیکون مداد است، ابتدا یک مستطیل بکشید و با استفاده از ابزار Add Anchor Point در وسط ضلع بالایی مستطیل یک Anchor point ایجاد کرده و با ابزار Direct Selection آن را به سمت بالا بکشید تا به شکل نوک تیز در بیاید. حالا با همان ابزار قبلی تو زاویه‌ی پایینی را انتخاب کرده و با کشیدن دایره‌های کوچک ایجاد شده به سمت وسط مستطیل، قسمت پایینی را به شکل منحنی دربیاورید تا شکل ایجاد شده شبیه به مداد شود. حالا چند خط عمودی و افقی روی شکل اصلی مداد برای ایجاد جزئیات بیشتر بکشید.

    شکل اصلی را انتخاب کنید، در قسمت Fill رنگ مورد نظر را قرار دهید وStroke را در حالت بی رنگ بگذارید. دقت کنید که خط‌هایی که برای جزئیات مداد کشیدید از قسمت اصلی بیرون زده باشند و مود آنها را در قسمت Transparency در حال Multiply قرار دهید.

     آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی دوم

    برای درست کردن سطل رنگ ابتدا یک مربع بکشید، سپس دو منحنی در بالا و پایین مربع قرار دهید. با استفاده از ابزار Add Anchor point در وسط ظلع بالایی مربع یک Anchor point ایجاد کنید، حالا با استفاده از Direct selection آن را انتخاب کنید و پاک کنید. منحنی و قسمت پایین مربع را انتخاب کنید و در پنل pathfinder کلید Unite را فشار دهید. حالا یک منحنی کوچکتر درست کنید و در قسمت Fill رنگ را تغییر دهید و قسمت Stroke را در حالت بی رنگ قرار دهید. برای کشیدن دسته‌ی سطل با استفاده از ابزار Pen یک خط گرد بکشید که و با استفاده از دو منحنی کوچکتر برای اتصال دسته به سطل استفاده کنید. یک منحنی پایین تر از دسته با رنگ بدنه ایجاد کنید . همه‌ی اجزا را در یک گروه قرار دهید.

     آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی سوم

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

     آموزش ایلوستریتور – آیکون خطی

    اضافه کردن رنگ به آیکون‌های قبلی

    مرحله‌ی اول

    اگر بخواهیم به چتری که قبلا درست کردیم کمی جزئیات اضافه کنیم، ابر و قطرات باران گزینه‌های خوبی هستند. قطره‌های باران دایره‌هایی هستند که Anchor point بالایی آنها به سمت بالا کشیده شده و ابرها را می توان با استفاده از دایره‌هایی که با استفاده از Unite با هم مخلوط شده‌اند درست کرد. در انتخاب رنگ دقت کنید و آنها را در حالت Multiply قرار دهید.

     آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی دوم

    برای نشان دادن درخشش الماس، یک دایره درست کنید، سپس با استفاده از افکت Zig Zag آن را یه شکل درخشش دربیاورید.

     آموزش ایلوستریتور – آیکون خطی

    مرحله‌ی دوم

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

     آموزش ایلوستریتور – آیکون خطی

    نتیجه‌ی نهایی

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

     آموزش ایلوستریتور – آیکون خطی

    منابع:

    www.tutpad.com

    23 مرداد 97تلگرامتوئیتر
  • موکاپ چیست؟
    آموزشموکاپ چیست؟

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

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

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

    http://blog.imograph.com/blogDes.php?id=39

    27 فروردین 97تلگرامتوئیتر