色彩創(chuàng)造更專業(yè)效果

什么能讓一個(gè)設(shè)計(jì)看上去是協(xié)調(diào)的,要有條理的專業(yè)的知識(shí)，還要有”色彩”，才能讓設(shè)計(jì)創(chuàng)造更專業(yè)的視覺(jué)效果！.

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

色彩是最難辦的設(shè)計(jì)元素.“好”的色彩是像個(gè)人口味和感覺(jué)一樣難以把握的,而且還有諸如對(duì)比度,顯示器校準(zhǔn)等技術(shù)上的限制因素.

但是對(duì)于內(nèi)容來(lái)說(shuō),色彩是至關(guān)重要的.如果你認(rèn)為一個(gè)網(wǎng)站很重要,值得花時(shí)間來(lái)完善,那么用戶通常也會(huì)認(rèn)為它很重要,會(huì)花時(shí)間來(lái)讀.選擇好的色彩就是為了達(dá)到這種效果.

在本文中,我們會(huì)回顧一些用來(lái)給你的Web設(shè)計(jì)建立漂亮的調(diào)色板的技術(shù). 如果想讓網(wǎng)站看上去是沒(méi)有條理(unplanned)的,最好的辦法就是隨機(jī)選擇顏色.

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

跟印刷制品一樣,色彩會(huì)影響人們對(duì)所見(jiàn)到的信息的理解.

找到合適的色彩并不容易,但是整體過(guò)程還是有跡可循的.

好的設(shè)計(jì)策略會(huì)包含一個(gè)配色方案(比如為了傳達(dá)信息和營(yíng)造氛圍,色彩的可選范圍.)以及這個(gè)方案的具體安排.

讓我們假設(shè)你需要設(shè)計(jì)一個(gè)專業(yè)的網(wǎng)站.(當(dāng)然這個(gè)很有可能演變成一種喝酒游戲(drinking game):要嗎是客戶要求網(wǎng)站是”專業(yè)的”,”簡(jiǎn)潔的”或者”現(xiàn)代的”,要嗎就是”我喜歡這個(gè)網(wǎng)站,扒下來(lái).”)

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

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

一個(gè)”專業(yè)”的設(shè)計(jì)會(huì)讓用戶覺(jué)得,這個(gè)網(wǎng)站是很?chē)?yán)肅正規(guī)的展示它的主題,即便主題可能是很輕松的.無(wú)論哪種色相(hue)還是色值(value),“專業(yè)”都意味著是協(xié)調(diào)的,有條理的,經(jīng)過(guò)深思熟慮的.

使用灰度

與色彩工作的最好方式就是從沒(méi)有色彩開(kāi)始.

將設(shè)計(jì)中的色彩移除之后可以暴露出問(wèn)題的根本原因,而這些問(wèn)題在開(kāi)始考慮哪種黃綠色的色度(深淺)更好看之前就該去解決.如果設(shè)計(jì)在黑白效果下就感覺(jué)不好,那就需要做一些改變了.

每個(gè)頁(yè)面是否都有清晰的目標(biāo)?設(shè)計(jì)是否能引導(dǎo)讀者讀完全部的內(nèi)容?內(nèi)容是引人入勝的,鼓舞人心的還是客觀的傳遞信息?標(biāo)題清晰嗎?文字鏈?zhǔn)欠衽c其他文字有對(duì)比?色彩可以加強(qiáng)這些效果,但是布局,樣式和組織中的問(wèn)題都無(wú)法單純的通過(guò)色彩就能夠解決.

如果要重新設(shè)計(jì),請(qǐng)先去掉顏色.這個(gè)簡(jiǎn)單的去色行為真實(shí)的展示出網(wǎng)站的立足點(diǎn).(事實(shí)上,重新設(shè)計(jì)應(yīng)該開(kāi)始于重新評(píng)估你的目標(biāo)和內(nèi)容,不過(guò)這是另外一個(gè)故事了.)

有時(shí),去掉色彩本身就是一種解決方案.

我曾經(jīng)跟一個(gè)網(wǎng)站設(shè)計(jì)公司一起工作,重新設(shè)計(jì)他們的網(wǎng)站.對(duì)于這個(gè)項(xiàng)目,他們是很挑剔的,希望能更好.但是如果你認(rèn)為為你自己設(shè)計(jì)很難,試著與小組一起解決.在項(xiàng)目結(jié)束前,下班后我們之中的三個(gè)人一邊喝著酒一邊看著第九稿設(shè)計(jì).

我突然的把photoshop的圖層都合并,然后點(diǎn)擊”去色”把紫銅色和藍(lán)色的設(shè)計(jì)稿變成黑白色.讓每個(gè)人都驚訝是,它起作用了.

那周結(jié)束之前,我們用紅色強(qiáng)化后完成了一個(gè)”暖”灰色的設(shè)計(jì).當(dāng)先前的客戶開(kāi)始贊賞這個(gè)新的設(shè)計(jì)并且接到更多其他的客戶電話時(shí),我們知道我們成功了.

