Photoshop繪制卡通風格的APP圖標教程

更新:2017-10-31    編輯:侶倩    來源:原創投稿    人氣:加載中...    字號:|

標簽:Photoshop  教程  圖標  繪制  卡通  風格  百度搜索

先看看效果圖

Photoshop繪制卡通風格的APP圖標教程,破洛洛

1、新建畫布,尺寸512*512,分手率72ppi。用圓角矩形工具繪制一個圓角為90px的512*512的圓角矩形。給圓角矩形添加圖層樣式如圖。

Photoshop繪制卡通風格的APP圖標教程,破洛洛

2、用橢圓工具繪制顏色為#ffffff的8px正圓,并復制十余個,改變部分圓的透明度,達到圖a的效果。

Photoshop繪制卡通風格的APP圖標教程,破洛洛

1、分析出柱體的俯視圖,這樣更容易明白圖標中柱體應如何繪制。八芒星柱體的俯視圖如下,由兩個正方形組合而成。

Photoshop繪制卡通風格的APP圖標教程,破洛洛

2、根據俯視圖開始繪制柱體。仔細觀察圖a和圖b,發揮空間想象力,根據數字提示看看怎么由圖b得到圖c的。

Photoshop繪制卡通風格的APP圖標教程,破洛洛

新建70*150的矩形,得到圖c的矩形3。

新建50*150的矩形,自由變換斜切30°,,得到圖c的矩形2。

Photoshop繪制卡通風格的APP圖標教程,破洛洛

矩形5與矩形8受光程度不同,因此顏色不一。只要繪制出圖c的矩形2和矩形3,通過水平變換和移動位置就可以得到圖c。

3、用鋼筆工具沿著柱體頂點畫出部分八芒星,隨后添加圖層樣式漸變疊加,參考數值如下:

Photoshop繪制卡通風格的APP圖標教程,破洛洛

添加圖層蒙版擦除部分區域,實現近實遠虛的效果。

Photoshop繪制卡通風格的APP圖標教程,破洛洛

記得關閉第二步中的矩形1與矩形7的圖層顯示,八芒星中擦除過的部分不透明度降低,不關閉顯示則會影響八芒星的顏色效果。擦除效果接近圖d即可。

4、繪制八芒星描邊。按住鍵盤上的 Ctrl 鍵,鼠標單擊八芒星圖層的縮略圖得到選區。

Photoshop繪制卡通風格的APP圖標教程,破洛洛

得到八芒星的選區后,選中選框工具(快捷鍵M),在選區內單擊鼠標右鍵選擇“變換選區”。

Photoshop繪制卡通風格的APP圖標教程,破洛洛

選區變換大小如圖作參考

Photoshop繪制卡通風格的APP圖標教程,破洛洛

Photoshop繪制卡通風格的APP圖標教程,破洛洛

接著新建圖層,即可激活描邊選項。隨后添加圖層蒙版擦除部分區域。

Photoshop繪制卡通風格的APP圖標教程,破洛洛

以同樣的步驟繪制顏色為#82b3ff的2px描邊,以及16px的漸變描邊,漸變疊加參數如下圖。完成效果參考如圖e。

Photoshop繪制卡通風格的APP圖標教程,破洛洛

1、小艾達可拆分如圖:

Photoshop繪制卡通風格的APP圖標教程,破洛洛

① 用AI的形狀生成工具繪制而成

Photoshop繪制卡通風格的APP圖標教程,破洛洛

② 用布爾運算繪制而成

Photoshop繪制卡通風格的APP圖標教程,破洛洛

③ 由三角形和圓形組成的圓錐,添加錨點改變弧度而來

Photoshop繪制卡通風格的APP圖標教程,破洛洛

④ 復制一個部件③,添加漸變疊加(90°線性),用布爾運算繪制而成

Photoshop繪制卡通風格的APP圖標教程,破洛洛

⑤和⑥用鋼筆工具繪制而成,再加上影子,小艾達的繪制就完成了

Photoshop繪制卡通風格的APP圖標教程,破洛洛

2、蘿爾可拆分如圖

Photoshop繪制卡通風格的APP圖標教程,破洛洛

① 是添加了漸變疊加的82*82圓

Photoshop繪制卡通風格的APP圖標教程,破洛洛

②是添加了漸變疊加(90度線性)的60*60圓

Photoshop繪制卡通風格的APP圖標教程,破洛洛

③運用布爾運算

Photoshop繪制卡通風格的APP圖標教程,破洛洛

部件⑤領口部分要與部件④等寬。部件⑤用鋼筆工具繪制,添加了漸變疊加(圖f效果),并用畫筆工具畫了一層暗面增加立體感

Photoshop繪制卡通風格的APP圖標教程,破洛洛

⑥是鋼筆工具畫輪廓,維持與艾達的手弧度一致,畫筆工具畫陰影

Photoshop繪制卡通風格的APP圖標教程,破洛洛

⑦運用布爾運算繪制出襠部,運用鋼筆工具繪制腿與腳

Photoshop繪制卡通風格的APP圖標教程,破洛洛

完成以上步驟最終后果

Photoshop繪制卡通風格的APP圖標教程,破洛洛

堅持到這里并成功繪制的同學都超棒的!一步步跟著分析、拆分圖標中的元素,練習了鋼筆工具以及布爾運算,再看看以下用到相似元素的圖標,是不是有種豁然開朗的感到呢?歡迎留言提問,期待你提交的作業。

 

評論列表(網友評論僅供網友表達個人看法,并不表明本站同意其觀點或證實其描述)

站點導航

您可能在找這些
黑龙江快乐十分走势图