設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

2019-11-08 16:13:22 來(lái)源/作者: 互聯(lián)網(wǎng) / 中峰 己有:1771人學(xué)習(xí)過(guò)

在開(kāi)始制作之前呢,首先確定好自己要做的內(nèi)容有哪些,大致的一個(gè)風(fēng)格。然后去尋找參考,看看其他作者如何在作品中將自己的想法展現(xiàn)出來(lái)。這里我選擇相機(jī)、天氣、日歷、相冊(cè)、設(shè)置、信息、視頻和地圖。

內(nèi)容和風(fēng)格確定了,參考也找的的差不多了,對(duì)于自己要做的東西有一個(gè)比較清晰的思路之后,先在草圖上將自己大致的想法畫(huà)出來(lái),然后才用軟件將想法構(gòu)建完善。這里做的幾個(gè)圖標(biāo)都是比較簡(jiǎn)單的,基本上可以用圖層樣式來(lái)實(shí)現(xiàn)所有的效果。

因?yàn)槭菙M物風(fēng)格,所以在圖標(biāo)制作的過(guò)程當(dāng)中,要注意體積和光影的表達(dá)。通過(guò)顏色的選擇、相似的裝飾元素使整體風(fēng)格看起來(lái)更加統(tǒng)一和諧。

先看看效果圖

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

教程步驟

草圖

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

一、相機(jī)圖標(biāo)

步驟 01 建立文檔并制作背景

新建文檔,大小2000x800px,分辨率72;新建圖層,命名背景,填充前景色#d6d6dd

步驟 02 制作底座

新建300x300px的圓角矩形,圓角半徑60px,命名底座,添加圖層樣式制造體積感

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

步驟 03 制作鏡頭外圓

新建228x228px的圓形,命名【外圓1】,添加圖層樣式

復(fù)制外圓1,修改大小190x19px,命名【外圓2】,添加圖層樣式

將外圓1,外圓2編組命名【外圓】

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程

 

 

步驟 04 鏡頭內(nèi)部

新建大小162×162 px的圓形,命名【內(nèi)圓1】

復(fù)制3個(gè),大小分別修改為130x130px、90x90px、56x56px

分別命名為【內(nèi)圓2】、【內(nèi)圓3】、【內(nèi)圓4】

再按順序添加以下圖層樣式

設(shè)計(jì)立體擬物風(fēng)格APP圖標(biāo)的PS實(shí)例教程