是什么能讓一個(gè)規(guī)劃看上去是和諧的,有條理的,專業(yè)的?答案是”色彩”.

不是所有的項(xiàng)目都要用那種淺的”公司藍(lán)”(corporate blue)才會(huì)看上去很專業(yè).色彩規(guī)劃(planning color)便是樹立一個(gè)描繪有哪些色彩能夠用以及如何運(yùn)用的框架.

色彩是難辦的規(guī)劃元素.“好”的色彩是像個(gè)人口味和感覺相同難以把握的,而且還有比方比照度,顯示器校準(zhǔn)等技能上的約束因素.

可是關(guān)于內(nèi)容來(lái)說(shuō),色彩是至關(guān)重要的.假如你以為一個(gè)網(wǎng)站很重要,值得花時(shí)間來(lái)完善,那么用戶一般也會(huì)以為它很重要,會(huì)花時(shí)間來(lái)讀.挑選好的色彩便是為了達(dá)到這種作用.

在本文中,咱們會(huì)回顧一些用來(lái)給你的Web規(guī)劃樹立美麗的調(diào)色板的技能.

假如想讓網(wǎng)站看上去是沒(méi)有條理(unplanned)的,好的方法便是隨機(jī)挑選色彩.

即使當(dāng)用戶第一次瀏覽網(wǎng)站的主頁(yè)時(shí),色彩也會(huì)影響到他們關(guān)于內(nèi)容的情緒.這個(gè)網(wǎng)站會(huì)讓人興奮嗎? 可信嗎?大膽嗎(daring)?乏味嗎?有政治傾向?很正式的嗎?

跟印刷制品相同,色彩會(huì)影響人們對(duì)所見到的信息的了解.

找到合適的色彩并不容易,可是整體進(jìn)程仍是有跡可循的.

好的規(guī)劃戰(zhàn)略會(huì)包括一個(gè)配色計(jì)劃(比方為了傳達(dá)信息和營(yíng)造氛圍,色彩的可選規(guī)模.)以及這個(gè)計(jì)劃的具體安排.

讓咱們假設(shè)你需求規(guī)劃一個(gè)專業(yè)的網(wǎng)站.(當(dāng)然這個(gè)很有或許演變成一種喝酒游戲(drinking game):要嗎是客戶要求網(wǎng)站是”專業(yè)的”,”簡(jiǎn)練的”或許”現(xiàn)代的”,要嗎便是”我喜愛這個(gè)網(wǎng)站,扒下來(lái).”)

配色計(jì)劃取決于網(wǎng)站的特點(diǎn).比方,銀行和花店的網(wǎng)站看上去都會(huì)很專業(yè).

可是人們或許不會(huì)喜愛在一個(gè)”公司藍(lán)”或銀灰色的網(wǎng)站買花.或許幻想一下美國(guó)銀行的網(wǎng)站變成紫色和黃綠色.

一個(gè)”專業(yè)”的規(guī)劃會(huì)讓用戶覺得,這個(gè)網(wǎng)站是很嚴(yán)厲正規(guī)的展現(xiàn)它的主題,即便主題或許是很輕松的.不管哪種色相(hue)仍是色值(value),“專業(yè)”都意味著是和諧的,有條理的,經(jīng)過(guò)深思熟慮的.

運(yùn)用灰度

與色彩作業(yè)的好方式便是從沒(méi)有色彩開端.

將規(guī)劃中的色彩移除之后能夠露出出問(wèn)題的根本原因,而這些問(wèn)題在開端考慮哪種黃綠色的色度(深淺)更美觀之前就該去處理.假如規(guī)劃在是非作用下就感覺不好,那就需求做一些改動(dòng)了.

每個(gè)頁(yè)面是否都有明晰的方針?規(guī)劃是否能引導(dǎo)讀者讀完全部的內(nèi)容?內(nèi)容是引人入勝的,鼓舞人心的仍是客觀的傳遞信息?標(biāo)題明晰嗎?文字鏈?zhǔn)欠衽c其他文字有比照?色彩能夠加強(qiáng)這些作用,可是布局,款式和安排中的問(wèn)題都無(wú)法單純的經(jīng)過(guò)色彩就能夠處理.

假如要從頭規(guī)劃,請(qǐng)先去掉色彩.這個(gè)簡(jiǎn)略的去色行為實(shí)在的展現(xiàn)出網(wǎng)站的立足點(diǎn).(事實(shí)上,從頭規(guī)劃應(yīng)該開端于從頭評(píng)估你的方針和內(nèi)容,不過(guò)這是別的一個(gè)故事了.)

有時(shí),去掉色彩本身便是一種處理計(jì)劃.

用Photoshop的斜視濾鏡來(lái)測(cè)試你的配色計(jì)劃.

用網(wǎng)站至少三個(gè)頁(yè)面做截圖.在Photoshop中翻開

每個(gè)截圖都仿制一下布景圖層

