顏色心理學(xué)

如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

在設(shè)計(jì)的各個(gè)方面都被廣泛使用，這已不是什么秘密。從日常中使用的顏色，到品牌標(biāo)識(shí)和網(wǎng)站設(shè)計(jì)，顏色是可以向用戶傳達(dá)特定消息的重要元素。

當(dāng)我們觀察一種顏色時(shí)，我們的眼睛會(huì)向大腦中稱為下丘腦的區(qū)域發(fā)送信息。反過(guò)來(lái)，這會(huì)向腦下垂體發(fā)送更多信號(hào)，然后再向甲狀腺發(fā)出信號(hào)。然后，這表明激素的釋放會(huì)導(dǎo)致我們的情緒，以及我們的行為發(fā)生波動(dòng)。

科學(xué)告訴我們，顏色會(huì)喚起情緒，導(dǎo)致消極，積極或不匹配的情緒。Kissmetrics接著說(shuō)，網(wǎng)站訪問(wèn)者只需90秒即可形成判斷或意見(jiàn)。除此之外，“62-90％的相互作用僅取決于產(chǎn)品的顏色。”

正如免費(fèi)電子書(shū)Web Eye for Human Eye所描述的那樣，色彩在為用戶創(chuàng)造強(qiáng)烈的第一印象方面起著不可否認(rèn)的作用。

顏色意味著什么

每種顏色對(duì)每個(gè)人都意味著什么，盡管這意味著我們的個(gè)人喜好和文化背景。

如需快速參考，請(qǐng)查看下面的顏色表。

通過(guò)動(dòng)畫(huà)網(wǎng)站和網(wǎng)絡(luò)演示給您的觀眾留下深刻印象。使用幻燈片，我們不會(huì)讓您從空白的板巖開(kāi)始。您所要做的就是選擇您最喜歡的元素并將它們組合起來(lái)。每張幻燈片都經(jīng)過(guò)精心設(shè)計(jì)，以滿足三個(gè)關(guān)鍵標(biāo)準(zhǔn)：美學(xué)，功能和可用性。通過(guò)這種方式，您可以無(wú)縫地協(xié)同工作，同時(shí)增強(qiáng)內(nèi)容的影響力。

創(chuàng)建一個(gè)網(wǎng)站

設(shè)計(jì)中的色彩心理學(xué)不是一門(mén)的科學(xué)，研究表明它受個(gè)人感知的影響。性別等社會(huì)因素也會(huì)對(duì)顏色的感知產(chǎn)生影響。進(jìn)一步的研究發(fā)現(xiàn)，產(chǎn)生影響的顏色本身并不總是如此，用戶對(duì)所使用的顏色的使用感覺(jué)是多么合適。

因此，如果你是為女性設(shè)計(jì)，那么紫色是一個(gè)相當(dāng)不錯(cuò)的選擇，因?yàn)樗艿脚缘钠毡橄矏?ài)，但是男性卻不喜歡（當(dāng)然，一般來(lái)說(shuō)）。在下圖中，這對(duì)L'Oreal Paris來(lái)說(shuō)效果很好。正如您所看到的，頁(yè)眉和頁(yè)腳是黑色的，這表示類和優(yōu)雅，因此您可以獲得產(chǎn)品不便宜但高端的整體感覺(jué)。

此外，白色用于文本，表示現(xiàn)代性和平靜感，而紫色被選擇表示奢華，優(yōu)雅和女性氣質(zhì) - 所有這些都明顯適合這樣的網(wǎng)站。

在下面的圖片中，對(duì)于女性健康雜志，頂部的橫幅是粉紅色的，但是該網(wǎng)站相對(duì)缺乏顏色，而是依賴于圖像和粗體導(dǎo)航。這是一個(gè)有趣的選擇，可以對(duì)網(wǎng)站起作用。

首先，粉紅色是一種非?？贪宓念伾?dāng)一個(gè)網(wǎng)站針對(duì)女性時(shí)使用它，并且它吸引甜食，所以該網(wǎng)站的信息，因?yàn)檫@是關(guān)于女性的健康，可能會(huì)因此而丟失。

