配色弱的同學必看!跟大自然學配色(自定義色板教程)

當我們開始設計的時候,其實可以在生活中或者漂亮的照片中找配色方案
譬如我們這里要制作一張與秋天元素相關的海報或者賀卡的時候。
你腦海中會想起什么呢?

有沒有想過從攝影師鏡頭里的秋天中吸取顏色制作成色板,從而解決配色問題呢?
好咯,本篇文章將會給你演示一下這樣的案例。

相關配色網站推薦,相信很多同學也都知道,相當不錯的工具類站點:http://colrd.com/

本教程講解色板如何自定義。我喜歡在平時生活中拍照,將照片里搭配良好的顏色采集下來自制成色板以便后續使用。如果照片色調不好怎么辦?木關系,來看看這篇《PS修圖小教程!漂亮色調一秒調出來》,分分鐘變高達上唷!

下面這張照片就是我要用來采集顏色的源照片,我想創建一個名為"Autumn Leaves"的顏色樣本集。

配色弱的同學必看!跟大自然學配色(自定義色板教程)

Step 1:在photoshop色板面板中刪掉多余的色板

為了更好地采集顏色,我們需要首先刪除多余的色板。不要擔心色板被永久刪除,因為ps的默認色板是可以隨時還原的。

配色弱的同學必看!跟大自然學配色(自定義色板教程)

不幸的是ps沒有一鍵刪除色板的選項。怎么辦呢?需要一個一個刪除。按住Alt (Win) /Option (Mac)鍵鼠標一個個左擊顏色就可以了。

下圖是刪除完顏色時的色板面板:

配色弱的同學必看!跟大自然學配色(自定義色板教程)

Step2:吸管工具

打開要制作色板的照片,然后選中吸管工具(I):

配色弱的同學必看!跟大自然學配色(自定義色板教程)

Step3:吸取第一個顏色

使用吸管工具在照片上吸取你的第一個顏色:

現在你可以看到前景色變成了你所吸取的顏色:

配色弱的同學必看!跟大自然學配色(自定義色板教程)

提示:在吸取顏色的過程中,你可以按住鼠標左鍵然后在照片上移動鼠標,這樣子前景色會不斷顯示鼠標所經之地的顏色。如此更可以方便地吸取到你真正需要的顏色。

Step4:添加顏色到色板中

吸取完顏色后,鼠標移到顏色面板,這時圖標會自動變成油漆桶的標志,隨便在該區域點擊一下即彈出添加色板的彈窗,編輯好名稱"Yellow",點擊確定。

配色弱的同學必看!跟大自然學配色(自定義色板教程)

下圖就是添加顏色后的色板面板的狀況了。大多數情況下你不需要刻意為每個顏色命名,因為你一看就知道是什么顏色。所以上面的那一步你完全可以就按著軟件默認的顏色命名來。

配色弱的同學必看!跟大自然學配色(自定義色板教程)

Step5:重復上面的第3步和第4步,直到添加完所有的顏色:

配色弱的同學必看!跟大自然學配色(自定義色板教程)

Step6:把這組顏色集合添加為一個專門的顏色樣本:

現在你需要存儲色板啦!如下所示,在色板面板的右上角點擊向右的按鈕,選中"存儲色板",在彈出的窗口中命名好色板的名字,點擊保存即可。

配色弱的同學必看!跟大自然學配色(自定義色板教程)
 
配色弱的同學必看!跟大自然學配色(自定義色板教程)
 
配色弱的同學必看!跟大自然學配色(自定義色板教程)

Step7:重置默認色板

哎呀呀,制作好新的顏色樣本,現在咱們就得趕緊歡迎默認色板回來啦!這一次呢,還是在色板面板的右上角點擊向右的按鈕,不過選中的是"復位色板":

配色弱的同學必看!跟大自然學配色(自定義色板教程)

這個時候彈出的這個對話框可能會嚇到你,該怎么選擇呢?直接OK之!

配色弱的同學必看!跟大自然學配色(自定義色板教程)

就這么愉快地復位了色板…

配色弱的同學必看!跟大自然學配色(自定義色板教程)

Step8:載入制作好的色板

拿,上面復位了色板,辛辛苦苦制作的顏色樣本哪里去了?!沒事兒,需要使用的時候,載入之替換掉默認色板!還是在色板面板的右上角點擊向右的按鈕,不過選中的是"替換色板",在彈出框中選中剛才制作好的色板,出現的彈窗依然直接點擊OK就可以了。

配色弱的同學必看!跟大自然學配色(自定義色板教程)
 
配色弱的同學必看!跟大自然學配色(自定義色板教程)

這個時候默認色板就被這個色板給替換了:

配色弱的同學必看!跟大自然學配色(自定義色板教程)

選中色板中一個顏色作為新的前景色:

鼠標點擊色板上的任一顏色,前景色就會改成被選中的顏色:

配色弱的同學必看!跟大自然學配色(自定義色板教程)
 
配色弱的同學必看!跟大自然學配色(自定義色板教程)

選中色板中一個顏色作為新的背景色:

只要按住Ctrl(Win)/Command(Mac)鍵,鼠標左擊色板上的任一顏色,背景色就會改成被選中的顏色:

配色弱的同學必看!跟大自然學配色(自定義色板教程)
 
配色弱的同學必看!跟大自然學配色(自定義色板教程)

下面我們就可以拿著這套色板應用在設計中了。下圖是一個設計例子,感受下:

配色弱的同學必看!跟大自然學配色(自定義色板教程)

希望本教程對你有幫助 :)

另外優設微博也曾推薦過更多colrd網站上的配色成熟案例,當時有同學全部打包了!回顧地址:http://weibo.com/1773655610/yeaWDaNJz

【午夜干貨:520枚超贊配色卡打包】當別人在漫無目的挑選配色方案時,你卻慵懶地享受著溫暖陽光,做著更好的構思。讀懂這些卡片,會教你更懂生活的色彩。設計網頁時確定好目標,按著實物色卡模擬,絕對讓你的頁面大氣專業。

原文地址:photoshopessentials
優設網翻譯:@寫說說
本文由優設網uisdc.com原創翻譯,轉摘請注明優設網譯文出處,謝謝各位小編。

【優設網 原創文章 投稿郵箱:2650232288@qq.com】
 
================關于優設網================
"優設網uisdc.com"是一個分享網頁設計、無線端設計以及PS教程的干貨網站。
【特色推薦】
設計師需要讀的100本書:史上最全的設計師圖書導航:http://hao.uisdc.com/book/
設計微博:擁有粉絲量66萬的人氣微博@優秀網頁設計 ,歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航:全球頂尖設計網站推薦,設計師必備導航:http://hao.uisdc.com
———————————————————–
想在手機上、被窩里獲取設計教程、經驗分享和各種意想不到的"福利"嗎?
添加 優秀網頁設計 微信號:【youshege】優設哥的全拼
您也可以通過掃描下方二維碼快速添加:

配色弱的同學必看!跟大自然學配色(自定義色板教程)
 

收藏 9
點贊 2

復制本文鏈接 文章為作者獨立觀點不代表優設網立場,未經允許不得轉載。