音樂圖標(biāo),設(shè)計音樂主題UI圖標(biāo)教程(4)
本篇UI教程跟分享了如何設(shè)計簡單的音樂主題圖標(biāo),制作方法不難,只是步驟有點多,大家跟著教程一起練習(xí)吧。
最終效果:
老規(guī)矩,先來分析一下。這里我們主要分為二個部分:底座、內(nèi)圓、其它問題都不大,主要是內(nèi)圓部分、需要用到多個圖層及圖層樣式,來表現(xiàn)圖標(biāo)的立體感,騷年分析完已經(jīng)成功一半了,離成功還會遠么,噢耶。!
步驟一:
首先新建畫布1000px*1000px畫布,命名為音樂圖標(biāo),為背景填充顏色#475479,并添加雜色。
步驟二:
我們最先來繪制底座吧,使用圓角矩形工具、繪制一個650px*650px圓角半徑90px的底座,并為它添加圖層樣式。
步驟三:
高逼格的底座一下就出來了,有木有。!繼續(xù)繪制一個620px*620px圓角半徑90px的底座,并為它添加圖層樣式。
步驟四:
現(xiàn)在繪制一下底座的金屬拉絲效果吧,繼續(xù)繪制一個620px*620px圓角半徑90px的形狀,添加雜色效果并執(zhí)行動感模糊命令,調(diào)整不透明度。
步驟五:
我們來繪制一下內(nèi)部圓吧,選擇橢圓工具繪制一個470px*470px的正圓,并為它添加圖層樣式。
步驟六:
繼續(xù)使用橢圓工具、繪制一個425px*425px的正圓,并為它添加圖層樣式。
步驟七:
現(xiàn)在繪制一下內(nèi)圓的金屬拉絲效果吧,繪制一個425px*425px的正圓,添加雜色效果并執(zhí)行動感模糊命令,調(diào)整不透明度,操作同上。
步驟八:
現(xiàn)在我們來繪制一下音樂圖標(biāo)吧,選擇自動以形狀工具,繪制一個145px*260px的形狀并為它添加圖層樣式。
步驟九:
就剩高光部分了哦,選擇繪制兩個大小為420px的正圓,將填充設(shè)置為0,添加圖層樣式吧。
本次音樂圖標(biāo)設(shè)計教程就到此結(jié)束,雖然教程步驟有點多了,但相對詳細,大家跟著做應(yīng)該能做出來。大家也可以修改一下主題,嘗試設(shè)計其他主題的圖標(biāo),做出來歡迎投稿分享一下,給大家學(xué)習(xí)。
- 相關(guān)教程
- TA的教程
- 收藏
- 返回
- ui設(shè)計
- ps網(wǎng)頁設(shè)計
- 音樂圖標(biāo)
- 全棧UI筆記
- ui制作
學(xué)習(xí) · 提示
相關(guān)教程
- UI圖標(biāo)教程,用PS繪制一個獨特的漸變風(fēng)格播放器圖標(biāo)
- UI圖標(biāo)教程,用PS制作一個音樂圖標(biāo)
- 圖標(biāo)設(shè)計,用PS繪制索尼PSP圖標(biāo)
- UI圖標(biāo)教程,在PS中繪制一枚炫酷的鐘表圖標(biāo)
- UI圖標(biāo)教程,用ps制作浪漫的冰晶圖標(biāo)
- 圖標(biāo)制作,用PS繪制一款簡約風(fēng)格的解密游戲圖標(biāo)
- 插畫制作,用PS繪制簡約沙漏插畫效果圖片
- 圖案設(shè)計,用PS快速制作一個心形圖案
- 手機圖標(biāo),用PS繪制華為手機圖標(biāo)
- 相機圖標(biāo),用UI制作簡單的彩虹相機圖標(biāo)