給新的圖層做一下10px左右的高斯模糊

運(yùn)用圖像->修正->色彩別離.運(yùn)用8到12之間,或許運(yùn)用濾鏡->像素化->馬賽克.運(yùn)用15到30像素

這樣能夠看到真正的主色彩.整個(gè)配色計(jì)劃,用的越多的色彩,那個(gè)色彩在用戶的印象中越重.

曾經(jīng)網(wǎng)站的布局和安排過(guò)去都沒(méi)有色彩,現(xiàn)在是時(shí)分來(lái)選一個(gè)調(diào)色板了.可是選哪個(gè)?用多少?

調(diào)整你的色相

色彩具有三個(gè)屬性:色相,飽和度,色值(有時(shí)會(huì)叫做明度)(譯者注: 想深化了解的話能夠讀這個(gè):關(guān)于色彩的基本理論)

飽和度是色彩有多濃:霓虹燈作用的色彩便是飽和度很高,而蠟筆的色彩便是飽和度低一些.

色值表明了色彩有多亮(比方,與黑色或許白色有多接近)

色相決定了色彩歸于彩虹的哪個(gè)部分,比方赤色或許綠色;這個(gè)便是人們?nèi)菀壮鲥e(cuò)的當(dāng)?shù)?

不和諧的色相能夠很容易的K掉一個(gè)配色計(jì)劃.一個(gè)規(guī)劃能夠用一種色相的上百種不同深淺的色彩,從蠟筆到霓虹燈,看上去仍然是有條理的.可是假如色相運(yùn)用過(guò)錯(cuò)的方式混合在一同,整個(gè)配色計(jì)劃就會(huì)混亂了.

防止不和諧色相的一種方法便是運(yùn)用第三色來(lái)分隔.黑色,灰色或許白色的緩沖區(qū)是安全的,因?yàn)榛疑�系是中性色�?你能夠把黑色,白色,灰色與彩虹中任何部分混合在一同而且很和諧.

第二種計(jì)劃是不同的色相運(yùn)用不同的比例.假如配色計(jì)劃中有紫色和棕色,那么規(guī)劃中能夠包括許多深棕色,而且參加一些明亮的紫色來(lái)裝點(diǎn).

另一個(gè)可選計(jì)劃是更改色值.純藍(lán)色和亮青色是很一般的組合,可是深藍(lán)色(海藍(lán)色)和靛青色(天藍(lán)色)能夠經(jīng)過(guò)滿足的比照來(lái)互相烘托.赤色和紫色差異夠大,但不會(huì)沖突,一起又滿足接近而不像是刻意為之.淺赤色(粉色)和深紫色能夠供給比照.

惋惜的是,防止過(guò)錯(cuò)的色彩組合與挑選好的色彩無(wú)法劃等號(hào).假如你滿足了,可是你的用戶感覺不舒暢,那就不是一個(gè)成功的配色計(jì)劃.

發(fā)現(xiàn)優(yōu)異的配色計(jì)劃

優(yōu)異的配色是從哪來(lái)的?有上百種色彩和上千種組合,怎樣挑選?

小的靜態(tài)網(wǎng)站的規(guī)劃師應(yīng)該從內(nèi)容取色.一般是經(jīng)過(guò)相片.

關(guān)于吸引方針用戶的色彩,他們平時(shí)穿的衣服是一個(gè)優(yōu)異的指示器.看看你的用戶穿的什么,你會(huì)知道什么色彩能讓他們覺得舒暢.假如你的網(wǎng)站是關(guān)于,描繪體育聯(lián)盟的,想想他們比賽時(shí)穿的衣服,這要比他們平時(shí)作業(yè)時(shí)的好.

假如你幸運(yùn)的得到方針用戶的照片,一并看看.你需求得到這群人的中間色(average).可是假如照片無(wú)法利用,那么去購(gòu)物吧.

商業(yè)界的服裝規(guī)劃師關(guān)于每種心境和生活方式都有優(yōu)異的色彩感.當(dāng)然不用跟第五大道上的高級(jí)時(shí)裝相同.經(jīng)過(guò)google查找“camping stores,” “baby clothes,” “ski and swimwear”和“casual living”會(huì)找到許多很好的色彩組合.

人們會(huì)依據(jù)他們的品嘗穿衣服.假如你運(yùn)用他們喜愛的色彩,在你的網(wǎng)站上他們會(huì)覺得更舒暢.

運(yùn)用紋路

經(jīng)過(guò)微小的改動(dòng)色相,飽和度和色值來(lái)制造紋路.

單色紋路(比方,只有一種色相的紋路)和圖案毫無(wú)沖突的給大部分網(wǎng)站供給了奇妙的維度.

簡(jiǎn)略而特別的紋路布景很容易樹立:

給內(nèi)墻(interior wall)照個(gè)像或許其他一些光溜溜的可是感覺粗糙的東西.