طراحی ux : ایجاد حس های مختلف با استفاده از رنگ ها

طراحی ux : ایجاد حس های مختلف با استفاده از رنگ هاReviewed by مهرخ on Nov 26Rating: 5.0طراحی ux : ایجاد حس های مختلف با استفاده از رنگ هاامروزه رنگ اهمیت بسیار بیشتری نسبت به گذشته دارد. در دنیای مدرن باید بدون کلمه بتوانیم ارتباط برقرار کنیم و رنگ یک کلید ارتباطی است.

طراحی ux : ایجاد حس های مختلف با استفاده از رنگ ها

امروزه رنگ اهمیت بسیار بیشتری نسبت به گذشته دارد. در دنیای مدرن باید بدون کلمه بتوانیم ارتباط برقرار کنیم و رنگ یک کلید ارتباطی است.

همه می دانیم که هر رنگی احساس خاصی را به وجود می اورد. برای اینکه کارمان را شروع کنیم ابتدا شرح مختصری از تاثیر خاص هر رنگ را بیان می کنیم و رابطه ی آن را با طراحی ux توضیح می دهیم.

رنگ قرمز

خطر ، اهمیت ، اشتیاق

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

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

red1

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

red2

این رنگ تداعی کننده ی گرما نیز هست.

red3

رنگ نارنجی

اعتماد به نفس، انرژی، مثبت اندیشی

نارنجی هم حس هیجان را القا میکند اما میزان انرژی کمتری نسبت به قرمز دارد. این رنگ علامت سلامتی هم هست مانند علامت های ویتامین c.

orange1

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

orange2

رنگ زرد

جلب توجه، شادی

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

yeloow1

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

yellow2

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

رنگ سبز

رشد، طبیعت، موفقیت

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

green1

به قسمت های محو شده ی عکس نگاه کنید.

green3

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

green4

آبی

صداقت، راحتی، آرامش

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

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

blue1

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

blue2

رنگ بنفش

تجمل، عشق، خلاقیت

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

purple1

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

purle2

 رنگ صورتی

احساسات دخترانه، معصومیت، جوانی

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

pink1

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

قهوه ای

محافظه کاری، زمین، ثبات

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

brown1

در حالت کلی این رنگ مناسب منوها، حاشیه ها و پس زمینه هاست.

رنگ مشکی

رسمیت، قدرت، اغواگری

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

black1

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

black2

سفید

تازگی، پاکی، سلامتی

بر خلاف رنگ مشکی ، رنگ سفید باعث می شود که رنگ های اطرافش به چشم بیایند به همین دلیل بهترین انتخاب برای رنگ دوم است.

white1

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

white2

رنگ طوسی

رسمیت، بی طرفی، جذابیت

رنگ طوسی رنگی خنثی ست. اگر با رنگ سرد ترکیب شود کامل می شود و اگر با رنگ گرم ترکیب شود باز هم کامل می شود.می توانید از تمامی قسمت های این طیف رنگ استفاده کنید.

grey1

باتغییر تیرگی و روشنی رنگ طوسی یا به رنگ سفید و یا رنگ مشکی می رسیم. وقتی از این رنگ به عنوان رنگ غالب استفاده می کنیم حس رسمیت را احساس میکنیم. Dropbox از این رنگ برای دکمه ی cta استفاده کرده است بنابراین کاربرها می توانند به راحتی دکمه ی نام نویسی رایگان را پیدا کنند.

grey2

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

grey3

طوسی کمرنگ بهترین گزینه برای دکمه ی غیر فعال کردن  است.

grey4

نتیجه گیری

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

conclusion

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

ترجمه: کاری از گروه لرن اس تی یو ، مهرخ اکبری

 

پاسخ دهید