MENU 服務(wù) 案例
網(wǎng)站建設(shè)-網(wǎng)站設(shè)計(jì)-北京網(wǎng)站建設(shè)-高端網(wǎng)站制作公司-尚品中國
我們通過擁抱變化創(chuàng)造
360°的品牌價(jià)值__
簡體
簡體中文 English

尚品簽約辰欣藥業(yè)股份有限公司官網(wǎng)建設(shè)

類型:尚品動(dòng)態(tài) 了解更多

如何在網(wǎng)站UI設(shè)計(jì)中處理顏色?

來源:尚品中國| 類型:網(wǎng)站百科| 時(shí)間:2018-06-06
法則篇
60-30-10法則 
這是一個(gè)室內(nèi)設(shè)計(jì)領(lǐng)域中永不過時(shí)的裝飾技巧,它可以輕松地幫助你完成一個(gè)網(wǎng)站設(shè)計(jì)配色方案。60%+30%+10%的比例分配是為了平衡顏色。這個(gè)公式妙在它營造了一種平衡感,使眼睛可以舒適地從一個(gè)焦點(diǎn)移動(dòng)到另一個(gè)焦點(diǎn)。同時(shí),它也運(yùn)用起來非常簡單。
60%是主色調(diào),30%是輔助色,10%是強(qiáng)調(diào)色。 
 
關(guān)注顏色的含義
幾個(gè)世紀(jì)以來,科學(xué)家一直在研究顏色的情感效應(yīng)。除了創(chuàng)造美學(xué),顏色也是情感和聯(lián)想的創(chuàng)造者。顏色的含義會(huì)根據(jù)文化和情況而有所不同。這就是為什么你會(huì)看到黑白色的時(shí)裝店。因?yàn)樗麄兿胍憩F(xiàn)得優(yōu)雅和高級。
紅色:激情、愛、危險(xiǎn)
藍(lán)色:冷靜、負(fù)責(zé)、安全
黑色:神秘、優(yōu)雅、邪惡
白色:純潔、安靜、干凈
綠色:新鮮、清新、自然
我們習(xí)慣在設(shè)計(jì)階段的早期就開始調(diào)整顏色和色調(diào)。但是,當(dāng)你意識到自己花了3個(gè)小時(shí)來調(diào)整主色調(diào)的時(shí)候,你發(fā)現(xiàn)這種行為毫無幫助。雖然把玩顏色很有吸引力,但是你應(yīng)該避免在設(shè)計(jì)初期進(jìn)行這種行為。
相反地,你應(yīng)該強(qiáng)迫自己專注調(diào)整間距和布局元素。這種布局的約束是非常有效的,它會(huì)為你節(jié)省很多時(shí)間。調(diào)整間距和布局元素并不是那么無聊。如果你想表達(dá)不一樣的東西,嘗試使用不同的色調(diào)即可。 
 
遠(yuǎn)離純灰色和純黑色
多年來,我學(xué)到的一個(gè)最重要的顏色技巧之一就是避免使用不帶色調(diào)的灰色。在現(xiàn)實(shí)生活中,純灰色幾乎是不存在的。黑色也是同樣的道理。(沒錯(cuò),事實(shí)上就是要五彩斑斕的黑)
在這張圖片中最深的顏色不純黑,而是#0A0A10
記得給你的顏色添加一些色調(diào)。用戶會(huì)下意識地覺得這類顏色更加自然和熟悉。
 
相信自然
最佳的色彩組合來自于大自然。它們總是看起來非常天然。根據(jù)自然環(huán)境來尋找設(shè)計(jì)方案的好處是可以擁有無數(shù)的色板,因?yàn)榇笞匀坏念伾偸窃谧兓?。
我們只需要看看周圍,就能獲取靈感。
 
保持對比度
有的顏色和某些顏色搭配協(xié)調(diào),和另一些顏色則會(huì)產(chǎn)生沖突。通過色輪,可以很好地觀察到顏色相互作用的規(guī)則。你應(yīng)該清楚地了解這個(gè)方法,但是不一樣要親手去做。
 
獲得靈感
當(dāng)我們談到UI參考的時(shí)候,Dribbble是一個(gè)很好的選擇。Dribbble也有顏色搜索工具。所以,如果你想要針對某個(gè)特定的顏色進(jìn)行視覺研究,
可以前往以下網(wǎng)址:dribbble.com/colors
視頻、印刷設(shè)計(jì)、室內(nèi)設(shè)計(jì)、時(shí)尚……有很多的啟發(fā)靈感的事物。要對各種形式的色板保持靈敏的感覺,并且把看起來有趣的所有東西存下來。我會(huì)從韓流的視頻短片中獲取顏色靈感
 