一旦我們進(jìn)一步鉆研網(wǎng)站，標(biāo)題顏色當(dāng)然會(huì)在每個(gè)頁(yè)面上使用，但快速訪問(wèn)減肥部分將返回以下內(nèi)容。

正如您所看到的，此頁(yè)面更加粉紅色，這可能會(huì)對(duì)觀眾起反作用。但是，我們碰巧看到的第一個(gè)圖像位于滑塊上，當(dāng)您保留在頁(yè)面上時(shí)，這確實(shí)會(huì)發(fā)生變化。

確定配色方案

你不太可能創(chuàng)建一個(gè)只有一種顏色的網(wǎng)站（除非你純粹是單色），所以你應(yīng)該考慮整體配色方案和每種顏色，以及它們?nèi)绾螀f(xié)同工作。還要考慮對(duì)用戶的影響以及次要顏色如何與您正在使用的主要顏色相匹配。

考慮到這一點(diǎn)，在將顏色混合在一起時(shí)應(yīng)注意并為此提供幫助，您可以通過(guò)三種基本的混色方法來(lái)指導(dǎo)。

1：三重奏

這是最基本和平衡的方法，它使用色彩活力和互補(bǔ)。使用12步色輪，您可以選擇任意三種顏色，這些顏色彼此相隔120度，用于背景，內(nèi)容和導(dǎo)航。

2：化合物（分裂互補(bǔ)）

第二種方法有點(diǎn)困難，你可能需要進(jìn)行試驗(yàn)以使其正確，但如果做得好就可以非常有效。這個(gè)概念使用四種顏色 - 兩對(duì)對(duì)比（靠近色輪）和兩對(duì)互補(bǔ)對(duì)（在色輪上）。

3：類比

此方法僅關(guān)注補(bǔ)色，在決定您希望方案對(duì)用戶說(shuō)什么時(shí)應(yīng)該注意。因?yàn)樗怀隽怂x顏色的活力，所以它可能太多，因?yàn)轭伾旧鲜强鋸埖摹?

因此，在考慮顏色的心理時(shí)，重要的是要將所有顏色作為一個(gè)整體考慮，以及它們?nèi)绾螀f(xié)同工作，而不是僅選擇一個(gè)顏色，并希望它能與其他顏色一起工作，如背景，文本和按鈕。請(qǐng)查看下面的頁(yè)面，并考慮它對(duì)用戶說(shuō)的內(nèi)容。

背景顏色 黑色背景表示階級(jí)，卓越，形式和“企業(yè)”。顯然，在考慮提供指導(dǎo)的網(wǎng)站時(shí)，您希望傳達(dá)卓越性。形式化表明它與學(xué)習(xí)有關(guān)，而“公司”則表明用戶可能不會(huì)學(xué)習(xí)編碼作為業(yè)余愛(ài)好，而是作為他們?cè)诼殬I(yè)生涯中可以采取的東西。

按鈕顏色 該網(wǎng)站使用紅色按鈕顯示CTA按鈕，這些按鈕在黑色背景下清晰突出，以鼓勵(lì)注冊(cè)。黑色與白色邊框一起用于不太重要的按鈕，與整體方案保持一致。

文字顏色 對(duì)于文本，白色提供了所有重要的對(duì)比度，同時(shí)仍然匹配顏色方案。白色（和白色幽靈按鈕）中的圖標(biāo)放置在折疊處，以鼓勵(lì)用戶向下滾動(dòng)以獲取更多信息（如有必要）。

總的來(lái)說(shuō)，設(shè)計(jì)非常有效 - 我們都知道黑白相處得很好，在這種情況下，網(wǎng)站感覺(jué)優(yōu)雅和相對(duì)正式。紅色，如果過(guò)度使用，可能會(huì)從整體消息中獲取意義，因此為了脫穎而出并明確表示所需操作是注冊(cè)服務(wù)而非常謹(jǐn)慎地使用它。

要避免的顏色

布朗一般在設(shè)計(jì)中喚起自然的感覺(jué)，是男人最不喜歡的顏色，但它在某些情況下確實(shí)有效，因?yàn)樗硎究煽啃浴?

因此棕色適用于UPS，因?yàn)樗且患蚁Ｍ麄鬟_(dá)可依賴的強(qiáng)烈信息的公司。

