色优久久AV区日,好吊色网站,国产最新福利视频大全

人氣超高的漸變色系列教程終于更新啦！這個(gè)系列文章的厲害在于，把大多數(shù)新手認(rèn)為的色彩搭配靠靈感，全部用科學(xué)系統(tǒng)的方法歸納闡述，讓你的配色不再是隨便挑選，而且案例豐富，淺顯易懂。今天的主題是教你用漸變色繪制高格調(diào)的背景+球體，強(qiáng)烈推薦！

一、基礎(chǔ)復(fù)習(xí)/練習(xí)

講在最前面 → 在上篇有部分的讀者反應(yīng)不知道到底1/5區(qū)間是什么東西，該如何把它從檢色器上面打開來做參考？NoNoNo，1/5區(qū)間其實(shí)是一種感覺 → 小弟在選色的時(shí)候都會(huì)在腦海里將檢色器切分成25個(gè)區(qū)塊，就如同下圖一樣：

以上圖為例，在選擇漸層顏色變化時(shí)就會(huì)在下圖1/5的紅色框框區(qū)間內(nèi)選擇：

蛤（一言不合），一定只能這么少喔？其實(shí)在設(shè)計(jì)上面并沒有一定要怎么做，只要你爽，然后業(yè)主買單就好，但小弟建議您最多最多維持在2/5的區(qū)間就好，如果再往外進(jìn)行調(diào)整的話 → 想必您已經(jīng)開始發(fā)現(xiàn)顏色差異增加，甚至因?yàn)榛译A的影響，開始導(dǎo)致漸層出現(xiàn)變臟的狀況，在后面會(huì)看到這樣的范例說明。

練習(xí)一

首先我們先從一個(gè)結(jié)合類似色以及色階變化的練習(xí)開始 → 這個(gè)練習(xí)只是一個(gè)相當(dāng)常見的波浪漸層圖樣（廣泛運(yùn)用在UI/視覺設(shè)計(jì)當(dāng)中）：不同的漸層區(qū)塊搭配了透明度的變化以及正確的選色來做出一種干凈（上篇的重點(diǎn)），好像很厲害（每一篇的重點(diǎn)xD）的圖像視覺。

練習(xí)1

選擇顏色

選擇顏色是做出干凈漸層最重要的一個(gè)步驟。下圖是我在（練習(xí)1）里面所使用的五種漸層組合，每一種組合都有微調(diào)色相來讓顏色的變化更為細(xì)致→ 記住盡可能不要跟我使用相同的顏色來做練習(xí)喔！

（1）-（5）運(yùn)用到的其實(shí)都是上一篇提到類似色漸層中 → ?高明度色系漸層的變化，復(fù)習(xí)一下”確保明度與彩度的調(diào)整都保持在檢色器的上方1/5內(nèi)”的基本法則。先看看第（1）組的漸層用色，是不是完全符合這樣的調(diào)整區(qū)間？在微幅調(diào)整彩度/明度的情況下，進(jìn)行色相的左右移動(dòng)，最后選擇與藍(lán)色（#7BD2F8）相當(dāng)接近的藍(lán)綠色（#72E8CE）作為漸層起點(diǎn)/終點(diǎn)：

再來看看第（3）組的漸層用色，在完全沒有調(diào)整色相的情況下，我將彩度的變化向左調(diào)整了約1/5個(gè)區(qū)間來作為這一組的漸層選色。

講到這里可能有很多人會(huì)疑惑為什么要限制選擇的范圍？彩度的差異更多難道不好嗎？我個(gè)人認(rèn)為設(shè)計(jì)上面其實(shí)是沒有絕對(duì)的，讓我們來簡(jiǎn)單看一下如果把彩度拉高的效果會(huì)是怎么樣：

其實(shí)除了最下方最大彩度差異的搭配之外，其余兩種都在可接受的范圍之內(nèi)，在我看來甚至可以說是相當(dāng)不錯(cuò)的選擇，看您使用上面的需求→ 不過因?yàn)檫@次練習(xí)的目標(biāo)是要組合出干凈/剔透而且不跟其他顏色沖突的漸層圖像，因此在這邊我還是會(huì)確保彩度/明度的差異都在檢色器的1/5區(qū)間里面，藉此避免當(dāng)顏色重迭時(shí)灰階會(huì)持續(xù)的累積 → 導(dǎo)致最終整體顏色過重或是視覺效果變臟。

步驟

