یکی از مهم ترین عوامل در ایجاد یک طرح منحصر به فرد و قابل تشخیص، رنگ است. انتخاب درست رنگ بندی می تواند موفقیت یا شکست یک وب سایت را تعیین کند. هنگامی که یک بازدیدکننده برای اولین بار به یک صفحه وب نگاه می کند، رنگ هایی که انتخاب می کنید پیامی فوری در مورد آن صفحه برای آنها ارسال می کند. خوشبختانه ابزارهای زیادی وجود دارد که به شما در انتخاب طرح رنگ مناسب کمک می کند. در اینجا پنج مورد از بهترین ها آورده شده است.
1. کولر
Kuler از Adobe مدتهاست که به عنوان بهترین دستیار برای یک طراح وب حرفه ای شناخته شده است. برخلاف رقبا، یک جامعه بزرگ در اینجا وجود دارد و می‌توانید پالت‌های ایجاد شده را به اشتراک بگذارید یا از طرح‌های رنگی دیگران استفاده کنید و آنها را مطابق با نیاز خود تغییر دهید. برای برقراری ارتباط در انجمن، باید ثبت نام کرده و یک Adobe ID دریافت کنید. رنگ ها در Kuler در قالب های مختلفی از جمله RGB، CMYK، LAB و HSV نمایش داده می شوند.
الهام می تواند تحت تأثیر غیرمنتظره ترین موقعیت ایجاد شود. برای مثال ممکن است با یک عکس زیبا با رنگ بندی جذاب مواجه شوید. این مولد پالت رنگ فقط برای پردازش چنین عکس هایی ایجاد شده است. فایل‌ها را با فرمت‌های JPG یا PNG آپلود کنید و یک طرح دقیق از رنگ‌های کلیدی دریافت کنید. مهم نیست که چه واکنشی را در بین بازدیدکنندگان خود برانگیخته اید، یک مولد پالت رنگ می تواند به ایجاد ظاهری منحصر به فرد برای هر وب سایت کمک کند.
رنگ های فردی هرگز در خلاء آویزان نمی شوند و هر سایه بر محیط اطراف خود تأثیر می گذارد. ابزار Contrast-A یک رویکرد بسیار فنی برای پیکربندی پالت اتخاذ می کند و اطلاعات دقیقی در مورد نسبت روشنایی و تفاوت در روشنایی و رنگ ارائه می دهد. اگر می‌خواهید یک وب‌سایت مینیمالیستی با رنگ‌های کمی ایجاد کنید که مکمل یکدیگر باشند، این ابزار عالی است.
این افزونه محبوب فایرفاکس به شما این امکان را می دهد تا معنای رنگ های جداگانه را مستقیماً در مرورگر تعیین کنید و تفاوت بین آنها را اندازه گیری کنید. یک "مرورگر طرح رنگ" برای انتخاب رنگ های فردی از مجموعه های از پیش انتخاب شده وجود دارد. پلاگین ColorZilla برای استفاده آسان و بسیار غنی از ویژگی ها، مانند چاقوی ارتش سوئیس از افزونه های مرورگر برای طراحان وب و هنرمندان است.
برخلاف بسیاری دیگر از مولدهای طرح رنگ "چرخ رنگ"، Colorotate پالت را روی یک مخروط سه بعدی نمایش می دهد. مانند Kuler، کاربران می توانند طرح های رنگی خود را ذخیره و ویرایش کنند و همچنین پالت های ساخته شده توسط طراحان دیگر را مشاهده کنند. این ابزار با برنامه های طراحی محبوب Adobe Fireworks و Photoshop یکپارچه شده است.
وقتی صحبت از طراحی وب موثر می‌شود، ما در مورد رابط‌های کاربری و طرح‌بندی بصری صحبت می‌کنیم، اما طرح‌های رنگی به همان اندازه اهمیت دارند، اگر نه بیشتر. ابزارهای لیست شده در اینجا باید شما را در جهت درست راهنمایی کنند تا در اولین تلاش یک پالت رنگ عالی برای وب سایت خود انتخاب کنید. ابزارهای مفید دیگری نیز وجود دارد که می‌توانید به صورت آنلاین پیدا کنید، اما اینها ابزارهایی هستند که می‌توانید برای یافتن زرادخانه کامل متناسب با سبک شخصی خود شروع کنید. موفق باشید و طراحی شاد!
انتخاب یک پالت رنگ همیشه یک کار دشوار است، چه طراحی یک وب سایت یا برنامه تلفن همراه. شما نباید رنگ ها را بی دقت انتخاب کنید، زیرا یک پالت خوب انتخاب شده استایل را برای کل سایت تعیین می کند.
هر بار که یک طراحی وب جدید ایجاد می شود، زمان زیادی برای انتخاب ترکیب رنگ های مختلف صرف می شود. ابزارهای پالت رنگ جایگزین می توانند در آینده در وقت شما صرفه جویی کنند.
تعداد زیادی برنامه برای انتخاب پالت رنگ وجود دارد، اما در این لیست ابزارهایی را انتخاب کردیم که کمی با برنامه های استاندارد متفاوت هستند.
سایتی با نام خود توضیحی که در آن اطلاعاتی در مورد رنگ جمع آوری و به تفصیل ارائه می شود. این بیشتر شبیه یک ابزار توسعه دهنده است، جایی که جمع و تفریق وجود دارد، ایجاد گرادیان با نشان دادن دقیق کد رنگ در تمام فضاهای رنگی ممکن در دسترس است. این رویکرد برای کسانی که وقت آزاد دارند و همچنین عشق غیرقابل توضیحی برای محاسبات راحت است.
سرویس "لامپ" دوستانه و گرم که از اولین دقیقه ملاقات شما را خوشحال می کند. منطق سایت این است که شما "یک رنگ" را انتخاب می کنید، و سرویس راه حل های مناسبی برای آن ارائه می دهد: یک گرادیان، طیفی از تیره ترین و روشن ترین سایه ها، سایه های کمی خاموش یا روشن رنگ انتخاب شده.
برخلاف سرویس‌های قبلی، این سایت پالت‌های آماده و انتخابی را نشان می‌دهد که نحوه تعامل رنگ‌ها با یکدیگر را در عکس‌های پیوست نشان می‌دهد. با نگاه کردن به امواج دریا یا گل ها، شگفت زده می شوید که چقدر طبیعت در انگیزه خلاقانه اش غنی است و دانش ما از رنگ چقدر ضعیف است. به طور کلی، این یک منبع ارزشمند برای کسانی است که تازه شروع به درک ترکیب رنگ ها کرده اند و عاشق تصاویر زیبا هستند.
همانطور که نویسنده منبع خود را توضیح می دهد: "من وب سایت 0to255 را ساختم تا کارم را ساده کنم." طراحان وب و افراد در حرفه های مشابه هر روز با گل کار می کنند. هنگام انتخاب مناسب، آنها به سایه های مختلف آن نیاز دارند و با استفاده از این سرویس می توانید به راحتی در زمان خود صرفه جویی کنید بدون اینکه خود را با ویرایش کد هگزادسیمال تحت فشار قرار دهید.
راه حلی برای کسانی که دوست دارند رنگ ها را در تصاویر پیدا کنند. فقط یک تصویر را آپلود کنید و این سرویس یک پالت رنگ اصلی را با یک کد هگزادسیمال نمایش می دهد.
چه کسی ممکن است به برنامه ای برای انتخاب راه حل های رنگی برای تبلت نیاز داشته باشد؟ احتمالاً برای کسانی که نه تنها با رنگ کار می کنند، بلکه با آن زندگی می کنند یا افرادی که توانایی سینستزیا دارند. این سایت عملکرد رابط کاربری مشابه، اما کمی کاهش یافته را ارائه می دهد که برای تبلت طراحی شده است. متأسفانه سایت دارای کاستی هایی است؛ به عنوان مثال، استفاده از طیف سه بعدی که یکی از ویژگی های سایت است، ناخوشایند است.
در سریال‌های تلویزیونی آمریکایی، اغلب عبارت «فقط اگر آخرین مرد روی زمین بودی» را می‌گویند، در مورد ما، «اگر هیچ ویرایشگر گرافیکی در دسترس ندارید». خشک، معمولاً جالب نیست. هیچ جذابیت یا تمایلی برای تعامل در آن وجود ندارد؛ ظاهراً این محصول مدت زیادی است که توسعه نیافته است.
به سختی می توان این سایت را ساده نامید، زیرا سازندگان هر چیزی را که هنگام کار با رنگ مورد نیاز است گنجانده اند. این همه چیز دارد: مجموعه زیادی از مجموعه ها، کانال ها، روندها، انواع مختلف ابزار برای ایجاد الگوها، جستجوی رنگ ها بر اساس تصویر. به طور کلی هر چیزی که دلتان می خواهد.
خلاصه کردن:
با وجود خدمات متنوع برای انتخاب رنگ، Adobe Kuler، از نظر ویراستاران ما، با قضاوت بر اساس امکان انتخاب ترکیب رنگ، می تواند بهترین نامیده شود.
یکی از مزایای اصلی این میکسر رنگ، امکان ذخیره انتخاب های شما، مشاهده رنگ های انتخابی به صورت تمام صفحه و همچنین به اشتراک گذاری یافته های خود و نگاه کردن به دیگران است. و برای کسانی که دیگر نمی خواهند حتی برای یک دقیقه از این سرویس جدا شوند، یک پلاگین برای فتوشاپ وجود دارد که به شما امکان می دهد بدون ترک ویرایشگر از برنامه استفاده کنید.
یک طراح در عصر دیجیتال، البته، نیازی به محدود شدن با رنگ هایی که می توان از رنگ ها، جوهرها یا رنگدانه های دیگر به دست آورد، ندارد، اگرچه از رویکرد رنگ در آثار هنری نیز چیزهای زیادی می توان آموخت. چشم انسان می تواند بین میلیون ها سایه مختلف تمایز قائل شود، اما گاهی اوقات حتی ترکیب دو رنگ می تواند چالش برانگیز باشد.
خواص رنگ شگفت انگیز
این به این دلیل است که انتخاب سایه ها برای طراحی بسیار ذهنی است و نیاز به دانش خاصی دارد. بنابراین اگر طراحان بخواهند یک پالت رنگی زیبا که بتواند مشتری را خوشحال کند، چیکار باید بکنند؟ چه بخواهید چه نخواهید، بهترین ترکیب رنگ ها فراتر از ترجیح شخصی است، زیرا آنها توانایی شگفت انگیزی برای تأثیرگذاری بر خلق و خو، احساسات و ادراک دارند، معنای فرهنگی و شخصی به خود می گیرند و توجه را به خود جلب می کنند - هم آگاهانه و هم ناخودآگاه.
چالش طراحان و بازاریابان ایجاد تعادل بین عملکردهای پیچیده سایه ها برای ایجاد یک پالت جذاب و تاثیرگذار از ترکیب رنگ ها است. اینجاست که درک پایه ای از تئوری رنگ مفید است. این می تواند به شما کمک کند تا بفهمید کدام زنگ ها به خوبی با هم کار می کنند (یا نه) و ترکیب های مختلف در یک طرح مشخص چه تأثیری ایجاد می کند.
یک طرح رنگی
در مدرسه، بچه‌ها این موضوع را در درس‌های هنر مطالعه می‌کنند، بنابراین همه احتمالاً با شکل ساده آن آشنا هستند: رنگ‌های اصلی قرمز، زرد و آبی. چرخ رنگ سنتی شامل 12 تن است و اغلب توسط هنرمندان استفاده می شود. این یک راه بصری ساده برای درک روابط رنگی است.
وظیفه اصلی که چرخ رنگ انجام می دهد ترکیب رنگ است. مخلوط کردن سایه های پایه یا اولیه (زرد، آبی و قرمز) سایه های ثانویه را تشکیل می دهد: سبز، بنفش و نارنجی. ترکیب آنها با تن اصلی به شما امکان می دهد تا سطح سوم دایره - رنگ های درجه سوم را بدست آورید. اینها عبارتند از قرمز-نارنجی، سبز-آبی، آبی-بنفش و بنفش-قرمز. تن های اولیه و ثانویه بخشی از طیف مرئی یا رنگ های رنگین کمان هستند. با استفاده از عبارت یادگاری "هر شکارچی می خواهد بداند قرقاول کجا می نشیند" به راحتی می توان دستور آنها را به خاطر آورد: قرمز، نارنجی، زرد، سبز، آبی روشن، آبی و بنفش.
این روش درک رنگ به عنوان مدل تفریقی شناخته می شود که شامل مخلوط کردن رنگدانه هایی مانند رنگ یا جوهر است و هم در چرخه رنگ سنتی و هم در سیستم CMYK مورد استفاده در تجهیزات چاپ استفاده می شود. با مدل افزودنی که شامل مخلوط کردن نور فرکانس های مختلف (به عنوان مثال، روی صفحه نمایش کامپیوتر یا تلویزیون) است که از مجموعه متفاوتی از قرمز، سبز، آبی (RGB) تشکیل شده است، متفاوت است.
ویرایشگرهای گرافیکی از نسخه متفاوتی از چرخه رنگ استفاده می کنند. هر سایه ای را می توان با استفاده از کد هگزادسیمال آن انتخاب کرد.
واژه شناسی
قبل از کامپایل پالت ها، باید بر اصطلاحاتی تسلط داشته باشید که به شما در درک انواع مختلف سایه ها کمک می کند:
- رنگ مترادف رنگ است و به طور سنتی به یکی از 12 رنگ اشاره دارد.
- روشنایی: درجه فاصله یک تن رنگ از سیاه.
- سبکی: نزدیکی تن به سفید؛
- اشباع - شدت یا خلوص یک رنگ (هرچه یک رنگ به خاکستری نزدیکتر شود، اشباع کمتری دارد).
بهترین ترکیب رنگ
از چرخه رنگ تعدادی پالت کلاسیک وجود دارد که در طول قرن ها توسط هنرمندان استفاده شده است. برای اکثر تصمیمات طراحی، یک رنگ غالب باید از این طرح ها مشخص شود - با مقدار استفاده از آن یا با انتخاب آن از رنگ های دیگر - یک یا چند لهجه:
1. طرح تک رنگ: استفاده از روشنایی، روشنایی یا اشباع رنگ های یک رنگ در محدوده روشن تا تیره. نمونه ای از یک ترکیب موفق تک رنگ قرمز با سیاه و سفید است. این طرح یک طراحی باریک و محافظه کارانه ارائه می دهد. آبی و سفید ترکیبی کلاسیک از چینی چینی از قرن نهم است. و منسوجات فرانسوی قرن 18.
2. موارد مشابه که در کنار هم روی چرخ رنگ قرار دارند. این جهانی و آسان برای استفاده در هنگام توسعه پروژه ها است. یک مثال می تواند ترکیب بنفش و آبی-بنفش باشد.
3. طرح مکمل: از رنگ هایی استفاده می کند که در انتهای مخالف چرخ رنگ قرار دارند. به عنوان مثال، آبی و نارنجی، قرمز و سبز. رنگ های مکمل شدت و کنتراست بالایی دارند، اما به سختی می توانند به صورت هماهنگ و متعادل در فرم خالص خود اعمال شوند زیرا می توانند به راحتی در یک طرح با هم برخورد کنند.
4. طرح تقسیم-مکمل: هر تن در چرخه رنگ به اضافه دو رنگ در حاشیه مکمل آن. به عنوان مثال، زرد با سبز و قرمز بنفش. این طرح همچنین دارای کنتراست بصری قوی است، هرچند ضعیف تر از طرح قبلی. بهترین ترکیب رنگ ها را برای مبتدیان طراحی فراهم می کند زیرا به هم ریختن آن دشوار است.
5. طرح سه گانه: هر سه تن به طور مساوی در چرخه رنگ توزیع شده است. ترکیبات کاملاً روشنی را ارائه می دهد، حتی اگر رنگ ها کم رنگ و غیراشباع باشند. برای استفاده موفق، رسیدن به تعادل کامل ضروری است - یک رنگ باید غالب شود و دو رنگ دیگر باید لهجه باشند.
6. تتراد یا مکمل مضاعف: از دو جفت مکمل تشکیل شده است. این طرح فوق العاده جذاب است، اما استفاده از آن از یک جفت رنگ مکمل دشوارتر است، زیرا تناژهای بیشتر تعادل دشوارتر است. هنگام استفاده از این طرح، باید یک رنگ را به عنوان رنگ غالب انتخاب کنید و اشباع، روشنایی و روشنی رنگ برخی یا همه تن ها را طوری تنظیم کنید که بهترین ترکیب رنگ را در قسمت های مختلف طرح ارائه دهند.
الهام بخش
علاوه بر ترکیب چرخ رنگ، طبیعت راه حل های آماده بسیاری برای طرح های رنگی هماهنگ ارائه می دهد.
گزینه‌هایی برای ترکیب رنگ‌ها شامل در نظر گرفتن دمای آنها (گرم یا سرد)، اشباع (رنگ‌های روشن اغلب جوان به نظر می‌رسند در حالی که رنگ‌های کم رنگ به نظر می‌رسند قدیمی)، حالت (روشن و شاد، تاریک و جدی)، تم (موقعیت، فصل، تعطیلات) و موارد دیگر. کیفیت ها
یکی دیگر از تکنیک های عالی برای یافتن رنگ، نگاه کردن به دوره های مختلف تاریخی و جنبش های هنری برای الهام است: رنگ های گرم و روشن امپرسیونیست ها. ترکیب های روشن و غیرمنتظره پست امپرسیونیست ها؛ رنگ های آرت نوو ملایم و خاکی؛ سایه های روشن و جسورانه هنر پاپ.
روانشناسی رنگ
رنگ ما را احاطه کرده است. چه متوجه شویم و چه ندانیم، نقش مهمی در زندگی روزمره ما دارد. آیا امروز تابلوی جاده ای نارنجی یا زرد در جاده دیده اید؟ او به دلیلی توجه را به خود جلب کرد. رنگ ارتباط شگفت انگیزی با حالات و احساسات ما دارد.
اما همه افراد رنگ را به یک شکل تجربه نمی کنند. معنا و نمادی که ما با لحن های مختلف مرتبط می کنیم به شدت به تأثیر گروه های فرهنگی و اجتماعی که به آن تعلق داریم بستگی دارد. در اینجا برخی از معانی رایج مرتبط با رنگ های اصلی در فرهنگ غربی آورده شده است.
قرمز
این رنگ بسته به زمینه، ایده های مختلفی را منتقل می کند. در ارتباط با آتش، می تواند نماد گرما یا خطر باشد. از آنجایی که قرمز رنگ خون است، رنگی پرانرژی و سرزنده به حساب می آید و به همین دلیل با مسائل قلبی و گاهی اوقات خشونت همراه است.
معانی جایگزین: در برخی از فرهنگ های شرقی، قرمز نماد خوش شانسی و سعادت است و رنگی است که عروس ها در روز عروسی از آن استفاده می کنند. در سراسر جهان، قرمز با جنبش‌های سیاسی مختلف همراه است و نماد انقلاب است.
در برندسازی: اغلب بیانگر قدرت، اعتماد به نفس و قدرت است و بسیار قابل مشاهده است.
نارنجی
همچنین رنگ آتش، نارنجی گرمای قرمز را با شادابی زرد ترکیب می کند و نمادی از فعالیت، انرژی و خوش بینی است. همچنین با برداشت یا پاییز همراه است.
معانی جایگزین: در هند، زعفران که رنگ زرد مایل به نارنجی دارد، مقدس شمرده می شود. در ژاپن رنگ نماد عشق است.
در برندسازی: اغلب نشان دهنده جوانی و خلاقیت است. طلا که سایه ای از نارنجی یا زرد نیز دارد، نمادی از تجمل و کیفیت بالا است.
رنگ زرد
به عنوان رنگ خورشید، اغلب نماد شادی، نشاط، دوستی و طراوت بهار است. علاوه بر این، در زمینه های خاص می تواند یک سیگنال هشدار دهنده یا هشدار دهنده احتیاط باشد. برخی از تغییرات (مخصوصاً انواع غیراشباع و مایل به سبز) بیمارگونه یا ناخوشایند به نظر می رسند، که جای تعجب نیست زیرا از نظر تاریخی گاهی اوقات زرد با بیماری و قرنطینه همراه است.
معانی جایگزین: در برخی از فرهنگ های شرقی و آسیایی، رنگ زرد با تولد یا موقعیت بالا همراه است. در برخی از مناطق آفریقا و آمریکای لاتین، این لحن رنگ سنتی عزاداری است.
در برندسازی: رنگ زرد روشن یا روشن توجه را به خود جلب می کند، اما در صورت استفاده بی دقت می تواند ناراحت کننده یا حتی به سختی دیده شود (مانند متن سفید روی پس زمینه زرد روشن یا برعکس).
سبز
این رنگ طبیعت، پوشش گیاهی و رشد است. اغلب نمادی از سلامتی، طراوت یا ویژگی های طبیعی است. سبز تیره می تواند نشان دهنده ثروت و ثبات باشد.
معانی جایگزین: در میان فرهنگ های اسلامی، رنگ سبز یک رنگ مقدس است. همچنین با ایرلند، روز سنت پاتریک و شبدر چهار برگ خوش شانس همراه است.
در برندسازی: برندها یا محصولاتی که به عنوان "سبز" به بازار عرضه می شوند (طبیعی، سالم، سازگار با محیط زیست، ارگانیک و غیره) اغلب از رنگ های طبیعی مانند سبز و قهوه ای استفاده می کنند.
آبی
رنگ دریا و آسمان، اغلب نماد صلح و صفا است. بر خلاف تن های پر انرژی و گرم، آبی به عنوان آرامش بخش تلقی می شود. در برخی موارد می تواند نشان دهنده غم و اندوه یا افسردگی باشد.
معانی جایگزین: در فرهنگ های خاورمیانه، آبی به طور سنتی از شر محافظت می کند. به دلیل ارتباط آن با آسمان، در بسیاری از فرهنگ ها این رنگ نماد جاودانگی و معنویت است.
در برندسازی: آبی بسیار مورد استفاده قرار می گیرد و یکی از پرکاربردترین رنگ ها است. معمولاً نمادی از قابلیت اطمینان، امنیت و ثبات است. این لحن به ویژه در زمینه های شرکتی محبوب است زیرا دارای ویژگی های جدی، محافظه کارانه و حرفه ای تلقی می شود.
بنفش
به طور سنتی با اشراف، عظمت یا افتخار همراه است. بنابراین، مفاهیم معنوی، عرفانی یا مذهبی دارد.
معانی جایگزین: در بسیاری از فرهنگ ها در سراسر جهان، ترکیب رنگ بنفش نمادی از اشراف یا ثروت است، اما در تایلند و بخش هایی از آمریکای جنوبی با عزاداری همراه است.
در برندسازی: سایه‌های تیره بنفش اغلب نمادی از تجمل هستند، در حالی که سایه‌های روشن‌تر و روشن‌تر در میان زنان و کودکان محبوب هستند.
مشکی
مانند قرمز، این رنگ نیز معانی زیادی (گاهی متناقض) دارد. این می تواند نشان دهنده قدرت، تجمل، پیچیدگی و انحصار باشد. از سوی دیگر، رنگ سیاه نماد مرگ، شر یا رمز و راز است. در لباس، نماد رسمی یا عزاداری و اندوه است (همانطور که عزاداری به طور سنتی در مراسم خاکسپاری پوشیده می شود).
معانی جایگزین: در برخی از کشورهای آسیایی و آمریکای لاتین، رنگ سیاه به عنوان رنگ مردانه در نظر گرفته می شود. در مصر به معنای تولد دوباره است. در بسیاری از فرهنگ ها، رنگ با جادو، خرافات یا بدشانسی و همچنین غیرقابل توضیح یا ناشناخته همراه است.
در برندسازی: رنگ مشکی آنقدر زیاد استفاده می شود که تقریباً خنثی شده است، اگرچه بسته به زمینه می تواند نماد موارد فوق باشد. بسیاری از طرح ها به سادگی سیاه و سفید هستند (به عمد یا صرفاً برای صرفه جویی در چاپ رنگی).
سفید
به عنوان رنگ نور و برف، سفید اغلب نماد خلوص، بی گناهی، خوبی یا کمال است (به طور سنتی توسط عروس ها پوشیده می شود)، اما همچنین نشان دهنده ریاضت یا عقیمی است.
معانی جایگزین: در چین رنگ سفید رنگ عزاداری است. در بسیاری از فرهنگ ها به معنای صلح است - پرچم سفید نماد جهانی آتش بس یا تسلیم است.
در برندسازی: رنگ سفید اغلب بیانگر سادگی، خلوص یا مدرنیته است. طراحانی که به دنبال زیبایی شناسی مینیمالیستی هستند اغلب از رنگ سفید زیادی استفاده می کنند.
رنگ در طراحی
انتخاب ترکیب رنگی فراتر از انتخاب دو یا سه سایه و توزیع آنها به نسبت مساوی در سراسر طرح است. استفاده موثر از آنها ارتباط زیادی با تعادل دارد و هر چه از تون های بیشتری استفاده کنید، دستیابی به آن دشوارتر است.
ساده ترین راه برای اجرای این مفهوم، تقسیم رنگ های انتخاب شده به رنگ های غالب و برجسته است. لحن غالب در طراحی قابل مشاهده ترین و بیشترین استفاده را خواهد داشت، در حالی که یک یا چند لهجه آن را تکمیل و متعادل می کند. توجه به تعامل رنگ ها - وجود یا عدم وجود کنتراست، نحوه به نظر رسیدن رنگ های مجاور، خلق و خوی ترکیب رنگ ها و سایه ها و غیره - به شما کمک می کند تا پالت ایده آل را برای اهداف طراحی با دقت انتخاب کنید.
قانون عمومی پذیرفته شده برای استفاده از یک پالت سه رنگ اصلی، قانون 60-30-10 است. این رویکرد اغلب در طراحی داخلی استفاده می شود، اما می تواند به طور موثر برای طراحی وب یا چاپ نیز استفاده شود. کافی است 60% را به رنگ غالب اختصاص دهید و 30% و 10% باقیمانده را به دو لهجه اختصاص دهید. یک مثال خوب برای توضیح این قانون، کت و شلوار مردانه است: ژاکت و شلوار 60 درصد رنگ لباس را تشکیل می دهد، پیراهن 30 درصد و کراوات 10 درصد باقی مانده را تشکیل می دهد. همه با هم ظاهری متعادل و زیبا را ارائه می دهند.
راه دیگر برای ساده و متعادل نگه داشتن پالت، استفاده از روشنایی و روشنایی (یا نسخه های روشن تر و تیره تر رنگ انتخابی شما) است. به این ترتیب می توانید انتخاب رنگ خود را بدون زیاد کردن طرح گسترش دهید.
و برندسازی
تشخیص برند به شدت به رنگ بستگی دارد. فقط به کوکاکولا، فیس بوک یا استارباکس فکر کنید و به راحتی می توانید لحن هایی را که این برندها با آنها مرتبط هستند به خاطر بسپارید.
مطالعه ای که در دانشگاه وینیپگ انجام شد نشان داد که قضاوت اولیه مردم در مورد محصولات عمدتاً بر اساس رنگ است (60-90٪ ارزیابی). این بدان معناست که لحن در طراحی فقط یک انتخاب هنری نیست، بلکه یک تصمیم مهم تجاری است که بر همه چیز از نحوه درک مصرف کنندگان از یک برند گرفته تا نحوه فروش محصولات تأثیر می گذارد.
با این حال، هنگام انتخاب یک طرح رنگ برای یک لوگو، لازم نیست به سنت ها، نمادها یا کلیشه ها پایبند باشید. در اینجا هیچ قاعده ابطال یا سریعی وجود ندارد. آنچه مهمتر است این است که چگونه از لحن در طراحی استفاده می شود و با بافت بازار و شخصیت برند هماهنگ می شود.
RGB در مقابل CMYK
هنگام کار بر روی یک پروژه چاپی، مانیتور کامپیوتر شما نمی تواند رنگ ها را به شکلی که روی کاغذ نشان می دهد نمایش دهد. آنچه می بینید چیزی نیست که به دست می آورید زیرا مانیتورها و چاپگرهای دیجیتال از دو سیستم مختلف استفاده می کنند: RGB و CMYK. اولین مورد اشاره به نقاط کوچک نور قرمز، سبز و آبی دارد که با هم ترکیب می شوند و رنگ های قابل مشاهده روی صفحه را تشکیل می دهند. دومی به معنای رنگ های فیروزه ای، سرخابی، زرد و سیاه برای ایجاد چاپ های رنگی است. از آنجایی که RGB از طیف گسترده‌تری نسبت به CMYK استفاده می‌کند، برخی از طراحان در ابتدا طرح چاپی را در RGB ایجاد می‌کنند تا گزینه‌های رنگ بیشتری را حفظ کنند و طرح نهایی را قبل از چاپ به CMYK تبدیل کنند.
به همین دلیل، آنها به ابزاری نیاز دارند که ثبات رنگ را در هر دو سیستم فراهم کند - به عنوان مثال، هنگام طراحی لوگو برای یک وب سایت و چاپ آن بر روی کارت ویزیت. یکی از این سیستم ها سیستم تطبیق پنتون (PMS) است. در اینجا، تنها را می‌توان در سراسر وب و چاپ (و در انواع مختلف سطوح چاپی) با هم تطبیق داد تا از ظاهری ثابت اطمینان حاصل شود.
رنگ: درک، کشف و دوست داشتن آن!
طراحان در مطالعه تئوری رنگ، روانشناسی یا علوم اعصاب تخصص دارند - موضوعات پیچیده ای که در تقاطع هنر و علم قرار دارند. اما این بخشی از چیزی است که این حرفه را بسیار جالب و ابزار موثری در بازار می کند. اگرچه این راهنما فقط اصول اولیه را بیان می کند، امید است که به انتخاب رنگ آگاهانه تر و موثرتر برای پروژه های شخصی یا حرفه ای کمک کند.
رنگ ها نقش مهمی در طراحی وب دارند. برای انتخاب صحیح یک طرح رنگی برای یک وب سایت، خدمات ویژه ای وجود دارد. من مطمئن هستم که هر طراح وب حداقل یکی از این موارد را در بوکمارک های خود دارد.
گاهی می‌نشینید و فکر می‌کنید چه سایه‌ای از آبی را به عنوان رنگ اصلی برای سایت انتخاب کنید، کمی روشن‌تر یا کمی روشن‌تر یا شاید تیره‌تر... و هنوز باید رنگ‌های اضافی برای آن انتخاب کنید. البته می توانید این کار را با چشم انجام دهید، اما بهتر است از یکی از خدمات ویژه استفاده کنید.
من در مورد تئوری رنگ صحبت نمی کنم (این اطلاعات بسیار حجیم است)، اما به سادگی خدماتی را که در نشانک های خود دارم و استفاده می کنم در اینجا منتشر خواهم کرد.
من سالهاست با این ساز دوست هستم. راحت ترین ابزار برای انتخاب رنگ ها (به نظر من). دارای بسیاری از ویژگی های اضافی است. برای مثال می توانید نمونه ای از صفحه روشن و تیره را با رنگ های انتخاب شده مشاهده کنید.
می توان ارزیابی کرد که افراد مبتلا به کوررنگی و سایر اختلالات بینایی چگونه طرح رنگ شما را می بینند. می توانید رنگ های ایمن وب را انتخاب کنید.
Adobe Kuler دومین ابزار وب است که من اغلب از آن استفاده می کنم. انتخاب طرح‌های رنگی تقریباً مشابه سایت قبلی است، اما به این دلیل نیست که آن را دوست دارم. علاوه بر ایجاد طرح‌های رنگی خودتان، می‌توانید به طرح‌هایی که دیگران ایجاد کرده‌اند نگاه کنید و از آنها استفاده کنید.
برای انجام این کار، روی دکمه در منوی بالا سمت چپ "Watch" کلیک کنید. و گالری از انواع ترکیب رنگ ها پیش روی شما باز می شود.
این ابزار کمی شبیه به Colorscheme است، اما عملکردهای کمتری دارد، اما می توانید ببینید بلوک های رنگی چه شکلی خواهند بود.
من عملا از این سایت استفاده نمی کنم، اما از آنجایی که آن را در نشانک های خود دارم، تصمیم گرفتم آن را نیز اضافه کنم.
دو سایت زیر یک پالت از تصویری که انتخاب می کنید ایجاد می کنند. جادو است :)
شما هر تصویری را که رنگ آن را دوست دارید انتخاب می کنید، سرویس آن را تجزیه و تحلیل می کند و یک پالت رنگ به شما می دهد. تنها تفاوت این دو سایت در نحوه ارائه تصویر است.
این سایت نیاز دارد دانلودتصویر از کامپیوتر شما
یک ابزار بسیار مناسب برای انتخاب رنگ. بر اساس اصل "پسندیدن - دوست نداشتن".
همانطور که از نام آن پیداست، در اینجا می‌توانید رنگ‌هایی را برای طراحی تخت در حال حاضر مد روز انتخاب کنید. سایت جالب است زیرا هنگامی که یک پالت را انتخاب می کنید، می توانید آن را برای کورل و فتوشاپ دانلود کنید.
یکی دیگر از روند مد، طراحی متریال است. این سایت به شما کمک می کند ترکیب رنگی را برای UI (رابط کاربری) انتخاب کنید. علاوه بر این، سایت دارای مجموعه بزرگی از آیکون ها است.
رنگ یکی از مهمترین عناصر در کار یک طراح است. اما به‌عنوان یک مفهوم، تسلط بر آن می‌تواند بسیار دشوار باشد: به دلیل ترکیب‌های زیاد پالت‌ها، تصمیم‌گیری درباره بهترین نحوه طراحی رابط صفحات وب و برنامه‌ها اغلب دشوار است. ما قبلاً بررسی ابزارهای انتخابی و . و امروز می خواهیم با ارسال ترجمه مقاله Essential Color Tools for UX Designers اثر نیک بابیچ در وبلاگ، موضوع را گسترش دهیم.
این یادداشت حاوی لیستی از بهترین خدمات انتخاب رنگ برای وب سایت ها و طراحی UX است که به شما کمک می کند در زمان زیادی صرفه جویی کنید. از طریق این پروژه ها یاد خواهید گرفت:
- از کجا الهام بگیرید؛
- چگونه پالت خود را ایجاد کنید؛
- چگونه می توان طراحی را برای افراد دارای اختلال دید رنگی در دسترس قرار داد.
1. به دنبال الهام گرفتن
رنگ های طبیعت
از دنیای اطراف خود نقاشی بکشید. تنها کاری که باید انجام دهید این است که به اطراف نگاه کنید. لباس های مد روز، جلد کتاب، طراحی داخلی... چیزهای شگفت انگیز زیادی در اطراف شما وجود دارد. اما بهترین ترکیب رنگ ها رنگ های طبیعت هستند. یک لحظه زیبا را ثبت کنید و سعی کنید انتخاب خود را بر اساس یک تصویر خاص ایجاد کنید.
بهترین ترکیب رنگ ها در طبیعت یافت می شود. شما می توانید یک طرح رنگی از هر عکسی دریافت کنید
رفتار
در این سرویس محبوب، آثار جالبی را خواهید یافت که در بهترین نمونه کارهای آنلاین متخصصان واقعی در زمینه خود گنجانده شده است. این سایت همچنین منبع عالی الهام است. برای مشاهده نمونه های ارزشمند جدید از پروژه ها، کافی است رنگ مورد نظر خود را انتخاب کنید.
رنگ های دریبل
Dribbble یکی از بهترین مواردی است که هنگام ایجاد یک رابط کاربری مفید خواهد بود. اگر می خواهید به صورت بصری درک کنید که دیگران چگونه از یک رنگ خاص استفاده کرده اند، به dribbble.com/colors بروید و مقدار مورد نظر خود را وارد کنید.
هنگام انتخاب رنگ برای یک سایت، در اینجا می توانید حداقل درصد آن را تنظیم کنید - آزمایش کنید، به عنوان مثال، سعی کنید 30٪ آبی را تنظیم کنید.
سعی کنید حداقل درصد یک رنگ خاص را در Dribbble تنظیم کنید
طراحی الهام بخش
Designspiration یک ابزار مفید در درجه اول برای کسانی است که از قبل ایده هایی برای ترکیب رنگ دارند و می خواهند نمونه هایی از این ترکیب ها را ببینند. از 1 تا 5 گزینه را انتخاب کنید و تصاویری را پیدا خواهید کرد که با پارامترهای مشخص شده مطابقت دارند.
در Designspiration نمونه های مختلفی از ترکیب رنگ ها را خواهید یافت
Tineye Multicolr
با استفاده از سرویس تطبیق رنگ Tineye Multicolr می توانید گامای مورد نظر تصویر را تعیین کرده و حتی درصد (نسبت) هر یک از آنها را تعیین کنید. این سایت با یک پایگاه داده از 20 میلیون عکس Creative Commons از فلیکر یکپارچه شده است. این قطعا یکی از سریع ترین راه ها برای یافتن پالت عالی است.
رنگزیلا
ColorZilla یک افزونه برای نصب در مرورگرهای کروم و موزیلا فایرفاکس است. این شامل ابزارهایی مانند قطره چکان، مرور پالت، ایجاد و غیره است.
پسوند ColorZilla در کروم و فایرفاکس موجود است
طیف شاتر استوک
یکی از بهترین راه‌ها برای تصور اینکه یک طرح رنگی چگونه خواهد بود، نگاه کردن به تصاویر مربوطه است. اکثر راه حل هایی که انتخاب رنگ برای طراحی وب سایت ارائه می دهند شامل این ویژگی هستند، اما Shutterstock Spectrum یک رابط کاربری و پیش نمایش فوق العاده کاربرپسند دارد که واقعا می تواند مفید باشد.
علاوه بر این، شما نیازی به اشتراک نخواهید داشت، زیرا ارزیابی اولیه تصویر کاملاً کافی خواهد بود (حتی اگر دارای یک "واترمارک" باشد).
W3Schools
اخیراً وبلاگ منتخبی از W3Schools را بررسی کرده است. اطلاعات زیادی در مورد این موضوع در آنجا جمع آوری شده است، از نام آنها / کد سایه ها شروع می شود، تئوری ترکیب پالت ها و پایان دادن به توضیحات فرمت های مختلف: HEX، RGB، CMYK، HWB، و غیره. ژنراتورها، مبدل ها و «خدمات کوچک» مشابه. به طور کلی، تماشای آن جالب است.
2. یک پالت رنگ ایجاد کنید
ابزار رنگ طراحی متریال
ابزار طراحی مواد رنگی به شما امکان می دهد طرح های رنگی ایجاد کنید، به اشتراک بگذارید، و یک رابط کاربری خشن را برای انتخاب های خود مشاهده کنید. یکی از عملکردهای مفید آن اندازه گیری سطح دسترسی هر ترکیب رنگی است.
رنگ ها
Coolors سایتی برای ایجاد یک پالت چند رنگ است. فقط یک رنگ خاص را پین کنید و کلید فاصله را فشار دهید. این ابزار همچنین خوب است زیرا بیش از یک نتیجه را دریافت خواهید کرد، اما می توانید تنها با تغییر داده های اولیه چندین گزینه ایجاد کنید.
طرح رنگ در Coolors بر اساس عکس
Adobe Color CC
سرویس تطبیق رنگ Adobe Color CC (کولر سابق) اکنون بسیار محبوب است. این به صورت رایگان در اینترنت در دسترس است، اما یک نسخه desector نیز وجود دارد. با استفاده از این برنامه وب، پالت خود را با استفاده از چرخ رنگ می سازید:
یا می توانید نتیجه خاصی از تصویر تمام شده بدست آورید:
انتخاب رنگ برای یک وب سایت بر اساس یک عکس
صدها ترکیب آماده در اینجا وجود دارد، آنها را در بخش "Watch" جستجو کنید:
اگر از نسخه دسکتاپ استفاده می کنید، می توانید سیستم رنگی که ایجاد کرده اید را با یک کلیک به InDesign، Photoshop و Illustrator صادر کنید.
پالتون
اغلب با Adobe Color CC قبلی مقایسه می شود زیرا طرح ها بسیار مشابه هستند. تنها تفاوت این است که در Paletton شما به پنج پارامتر محدود نمی شوید، بلکه می توانید با زنگ های رابط اضافی آزمایش کنید.
علاوه بر این، می توانید نگاه کنید. همراه با سایرین، این برنامه به شما امکان می دهد به سادگی با استفاده از تلفن هوشمند خود در هر مکانی کار کنید. علاوه بر وظایف مستقیم ایجاد/صادرات پالت های رنگی، در اینجا می توانید رنگ های خاصی را از تصاویر انتخاب کنید یا از گزینه های اساسی استفاده کنید.
3. در دسترس قرار دادن پالت
امروزه اختلالات بینایی رنگ بسیار بیشتر از آن چیزی است که تصور می کنیم. حدود 285 میلیون نفر در جهان مشکلات بینایی را تجربه می کنند. همیشه باید بررسی کنید که آیا گزینه ای که انتخاب می کنید در دسترس چنین کاربرانی است یا خیر.
بررسی کنتراست رنگ WebAIM
برخی از تن ها به خوبی با یکدیگر هماهنگ می شوند، در حالی که برخی دیگر کاملاً برعکس هستند. تعداد زیادی از پروژه ها در آزمون A/A مردود می شوند و این یک واقعیت است. بررسی طراحی بصری رابط کاربری و کنتراست زنگ ها بسیار مهم است، به خصوص اگر متن زیادی در صفحه وجود داشته باشد. برای این منظور، هنگام انتخاب رنگ های وب سایت استفاده کنید.
WebAIM Color Contrast Checker یک ابزار مبتنی بر وب است که کدهای رنگ را در مقادیر هگزا دسیمال بررسی می کند.
رنگ ها
قبلاً در بالا به این سرویس اشاره کردیم. از جمله موارد دیگر، Coolors به شما کمک می کند تا پالت اختراعی خود را برای کوررنگی بررسی کنید.
نوع کوررنگی در نمودار
به جای حالت عادی، نوع مشکل بینایی را که می خواهید شبیه سازی کنید، انتخاب کنید. در نتیجه، دقیقاً خواهید فهمید که شخصی که قادر به تشخیص رنگ های خاص نیست، طراحی شما را چگونه می بیند.
اینگونه است که فرد مبتلا به پروتانومالی یک پالت را می بیند
NoCoffee Vision Simulator برای کروم
با استفاده از وب سایت NoCoffee Vision Simulator، می توانید ببینید که افراد مبتلا به کوررنگی یا کم بینایی چگونه صفحات وب خاصی را درک می کنند. به عنوان مثال، اگر پارامتر "Achromatopsia" را در بخش "Color Deficiency" مشخص کنید، صفحه وب را به رنگ خاکستری خواهید دید.
این همان چیزی است که یک پروژه CNN برای یک فرد مبتلا به دوترانوپیا به نظر می رسد.
نتیجه
تمام خدمات تطبیق رنگ وب سایت و طراحی UX ذکر شده در مقاله قطعا به شما در جستجوی یک پالت جالب و موثر کمک می کند. اما به یاد داشته باشید: بهترین راه برای یادگیری نحوه ایجاد پالت های شگفت انگیز تمرین و آزمایش زیاد است.