設計師的顏色理論,第一部分:顏色的含義
設計師的顏色理論,第一部分:顏色的含義
www.smashingmagazine.com
譯者: neodreamer 2011年01月12日 23:16 原作者: 卡梅隆·查普曼
在設計領域,顏色是非常主觀的一樣事物。某種顏色會喚起某人的情緒反應,但是同樣的顏色對於另外一個人而言,喚起的可能就是另一種完全不同的情緒反應。有時,這與個人偏好有關,有時,這與文化背景有關。 8457瀏覽 | 13評論 本文被轉載引用(0)頻道: 文化,科技 類別: 文章 標籤: 設計師的顏色理論
所屬專欄: Smashing Magazine
譯文來源:http://www.21haolou.com/articles/show/127
原文:http://www.smashingmagazine.com/2010/01/28/color-theory-for-designers-part-1-the-meaning-of-color/
在設計領域,顏色是非常主觀的一樣事物。某種顏色會喚起某人的情緒反應,但是同樣的顏色對於另外一個人而言,喚起的可能就是另一種完全不同的情緒反應。有時,這與個人偏好有關,有時,這與文化背景有關。顏色理論是自成體系的一門學科。一些人的工作就是研究顏色是如何影響不同人(個體或者群體)的。這其中的奧妙不少。有時,像改變顏色的色調(hue)或是飽和度(saturation)這樣小的調整都會給人帶來完全不同的感受。而文化的差異則讓一種色彩在某國象徵幸福或是愉悅,而在其他的國家則變成了代表壓抑的顏色。
這次色彩理論的系列文章,包含三篇文章,本文是第一篇。這裡我們將討論不同色系(color families)背後所代表的含義,隨後還給出了一些例子,展示這些色彩是如何使用的(後面還有點小小的分析)。在第二部分,我們則會討論色調(hue),色度(chroma),明度(value),飽和度(saturation),色值(tones),淺色澤(tints),暗色澤(shades),以及這些是如何影響我們對於顏色的感受。在第三部分,我們將討論如何創建有效的調色板,供自己設計之用。
色調(hue)是最最基本的顏色術語、通常用來表示物體的顏色。當我們說紅、藍、綠時,我們說的就是色調。設計的色調可用來給網站的訪問者傳遞重要信息。
色度(chroma)是指顏色的純度
飽和度(saturation)是指某一色調在特定的光照條件下是如何呈現的。可以把飽和度看成是色調的強與弱、濁與清。
明度(value)也被稱作亮度,它是指顏色的暗與明。
當灰色加入到一個色調(hue)中時,便產生了色值(tones),色值要比純的色調柔和或是暗淡些。
當黑色加入到一個色調(hue)中時,便產生了暗色澤。
當白色加入到一種色調(hue)中時,就會形成淺色澤。
暖色(Warm Colors)
暖色包含紅、橙、黃以及這三種顏色的變種。它們分別是烈焰、落葉以及日出和日落的顏色,它們通常象徵活力、激情和積極。
紅和黃這兩種顏色都屬於三原色,而橙色則處於兩種顏色之間,這意味著紅色和黃色是真正的暖色,沒法通過混和一種暖色和冷色而獲得。你在設計中使用暖色以體現出激情,快樂,熱忱和活力的主調來。
紅色(原色)
紅色是一種非常強烈的顏色,使人聯想到烈焰,暴力戰爭。它也使人聯想到愛與激情。在古時候,它即與惡魔有關,也與愛神丘比特有關。實際上紅色會給人帶來身體上的反應,提升血壓和呼吸頻率。也有資料表明它可以加快人體的新陳代謝。
紅色與憤怒有關,不過它也與盛大的事件有關(看看頒獎典禮上的紅地毯就知道了)。紅色也預示著危險(這也是交通燈和標誌使用紅色的原因,大多數警告標誌都是紅色)。
在西方以外的地方,紅色有不同的含義。譬如,在中國,紅色是象徵繁榮和幸福。它用來謀求幸運的降臨。其他一些東方文化中,紅色是結婚日新娘著裝的顏色。不過在南非,紅色則是喪服的顏色。紅色也與共產主義有關。因紅十字會的宣傳,在非洲,紅色已經成為艾滋病防治的標誌色。
在設計中,紅色是一種很重的色彩,如果在設計使用過多,會產生一種壓倒性的感官效果,尤其是使用純紅色時。如果設計師想在設計中添加進力量和激情的感覺,紅色就是一種非常不錯的顏色。不過淺紅更能體現活力,而深紅則更能體現力量和優雅的一面。
範例
作品中的暗紅色給這個站點帶來了一種力度和優雅的感受。
真正的紅色調在黑色背景反襯中非常顯眼,給網站帶來一種力度和高端的感受。
網站中的鮮紅色的高亮區有一種充滿活力和運動的感覺
因為混用了格郎基元素(grunge),這個網站上的暗紅色看起來更像是血的顏色。
當暗紅色與白色或是灰色結合使用時,會給人形成一種非常優雅和專業的印象。
橙色(合成色)
橙色是一種充滿生氣和活力的顏色。柔和的橙色讓人聯想到大地以及秋色。因為它與季節的變換有關,橙色一般用來表現變化和運動的感覺。
因為橙色也與同名的水果有關,它也讓人聯想到健康和活力。在設計中,橙色不像紅色那樣強烈,但也能獲取觀眾的注意力。通常認為橙色更友善和誘人,不像紅色那樣具有挑釁性。
範例
儘管頁面上有其他鮮紅色的元素,但是網站上橙黃色方塊還是將讀者的注意吸引到它上面的內容上來。
橙色在這裡的用法最為常見,用來代表火焰。
.
當深橙色抵消了酸橙綠(lime green),該色便在這裡擔當起一種中立的底色。
這裡用橙色來烘托友好而誘人的印象來。
這裡的橙色高亮區極大的吸引了眼球,並將讀者的注意力帶到那個行動呼籲上來。
黃色(原色)
黃色被認為是最明亮、最具活力的暖色。它讓人聯想到快樂和陽光,不過,黃色也與欺詐和懦弱有關(稱呼某人是黃種人則是罵他懦弱)(譯者:囧)。
黃色也與希望有關,在一些國度里,家中有親人蔘軍打仗的人家會掛黃絲帶。黃頁也與危險有關,不過沒有紅色那麼強烈。
在一些國度,黃色有完全不同的含義。比如,在埃及,黃色是奔喪的顏色,而在日本,該色代表勇氣。在印度,黃色則是商人的顏色。
在設計中,鮮黃色(bright yellow)可以增添快樂和愉悅感覺。柔和的黃色通常用作嬰兒和小孩的中性色(相對藍色或者粉紅色)。淡黃色( Light yellows)相對鮮黃色而言給人是一種更內斂的快樂感受。深黃色和金黃色有時很有古韻,當需要營造一種永恆的感覺時,則可使用這種顏色。
範例
網站上鮮黃色的頁眉(header)和圖片給網站增添了一種活力和積極向上的感覺。
這裡的頁眉中,淺黃色是作為一種中性色加以運用的,配上手畫的插畫,給人一種非常愉悅的感受
淺黃色的高亮區將觀眾的注意力帶向了網站最重要的一個部分。
鮮黃色的向日葵讓網站的訪客想起夏日,結合舊黃色的背景,給人一種自在可靠的感覺。
這裡的頁眉的鮮黃色給設計作品增添了一些活力。
冷色(Cool Colors)
冷色系包含綠色、藍色和紫色,相對暖色,強度要弱。它們是夜、水和自然的代表顏色,通常給人感覺是舒緩,放鬆,以及有一點冷淡。
藍色是冷色系中唯一的原色(primary color),這意味著其他顏色是由藍色混合某種暖色而成(混合黃色得到綠色,混合紅色得到紫色),綠色繼承了黃色的一些屬性,而紫色則繼承了紅色的一些屬性。在設計中使用冷色可以營造一種冷靜或專業的感覺。
綠色(合成色)
綠色是一種非常務實(down-to-earth)的顏色。它可以象徵新的開始和成長。它也意味著新生和富饒。另外,綠色也可表示嫉妒和猜忌,代表缺乏經驗。
綠色繼承了藍色所有具備的平靜的屬性,但是它也吸收了一些黃色的活力。在設計中,綠色有一種平衡和協調的效果,並且很穩定。對於與財富,安定,新生以及自然相關的設計,綠色很合適。亮綠色更具活力和生機,而橄欖綠更多表示自然界。而暗綠色則是富饒的最典型代表。
範例
網站上運用的柔和的綠色給網站帶來一種非常實在,非常自然的感受。
網站翠綠色的頁眉配合綠葉的裝飾給人帶來一種自然而活潑的感受。
網站偏橄欖色的綠色給人帶來一種大自然的質感,而這時非常契合網站的內容主題的。
網站復古風格的翠綠色給網站帶來一種清晰而又充滿活力的感受。
這是另一個非常有自然清新感覺的橄欖綠網站。
藍色(原色)
在英語中,藍色通常與憂傷有關。藍色也廣泛用來象徵冷靜和責任。淺藍色有一種非常清新和友好的感覺。而深藍色則是更多表示可靠和力度。藍色也與和平有關。在許多文化中,藍色有靈魂和宗教上的寓意(比如,聖母瑪利亞則通常會被描繪成身著藍色的長袍)。
藍色的含義很大程度上取決於色調(hue)和暗色澤(shade)。在設計中,你所選用的藍色的暗色澤會對極大地影響力作品給人的感受。淺藍色通常表示放鬆和平靜,而亮藍色則通常表示活力和清新,而深藍色則非常適合公司類型的網站,這類場合,感染力和可靠性是很重要的。
範例
深藍色給人帶來一種可靠的感覺,而亮藍色和淺藍色則不會給人以穩重的感覺。
網站的深藍色給人一種非常專業的感受,當結合白色背景時,尤其如此,而淺藍色則給網站增添了一絲趣味。
網站的天藍色給人一種年輕、時髦的感覺,而淺紅色高亮區則進一步強調了這點。
這個網站混用了不同的藍色,總的給人一種清新的感覺。
網站柔和的淺藍色給人的第一印象是放鬆和平靜。
紫色(合成色)
一直以來,紫色都與高貴有關。它是紅色和藍色的合成色,具有這兩種顏色的一些屬性。它也與創造力和想像力有關。
在泰國,紫色是寡婦的葬服色。深紫色則通常與財富和忠誠有關,而淺紫色(像淡紫色)則更多讓人想到浪漫。
在設計中,深紫色給人一種富有和奢華的感受。淺紫色則更多讓人想到春天和浪漫。
這裡用的暗色澤讓人想到紫色具有的高貴,非常適合愛絲普蕾這種奢侈品品牌。
這裡所用的淺紫色和中度的紫色很好的傳達出了創造力的感覺。
網站上亮紫色以及紅紫色的色調給網站帶來一種富有和活力的外觀。
這裡暗紫色的背景給整個網站帶來一種非常有創造性的感覺。
網站上暗紫色的高亮區給人一種奢華和精緻的感覺。
中性色
中性色通常用作設計作品的背景色。中性色通常與亮色混用。不過也可在設計中單獨使用中,製作出老道的布局來。中性色的含義及其給人的影響容易受到周圍暖色和冷色的影響。
黑色
黑色是最強烈的中性色。往好的方面看,它通常與力量,高雅以及嚴謹(formality)有關,從壞的方面看,它也與邪惡,死亡以及神秘有關。黑色是許多西方國家葬禮色。在一些文化中,它與叛亂關係緊密,並且也與萬聖節和玄學有關。
黑色通常用在一些前衛和高雅的設計作品中。它可以很保守也可以很現代,可以很傳統,也可以做到不落俗套,這主要取決與和它搭配的顏色。因為它的中立性,設計中,黑色一般都是字體排版和其他功能模塊的顏色。在設計中,黑色可以很容傳達出一種老練和神秘的感覺。
範例
黑色的高亮區搭配亮色以及深褐色的背景,給整個設計作品帶來一種前衛的外觀。
混合冰藍色,黑色看起來也帶有寒意。
這裡的黑色混用深灰色和酸橙綠,以及加上格郎基(grungy)風格主題,給設計作品增添了更前衛的味道。
這裡黑色的高亮區給網站增添了老練和現代的氣息。
網站深黑色的高亮區給整個設計作品增加了一種老道的味道。
白色
在光譜上,黑色另一頭就是白色,不過跟黑色一樣,它能與其他任何顏色搭配的很不錯。白色通常與純潔,乾淨,貞操聯繫起來。在西方,白色通常是新娘在婚禮上穿的顏色。他通常也與醫療行業有關。尤其是跟醫生,護士,以及牙醫聯繫起來。白色也與上帝有關。天使就被人認為是身穿白色的。
在設計中,白色通常都作為中立的背景,可以設計作品中的其他顏色有更重的分量。它也可以用來傳達簡潔的理念。在極簡約風格的設計中,白色用的最多。在設計中,白色可以用表示冬天或是夏天,具體取決於白色周圍的設計圖案和顏色。
範例
Fuelhaus 網站上白色用來與鐵藍色(electric blue)形成對比
在極簡約設計風格的網站中,白色背景是很常用的。相對黑色的字體排版能獲得非常出色的對比。
這裡,白色被當作強調色用,從而讓網站的整體效果變得緩和。
白色混合灰色給設計作品帶來一種柔和而潔凈的感覺。
這裡,白色再次用作背景色,從而讓網站的整體效果變得緩和。
灰色
灰色是一種中立色,通常是在光譜冷色區一端。有時,灰色被視為是憂鬱或是壓抑,在一些設計中們淺灰色用來取代白色,用神灰色取代黑色。
灰色一般都顯得保守和正式,不過也可以顯得很現代。有時它被視作是哀悼色。在公司的設計作品中,經常用到,因為這裡,給人正式和專業感覺至關重要。它也可以是一種非常深奧的色彩。純灰色是黑色的暗色澤,而其他灰色則有藍色或是褐色混入其中。在設計中,灰色背景一種非常常見的排版。
範例
淺灰色給設計帶來一種平緩而安靜的感覺。
這裡淺灰色給排版( typography)增添了現代感。
網站上的冷灰色給人一種現代,精緻的感覺
深灰色的背景和淺灰色的排版色給設計帶來一種鮮明的現代感。
設計中廣泛使用的各種灰色澤一道給網站的設計帶來一種老練而專業的外觀。
褐色
褐色通常與大地,樹木和岩石扯上關係。它是徹頭徹尾的自然色和暖系中立色。因其堅定和質樸的性質,褐色也與信賴和可靠聯繫起來。它也可以被視作遲鈍無趣。
在設計作品中,褐色一般都用作背景色。這種顏色在木質紋理(Wood texture)和石質紋理中也很常見。他可以給設計帶來溫暖、健康的感覺。有時也用深褐色來取代黑色,用作背景色或是字體色。
範例
這裡運用的灰褐色給人一種可靠而信賴的感覺
這裡的橙褐色給人一種踏實而可靠的感覺
背景中用到的深褐色給整個帶來一種樸實、穩固的感覺,讓設計中的淺色真正突出出來。
木紋理褐色的一種常用用法,在這裡,暖褐色增添極簡約設計風格的網站增添了一些親切感。
灰褐色的背景在這裡給人一種可靠和腳踏實地的感覺。
米黃色和茶色(Beige and Tan)
在色譜上,米黃色有點特殊,它既可以帶有點暖色值也可以帶有點冷色值(warm tone),這取決於它附近的顏色。它帶有褐色的暖色質和白色的冷色質。有時,這個色彩看似很無趣。在大多數情況下,米黃色是保守色,通常用作背景。它也可以用來象徵虔誠。
在設計中,米黃色通常用作背景,在以紙張材質做素材的背景中,這種色彩尤其常見。它會呈現出周圍附近顏色的特質。它在設計作品中與其他顏色搭配使用,很少影響到設計作品給人最終的印象。
範例
因為周圍的亮色,這裡的淡茶色的背景給人一種年輕、清新的感覺
但茶色的背景給整個設計作品帶倆一種保守而雅緻的感覺。
網站上橙色和褐色高亮區讓茶黃色的背景看起來更溫暖。
茶黃色通常用在紙袋的紋理中,而更會灰一點的茶色則用作水泥或是石頭的材質。
網站上米黃色的標題背景和其他高亮區給整個設計帶來一種文雅而傳統的感覺。
奶油色和乳白色(Cream and Ivory)
乳白色和奶油色是機巧的顏色,帶有一點褐色的溫暖,另外更多的是混雜有白色的冷意,這種顏色通常很安靜,回會喚起一種歷史的質感。奶油色是鎮定色,帶有白色的一點純粹,也帶有一點暖意。
在設計中,乳白色可以給網站帶來一種高雅而又鎮定的感覺。當與桃紅色和褐色這類質樸色結合使用時,它可從中吸收質樸的性質。它可以用來沖淡暗色,而不會產生使用白色時所形成的突兀的強對比
範例
這裡奶油色色的背景含有一點暖色的特性,調和了網站上了的一些冷色。
淺灰色的奶油色背景因桔褐色的高亮區而顯得更具暖意。
奶油色的背景給網站增添了它所缺乏的一種高雅感。
這裡奶油色的背景增強了設計中圖片所蘊含的復古主題。
乳白色結合淺色整體給網站帶來一種非常優雅的外觀。
簡要概述……
這部分包含的信息看起來可能有點多,顏色理論除了包含特定暗色澤(shade)所給人帶來的感覺外,也包含其他方面。不過下面的內容可以作為一個快速的參考指南,讓你了解上面所討論的顏色所代表的一般含義。
深入閱讀
顏色的含義
About.com網站對顏色含義做的一個非常透徹的指南。
顏色的含義(Color Wheel Pro網站出品)
有關顏色含義的另一篇優秀指南
顏色
維基百科上的對應條目
整個系列
設計師的顏色理論,第一部分:顏色的含義
設計師的顏色論 第2部分:理解概念和術語
設計師的顏色論 第3部分:創建自己的調色板
卡梅隆·查普曼
卡梅隆·查普曼是一位專職的web和圖形設計師,擁有6年的工作經驗。她還寫了不少博客,其中包括它自己的個人博客Cameron Chapman On Writing。另外她也是《成名網路:成為網路紅人的實戰指南》一書的作者。
推薦閱讀:
※執業獸醫【考300 分】的複習資料之【寄生蟲學】【第一部分】
※西嶺雪探秘紅樓夢(第一部分) - 西嶺雪 - 虹橋書吧 - 虹橋門戶網
※十六觀智 (第一部分)
※情緒不好怎麼辦(書摘)第一部分
※劉東亮老師《易經》講座第一部分 (60)