在選色完成之后，就會(huì)是一層一層往上迭加啰！

使用（2）的顏色做出第一層，透明度30%。

使用（3）的顏色做出第二層，透明度40%。

使用（4）的顏色做出第三層，透明度40%。

使用（5）的顏色做出第四層，透明度40%。

使用（1）的顏色做出第五層，透明度30%，這層漸層角度差異較大的原因是我想試著做出更多的融合感覺，也非常建議各位伙伴嘗試使用不同的漸層角度來玩玩看產(chǎn)生的效果喔。

做到這邊大家應(yīng)該發(fā)現(xiàn)怎么顏色好像都融在一起分不太清楚？跟上面的范例似乎不太一樣 → 最后這一步是相當(dāng)重要的一步，為了讓重迭的類似色漸層能更明顯的產(chǎn)生區(qū)隔，我在每一個(gè)漸層區(qū)塊上面加了內(nèi)陰影，舉第一層與第二層的應(yīng)用為例：

沒有內(nèi)陰影

有內(nèi)陰影

雖然變化不大，但是不是能夠發(fā)現(xiàn)有內(nèi)陰影的版本其實(shí)立體感更強(qiáng)，同時(shí)也能拉開與同色系漸層區(qū)塊的差距。而內(nèi)陰影的選色其實(shí)非常簡(jiǎn)單，運(yùn)用的還是同樣的一個(gè)小技巧 →選擇本身的顏色往右下角稍微加深一些（1/5之內(nèi)），作為你使用的內(nèi)陰影顏色即可。

附上兩個(gè)用相同原理調(diào)色的Demo→ 所以就別照著調(diào)色啦，自己配一個(gè)。

登愣！！練習(xí)1就完成啰。

練習(xí)二

接下來我們?cè)賮砜匆幌律掀膶W(xué)習(xí)目標(biāo)應(yīng)該要如何制作。

注：這邊只會(huì)帶您進(jìn)行右邊的練習(xí)，左邊的部分請(qǐng)?jiān)趨㈤啠ㄉ希┢笞孕羞\(yùn)用想象力產(chǎn)出。

Step 1. 選擇顏色

選擇顏色是做出干凈漸層最重要的一步 ← 復(fù)制貼上。同樣不唬爛的選色模式（下圖），保持彩度明度在檢色器一定的區(qū)間之內(nèi)進(jìn)行調(diào)整，利用這樣的限制來有效抑制大幅度調(diào)整色相的不協(xié)調(diào)性，這樣子的用色使得圖層在作為背景的同時(shí)也呈現(xiàn)了較強(qiáng)烈的漸層變化感。

Step 2.制作底部基座

運(yùn)用上淺下灰的漸層，搭配底部的陰影就能夠輕易地制作出具有立體感的圓弧底部基座。（忘記請(qǐng)復(fù)習(xí)上篇）

Tips. 大部分在使用的陰影的時(shí)候請(qǐng)不要傻傻地選了一個(gè)黑色搭配透明度，這樣子的陰影通常會(huì)！很！臟！除非要刻意強(qiáng)調(diào)陰影的對(duì)比效果，請(qǐng)盡量選用底色加深的顏色（往右下移動(dòng)移動(dòng)在移動(dòng)）作為陰影色。（ex.制作紙雕類的立體模型時(shí)有可能會(huì)為了強(qiáng)調(diào)陰影 → 使用純黑或是深灰色作為陰影喔）。

Step 3. 制作凹陷區(qū)

運(yùn)用上灰下淺的漸層，搭配內(nèi)陰影就能夠輕易地制作出具有凹陷感的按壓區(qū)。（忘記請(qǐng)復(fù)習(xí)上篇）

Tips. 小細(xì)節(jié)補(bǔ)充 → 一般在制作凹陷的區(qū)塊時(shí)，我通常會(huì)在區(qū)塊底部加上白色的陰影（模糊=0）來做出反光的效果讓整體更有細(xì)節(jié)。

Step 4. 打光與填上文字

在下圖中紅色框起來的圓形當(dāng)中，我運(yùn)用了白 → 灰黑的漸層，利用覆蓋（Overlay）的混色模式（覆蓋（Overlay）的混色模式會(huì)讓圖層白色的部分去加亮底色，圖層深色的部分去加暗底色），搭配透明度的效果做出光從右上照過來的光感。最后搭配符合整體色調(diào)（#36D9E7）的細(xì)黑體（Helvetica Neue-Thin）文字（如果在這個(gè)作品中使用新細(xì)明體或是華康少女體我一定會(huì)揍你）來完成這個(gè)練習(xí)。