用Photoshop的斜視濾鏡來(lái)測(cè)試你的配色方案.

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

每個(gè)截圖都復(fù)制一下背景圖層

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

使用圖像->修改->色調(diào)分離.使用8到12之間,或者使用濾鏡->像素化->馬賽克.使用15到30像素

這樣可以看到真正的主色調(diào).整個(gè)配色方案,用的越多的顏色,那個(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ò)的地方.

不協(xié)調(diào)的色相可以很容易的K掉一個(gè)配色方案.一個(gè)設(shè)計(jì)可以用一種色相的上百種不同深淺的顏色,從蠟筆到霓虹燈,看上去仍然是有條理的.但是如果色相使用錯(cuò)誤的方式混合在一起,整個(gè)配色方案就會(huì)混亂了.

避免不協(xié)調(diào)色相的一種辦法就是使用第三色來(lái)分隔.黑色,灰色或者白色的緩沖區(qū)是最安全的,因?yàn)榛疑凳侵行陨?你可以把黑色,白色,灰色與彩虹中任何部分混合在一起并且很協(xié)調(diào).

第二種方案是不同的色相使用不同的比例.如果配色方案中有紫色和棕色,那么設(shè)計(jì)中可以包含很多深棕色,并且加入一些明亮的紫色來(lái)點(diǎn)綴.

另一個(gè)可選方案是更改色值.純藍(lán)色和亮青色是很一般的組合,但是深藍(lán)色(海藍(lán)色)和靛青色(天藍(lán)色)可以通過(guò)足夠的對(duì)比來(lái)彼此襯托.紅色和紫色差異夠大,但不會(huì)沖突,同時(shí)又足夠接近而不像是刻意為之.淺紅色(粉色)和深紫色可以提供對(duì)比.

遺憾的是,避免錯(cuò)誤的顏色組合與選擇好的顏色無(wú)法劃等號(hào).如果你滿意了,但是你的用戶感覺(jué)不舒服,那就不是一個(gè)成功的配色方案.

發(fā)現(xiàn)優(yōu)秀的配色方案

優(yōu)秀的配色是從哪來(lái)的?有上百種顏色和上千種組合,怎么選擇?

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

我最近做的一個(gè)由8個(gè)頁(yè)面組成的網(wǎng)站,頂部被一個(gè)精心制作的金屬架貫穿,與之相對(duì)比的是深藍(lán)色的天空.使用Photoshop的吸管工具,定成5*5的尺寸,我選取了天空的最深和最淺的部分,并應(yīng)用到邊欄,鏈接,標(biāo)題,頁(yè)腳,同時(shí)調(diào)整了色度.

當(dāng)客戶問(wèn)我們是如何把網(wǎng)站設(shè)計(jì)的這么好,并且這么快,我們回應(yīng)說(shuō)”這才是我們?cè)撟龅摹?但是實(shí)際上顏色就在那,我只是找到它.(譯者注: 很有陸游的”文章本天成,妙手偶得之”的風(fēng)采啊…)

對(duì)于吸引目標(biāo)用戶的顏色,他們平時(shí)穿的衣服是一個(gè)優(yōu)秀的指示器.看看你的用戶穿的什么,你會(huì)知道什么顏色能讓他們覺(jué)得舒服.如果你的網(wǎng)站是關(guān)于,描述體育聯(lián)盟的,想想他們比賽時(shí)穿的衣服,這要比他們平時(shí)工作時(shí)的好.

如果你幸運(yùn)的得到目標(biāo)用戶的照片,一并看看.你需要得到這群人的中間色(average).但是如果照片無(wú)法利用,那么去購(gòu)物吧.

商業(yè)界的服裝設(shè)計(jì)師對(duì)于每種心情和生活方式都有優(yōu)秀的色彩感.當(dāng)然不用跟第五大道上的高級(jí)時(shí)裝一樣.通過(guò)google搜索“camping stores,” “baby clothes,” “ski and swimwear”和“casual living”會(huì)找到很多很好的色彩組合.

人們會(huì)根據(jù)他們的品味穿衣服.如果你使用他們喜歡的顏色,在你的網(wǎng)站上他們會(huì)覺(jué)得更舒服.

使用紋理

通過(guò)微小的改變色相,飽和度和色值來(lái)制作紋理.

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

簡(jiǎn)單而特別的紋理背景很容易建立:

給內(nèi)墻(interior wall)照個(gè)像或者其他一些光禿禿的但是感覺(jué)粗糙的東西.

本文來(lái)源于成都網(wǎng)站建設(shè)公司與成都網(wǎng)站設(shè)計(jì)制作公司-創(chuàng)新互聯(lián)成都公司！

當(dāng)前文章：色彩創(chuàng)造更專業(yè)效果
文章出自：http://www.bm7419.com/news49/315349.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供App開(kāi)發(fā)、品牌網(wǎng)站設(shè)計(jì)、微信小程序、網(wǎng)站改版、網(wǎng)站設(shè)計(jì)公司、云服務(wù)器

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)