風扇圖標,設計擬物風扇主題UI圖標教程

2022-12-26 11:10:30 來源/作者: / 己有:14人學習過

步驟六:

整理圖層面板:

風扇圖標,設計擬物風扇主題UI圖標教程
<點圖片看大圖>

溫馨提示:做到這里,【機身組】的內容已經完成了。你們可以通過上圖的圖層面板,命名、 整理、 分類你的圖層,這是一個很重要的好習慣,它能讓你更有效率的進行工作。

步驟七:

制作電扇【扇頁】:

溫馨提示:用圓角矩形工具 (U)來做,大小比例自己定。該圖層命名為【扇頁】,顏色填充#ffffff

風扇圖標,設計擬物風扇主題UI圖標教程
<點圖片看大圖>

分解圖:

風扇圖標,設計擬物風扇主題UI圖標教程
<點圖片看大圖>

賦予【扇頁】光感,制造體積感:

溫馨提示:扇葉的基本型做好以后,依次添加<內陰影><漸變疊加><投影>三個樣式,并根據光線,給扇葉添加一個光影效果。

風扇圖標,設計擬物風扇主題UI圖標教程
<點圖片看大圖>
圖層樣式:內陰影 模式:正片疊底 顏色:#ede2d9 不透明度:75% 角度:90° 距離:1px圖層樣式:漸變疊加 模式:正常 樣式:徑向 顏色:#cfd1d5 ~ #e6e2de 角度:90° 縮放:127%圖層樣式:投影 模式:正常 顏色:#814f23 不透明度:25% 角度:105° 距離:9px

風扇圖標,設計擬物風扇主題UI圖標教程
<點圖片看大圖>

制造【扇頁】暗部:

溫馨提示:我們根據光線給扇葉推導出扇葉的大致光影效果,用鋼筆工具(P)鉤出陰影。

鋼筆工具不會用的同學,戳→ 【Ps基礎-鋼筆工具】

風扇圖標,設計擬物風扇主題UI圖標教程
<點圖片看大圖>

扇葉陰影主要分為上面四個部分。我們圖層命名為【扇葉陰影1~4】顏色任意填充,然后依次調整它的設置和效果。

風扇圖標,設計擬物風扇主題UI圖標教程
<點圖片看大圖>

整理圖層面板:

溫馨提示:最后把整個扇葉部分的圖層所有組成一個群組,并在該群組上面添加一個蒙版,蓋掉下方多余的投影。

蒙版不會用的同學,戳→【Ps基礎-蒙版】

風扇圖標,設計擬物風扇主題UI圖標教程
<點圖片看大圖>