登愣！！練習(xí)2也完成啰。

二、球型（放射狀）漸層變化

相信很多像我一樣剛?cè)腴T的人每次再看見那么多種漸層類型時(shí)多少都會(huì)有些疑惑，上一篇已經(jīng)講完許多基本的運(yùn)用方式，相信各位對(duì)于各種漸層類型應(yīng)該沒有那么恐懼啰。那我們接下來就開始看看球型（放射狀）漸層變化到底可以拿來做什么吧！

一般來說小弟我最常運(yùn)用放射狀漸層來處理 → 補(bǔ)光，球體，光暈這三種狀況。小弟之前設(shè)計(jì)的icon也算是運(yùn)用放射狀漸層的概念xD。

那么接下來我們就依序來聊聊它們的應(yīng)用場(chǎng)景：

補(bǔ)光

補(bǔ)光這樣的技巧通常會(huì)被運(yùn)用在真實(shí)感較強(qiáng)的物體上面 → 這邊我們用上篇最后所Demo的蛋黃來做教學(xué)。

Step 1. 底部基座

相信以各位練習(xí)到現(xiàn)在的能力，要做出底下這樣的icon，由純色（#FEA740）搭配基本白 → 灰漸層基底的樣式應(yīng)該已經(jīng)是輕而易舉啰？！如果還不行 → 請(qǐng)回去復(fù)習(xí)之前的內(nèi)容。

Step 2. 精華

一切的精華就在這神奇的一步，我們現(xiàn)來看看想象中的光源相對(duì)于荷包蛋的位置應(yīng)該是長(zhǎng)什么樣子：

由上圖可以知道，荷包蛋的另外一端（右側(cè)）應(yīng)該會(huì)比左側(cè)（光源直接照射）來的暗，利用放射狀漸層 → 模擬光由光源的聚焦點(diǎn)（最亮點(diǎn)）然后往外逐漸變暗散去的效果，就可以做出最重要的補(bǔ)光特性啰。

Step 3. 加強(qiáng)視覺效果

加上外陰影（#D3CBB7 透明度：50%），這邊選擇是跟蛋黃顏色較接近的顏色作為陰影 →可以把他想象成蛋黃映射在蛋白產(chǎn)生的反光結(jié)合陰影產(chǎn)生的顏色。

Step 4. 凸顯光源點(diǎn)

最后 → 為了更凸顯光源的聚焦點(diǎn)，我在這里額外加了一個(gè)橘白色區(qū)塊（左圖）搭配高斯模糊來增強(qiáng)光源效果，成果為右圖。

球體

類型一

球體可以說是放射狀漸層最最常見的應(yīng)用 → 就跟下圖一樣簡(jiǎn)單：

Tips：在這邊為了讓球體的效果更加強(qiáng)烈 →我們可以加一點(diǎn)內(nèi)陰影進(jìn)來（稍微亮一點(diǎn)點(diǎn)來模擬底部地板產(chǎn)生的反光）以凸顯球體本身的三維效果。（os.看起來怎么好像都一樣XD）

類型二

讓我們稍微進(jìn)階一點(diǎn)，開始嘗試看看不一樣的球體感覺 →首先先拉出如下圖的底色漸層：

接下來我們嘗試運(yùn)用放射狀漸層（#F8EFDD，中心透明度100% →最外側(cè)透明度0%）來填上左上角的光：

最后我們對(duì)光源使用高斯模糊來解決界線過于清晰的問題：

講到這里，相信各位讀者應(yīng)該也發(fā)現(xiàn)到 →放射狀的漸層其實(shí)非常適合拿來模擬”有弧度”的光源，畢竟在自然界當(dāng)中幾乎不存在任何剛剛好垂直的線性漸層，絕大部分的物體都是有弧度或是有形體變化的。

光暈

類型一

舉個(gè)最簡(jiǎn)單的例子 → 有一顆太陽在發(fā)光，他的光會(huì)隨著距離越來越弱..吧xD?所以在畫一顆簡(jiǎn)單有著散射光的太陽時(shí)，理論上應(yīng)該要利用放射狀漸層拉出下面的效果。（漸層的頭跟尾都填上#FFCF0A，只是頭的透明度是80%而尾的透明度是0% →藉此模擬光向外發(fā)散的效果。）