工具篇
為了節(jié)省大家時(shí)間,下面整理了一些2017年非常好用的色板工具。它們會(huì)為你節(jié)省大量的時(shí)間。我最喜歡的顏色選擇工具。你可以簡單地鎖定顏色,并按住空格鍵生成色板。Coolors.co還支持上傳圖片,從圖片中提取色板。Coolors.co酷在,你不僅僅有一個(gè)結(jié)果,相反地,你可以通過選擇器,調(diào)整你的顏色,獲得很多配色方案。
鏈接(無需翻墻):https://coolors.co/
 
Kuler
這款來自Adobe的工具已經(jīng)陪伴我們很長時(shí)間了。它可以在瀏覽器或桌面應(yīng)用中使用。如果你使用的是桌面應(yīng)用程序,那你可以將配色方案導(dǎo)出到Photoshop中。
鏈接(無需翻墻):https://color.adobe.com/zh/create/color-wheel/
 
Paletton
它和前面一款工具Kuler相似。不同之處是,它不限于5種色調(diào)。當(dāng)你已經(jīng)確定主色調(diào),想要調(diào)整輔助色的時(shí)候,這是一款很棒的工具。
鏈接(需翻墻):http://paletton.com/
 
Shutterstock Lab Spectrum
你可能會(huì)問:如果我想用我選擇的顏色搜索圖片呢?那么,Shutterstock旗下有款叫作Spectrum的工具可以滿足你的需求,你可以通過特定的色調(diào)搜索圖片。你甚至不需要稱為會(huì)員,因?yàn)榧词故菐〉男☆A(yù)覽圖片已經(jīng)足以生成色板。
來源聲明:本文章系尚品中國編輯原創(chuàng)或采編整理,如需轉(zhuǎn)載請注明來自尚品中國。以上內(nèi)容部分(包含圖片、文字)來源于網(wǎng)絡(luò),如有侵權(quán),請及時(shí)與本站聯(lián)系(010-60259772)。
TAG標(biāo)簽:

如果您的網(wǎng)站可以增加轉(zhuǎn)化次數(shù)并提高客戶滿意度,該怎么辦?

預(yù)約專業(yè)咨詢顧問溝通!

*尚品專業(yè)顧問將盡快與您聯(lián)系

免責(zé)聲明

非常感謝您訪問我們的網(wǎng)站。在您使用本網(wǎng)站之前,請您仔細(xì)閱讀本聲明的所有條款。

1、本站部分內(nèi)容來源自網(wǎng)絡(luò),涉及到的部分文章和圖片版權(quán)屬于原作者,本站轉(zhuǎn)載僅供大家學(xué)習(xí)和交流,切勿用于任何商業(yè)活動(dòng)。

2、本站不承擔(dān)用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。

3、本聲明未涉及的問題參見國家有關(guān)法律法規(guī),當(dāng)本聲明與國家法律法規(guī)沖突時(shí),以國家法律法規(guī)為準(zhǔn)。

4、如果侵害了您的合法權(quán)益,請您及時(shí)與我們,我們會(huì)在第一時(shí)間刪除相關(guān)內(nèi)容!

聯(lián)系方式:010-60259772
電子郵件:394588593@qq.com

現(xiàn)在就與專業(yè)咨詢顧問溝通!

  • 全國服務(wù)熱線

    400-700-4979

  • 北京服務(wù)熱線

    010-60259772

信息保護(hù)中請放心填寫
在線咨詢

免責(zé)聲明

非常感謝您訪問我們的網(wǎng)站。在您使用本網(wǎng)站之前,請您仔細(xì)閱讀本聲明的所有條款。

1、本站部分內(nèi)容來源自網(wǎng)絡(luò),涉及到的部分文章和圖片版權(quán)屬于原作者,本站轉(zhuǎn)載僅供大家學(xué)習(xí)和交流,切勿用于任何商業(yè)活動(dòng)。

2、本站不承擔(dān)用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。

3、本聲明未涉及的問題參見國家有關(guān)法律法規(guī),當(dāng)本聲明與國家法律法規(guī)沖突時(shí),以國家法律法規(guī)為準(zhǔn)。

4、如果侵害了您的合法權(quán)益,請您及時(shí)與我們,我們會(huì)在第一時(shí)間刪除相關(guān)內(nèi)容!

聯(lián)系方式:010-60259772
電子郵件:394588593@qq.com