راهنمای کاربردی استفاده از رنگ ها در طراحی رابط کاربری UI



visibility  
mode_comment   ۳

راهنمای کاربردی استفاده از رنگ ها در طراحی رابط کاربری UI

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

" رنگ ها به طراحی کیفیتی اضافه نمی کنند، بلکه آن را تقویت می کنند." پیر برنارد

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

قانون 60-30-10

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

60٪ میزان رنگ غالب شماست، 30٪ میزان رنگ ثانویه و 10٪ برای رنگ مکمل است.

معنای رنگ ها

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

برخی از معانی رنگ ها در زیر آورده شده است :

  • قرمز: شور، عشق، خطر
  • آبی: آرام، مسئول، امن
  • سیاه: رمز و راز، ظریف، شرور
  • سفید: خلوص، سکوت، پاکیزگی
  • سبز: جدید، تازه، طبیعت

برای مشاهده معانی سایر رنگ ها می توانید از فرهنگ های رنگ ها استفاده نمایید.

اولویت تک رنگ

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

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

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

از تونالیته خاکستری و سیاه خالص دوری کنید!

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

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

همواره به یاد داشته باشید همیشه کمی رنگ اشباع را اضافه کنید. با این کار طرح ناخودآگاه برای کاربران بیشتر طبیعی و آشنا به نظر می رسد. 

باور به طبیعت !

بهترین ترکیب رنگ ها همیشه در طبیعت است. آنها همیشه طبیعی خواهند بود. بهترین نکته ای که با توجه به طبیعت دریافت می شود این است که هموراه رنگ ها در طبیعت در حال تغییر هستند.

برای الهام گرفتن، ما فقط باید به اطراف نگاه کنیم

کنتراست را حفظ کنید

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

اگر می خواهید درباره تئوری رنگ ها بیشتر بدانید، به مطالعه مقالاتی در مورد نظریه رنگ ها برای طراحان بپردازید.

الهام بگیرید!

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

ابزار ها

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

Coolors.co

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

Kuler

این ابزار از Adobe مدت طولانی با ما بوده است. این برنامه در مرورگر و در نسخه های به روز دسکتاپ موجود است. اگر از نسخه دسکتاپ استفاده می کنید می توانید یک طیف رنگی را از آن انتخاب نموده و برای استفاده در طرح خود به فتوشاپ وارد کنید.

پالتون

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

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

نتیجه گیری

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

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

comment دیدگاه کاربران
Zahra Hamedanyzadeh

ممنون از مطلب خوبتون

علیرضا موذن

ممنون از شما بابت زمانی که اختصاص به مطالعه این مطلب دادید.

alighaderighezghapan

عالی بود مرسی لطفا اگر مطالب بیشتری در مورد رنگ ها دارید حتما بزارید

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.