寵物小精靈,設(shè)計(jì)寵物小精靈球主題圖標(biāo)

2022-12-26 11:10:50 來(lái)源/作者: / 己有:12人學(xué)習(xí)過(guò)

Pokemon Go最近十分流行,我們今天就來(lái)學(xué)習(xí)一下用PS設(shè)計(jì)一個(gè)寵物小精靈球主題UI圖標(biāo),教程講解十分詳細(xì),還提供了PSD文件參考,推薦學(xué)習(xí)。

作者 Webshocker 是通過(guò)3dsmax + Photoshop設(shè)計(jì)的這個(gè)作品,所以在光影的變化上非常微妙和細(xì)致。大家通過(guò)Photoshop臨摹這個(gè)作品,可以加強(qiáng)自己在設(shè)計(jì)過(guò)程中對(duì)光影的把控,建議學(xué)習(xí)。

作品作者:Webshocker

教程作者:@楊洋-XHM

最終效果:

寵物小精靈,設(shè)計(jì)寵物小精靈球主題圖標(biāo)
<點(diǎn)圖片看大圖>

PSD文件:http:///photoshop/sucai/2016/q18836.html

新建畫布:

寬:800px 高:600px 分辨率:150像素/英寸 名稱:精靈球

一、建立背景層

填充背景色:

點(diǎn)擊拾色器 輸入色值:#dad9de

寵物小精靈,設(shè)計(jì)寵物小精靈球主題圖標(biāo)
<點(diǎn)圖片看大圖>

確定主光源:

點(diǎn)擊拾色器 輸入色值:#ffffff

選擇畫筆工具 柔邊畫筆 大小700xp,在畫面右上角拍一下,給背景確定一個(gè)主光源。

寵物小精靈,設(shè)計(jì)寵物小精靈球主題圖標(biāo)
<點(diǎn)圖片看大圖>

賦予主光源顏色:

添加圖層樣式:顏色疊加 混合模式:正常 輸入色值:#f5f9ff 圖層模式:柔光

寵物小精靈,設(shè)計(jì)寵物小精靈球主題圖標(biāo)
<點(diǎn)圖片看大圖>

這樣基本上背景和主要的光源就確定了。

二、繪制精靈球底框

繪制底框:

點(diǎn)擊拾色器 輸入色值:#281f20 創(chuàng)建圓角矩形:寬:478px; 高:478px; 圓角:120px

寵物小精靈,設(shè)計(jì)寵物小精靈球主題圖標(biāo)
<點(diǎn)圖片看大圖>

給底框賦予厚度,制造體積感:

添加圖層樣式:斜面浮雕 樣式:內(nèi)斜面 方法:平滑 大小:4px 軟化:4px 角度:60° 高度:16° 高光:#8bb5dc 陰影:#000000

寵物小精靈,設(shè)計(jì)寵物小精靈球主題圖標(biāo)
<點(diǎn)圖片看大圖>

給底框賦予磨砂質(zhì)感:

將底框復(fù)制一層,命名為:底框-質(zhì)感 濾鏡雜色:1.5 平均/單色 高斯模糊:0.5

寵物小精靈,設(shè)計(jì)寵物小精靈球主題圖標(biāo)
<點(diǎn)圖片看大圖>

底框右側(cè)打光

之前我們?cè)谧霰尘暗臅r(shí)候,確定了一個(gè)主光源,所以我們?cè)诎训卓虻馁|(zhì)感做好以后,因?yàn)槭艿焦獾挠绊?,所以?yīng)該在右側(cè)用柔邊畫筆打一個(gè)光,增加變化。

新建圖層:側(cè)邊光 點(diǎn)擊拾色器 輸入色值:#ffffff

選擇畫筆工具 柔邊畫筆 大小500xp左右,在底框右側(cè)拍一下 改圖層模式為:柔光

最后右鍵 [側(cè)邊光] 圖層,創(chuàng)建一個(gè)剪貼蒙版,將光線限制在底框范圍內(nèi),這樣就簡(jiǎn)單的給底框右側(cè)打上了一層淡淡的光。

寵物小精靈,設(shè)計(jì)寵物小精靈球主題圖標(biāo)
<點(diǎn)圖片看大圖>

賦予側(cè)邊光顏色:因?yàn)橹霸O(shè)定的是偏藍(lán)的冷光源,所以在這里也會(huì)有所影響。

添加圖層樣式:顏色疊加 混合模式:柔光 輸入色值:#dfebfe 圖層模式:柔光

寵物小精靈,設(shè)計(jì)寵物小精靈球主題圖標(biāo)
<點(diǎn)圖片看大圖>

這樣精靈球的底框基本上就已經(jīng)完成了~!接下來(lái),我們就開(kāi)始繪制球體的部分。