然而，作為一個(gè)運(yùn)動(dòng)套件，由于圖像中顯示的條帶屬于懷俄明州學(xué)院團(tuán)隊(duì)，它被描述為大學(xué)橄欖球史上最糟糕的。有趣的是，棕色也被認(rèn)為可以促進(jìn)“堅(jiān)固性”，所以你會(huì)認(rèn)為它與這種激進(jìn)的運(yùn)動(dòng)搭配起來(lái)會(huì)起作用，但在這種情況下它并不是因?yàn)槟腥送ǔ２幌矚g棕色。

對(duì)于女性來(lái)說(shuō)，橙色似乎是最不喜歡的顏色，所以如果你是為一個(gè)主要的女性用戶群設(shè)計(jì)，請(qǐng)記住這一點(diǎn)。

當(dāng)然，請(qǐng)記住這些只是指導(dǎo)方針（它們總是取決于背景），所有顏色相互補(bǔ)充并創(chuàng)造和諧更為重要。

幫助您選擇正確顏色的工具

您當(dāng)然可以使用現(xiàn)成的調(diào)色板來(lái)幫助您做出選擇。在Web UI設(shè)計(jì)方面，您無(wú)需重新發(fā)明色輪。

Adobe Color CC 

所有Adobe用戶的可信賴提供商。

Paletton 

適合初學(xué)者的簡(jiǎn)單顏色選擇器。

平面UI顏色選擇器 

用于創(chuàng)建彩色平面設(shè)計(jì)

Mudcube Color Sphere 

提供各種主題并提供十六進(jìn)制數(shù)字。

檢查我的顏色 - 用于檢查前景色和背景色組合，并且它具有正確的對(duì)比度，供有色盲的人使用。

顏色 - 允許您通過(guò)在屏幕上移動(dòng)鼠標(biāo)來(lái)選擇顏色，設(shè)置飽和度然后獲取HEX代碼。

通過(guò)實(shí)例學(xué)習(xí)

有成千上萬(wàn)的網(wǎng)站使用顏色效果很好，而很多網(wǎng)站都沒(méi)有。然而，下面的圖片贏得了每日網(wǎng)站的顏色區(qū)分，很容易理解為什么。

背景是均勻的淺灰色，與自行車(chē)的灰色很好地匹配。簡(jiǎn)單的設(shè)計(jì)，大字體非常有效，并立即傳達(dá)出它是一個(gè)你喜歡騎的快速小自行車(chē)的感覺(jué)。

使用灰色可以使其他顏色脫穎而出，因?yàn)樗且环N中性色，隨著它變亮，它會(huì)照亮頁(yè)面并使其活躍。格雷也給人一種穩(wěn)定感（非常適合自行車(chē)廣告），同時(shí)營(yíng)造出一種平靜和鎮(zhèn)定的感覺(jué)。

“Go”一詞中使用的顏色明亮活潑，為設(shè)計(jì)增添了活力感和現(xiàn)代感。它主要是藍(lán)色的，因?yàn)檫@是男性和女性都喜歡的顏色，它確保頁(yè)面不是針對(duì)性別的。綠色增加了很少，這表明了一種環(huán)境責(zé)任感。這本身就非常聰明，因?yàn)檫@種尺寸的自行車(chē)當(dāng)然不會(huì)消耗汽油，對(duì)于環(huán)境而言比汽車(chē)更好 - 這當(dāng)然是我們已經(jīng)知道的事情，但是加強(qiáng)信息是件好事。

總的來(lái)說(shuō)，該頁(yè)面讓您了解滑板車(chē)如何成為現(xiàn)代城市生活的完美之選。

最后的考慮因素

顏色是設(shè)計(jì)的重要組成部分，但它也是整個(gè)品牌的重要方面。所使用的顏色傳達(dá)的感覺(jué)必須與品牌個(gè)性相匹配，并增加整體品牌故事和意義。

通常，設(shè)計(jì)師可能必須使用現(xiàn)有的藝術(shù)品，例如徽標(biāo)，并且必須基于此選擇顏色。雖然這可以看作非常緊湊，但是可以使用調(diào)色板來(lái)使這個(gè)過(guò)程變得更加容易。

藍(lán)藍(lán)設(shè)計(jì)( www.cqzjtgb.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。