水滴圖標(biāo)，水滴主題UI圖標(biāo)

2022-12-26 11:10:48 來(lái)源/作者： / 己有：8人學(xué)習(xí)過(guò)
制作擬物感水滴效果圖標(biāo)，制作方法很簡(jiǎn)單，設(shè)置好底座顏色后，添加上樹(shù)葉素材和畫(huà)上水滴即可完成。

先看看效果：

水滴圖標(biāo)，水滴主題UI圖標(biāo)
<點(diǎn)圖片看大圖>

第一步：繪制圖標(biāo)底座形狀，這里給的是300*300，圓角度數(shù)為20。

水滴圖標(biāo)，水滴主題UI圖標(biāo)

第二步，給底座填充一個(gè)從深綠色到淺綠色的漸變。

水滴圖標(biāo)，水滴主題UI圖標(biāo)

第三步：使用圖層樣式頂部添加淺色，內(nèi)陰影。

水滴圖標(biāo)，水滴主題UI圖標(biāo)

第四步：使用圖層樣式底部添加投影。

水滴圖標(biāo)，水滴主題UI圖標(biāo)

第五步：剪切蒙版放入一張合適的樹(shù)葉，混合模式給疊加，不透明度給70%。

水滴圖標(biāo)，水滴主題UI圖標(biāo)

第六步：畫(huà)幾個(gè)亮黃色的圓，屬性給較大一點(diǎn)的羽化，剪切入底座，打造光斑效果。

水滴圖標(biāo)，水滴主題UI圖標(biāo)

最后兩步，也是比較重要的步驟：

第七步：用橢圓繪制出水滴的形狀。分別給內(nèi)發(fā)光，徑向漸變，投影打造水滴效果。

水滴圖標(biāo)，水滴主題UI圖標(biāo)
<點(diǎn)圖片看大圖>

第8步：和上一步用相似的方法，繪制出水滴上的光感效果，透明度給20%。

水滴圖標(biāo)，水滴主題UI圖標(biāo)

各圖層參考用：

水滴圖標(biāo)，水滴主題UI圖標(biāo)