UI教程,快速設(shè)計(jì)一個(gè)IOS應(yīng)用圖標(biāo)
開(kāi)始前,請(qǐng)先準(zhǔn)備一個(gè)iOS 應(yīng)用圖標(biāo)模板,可以從iOS Icon Template或者App IconTemplate下載(我用的就是后者的素材)。
我的電腦屏幕上只顯示了 1024px 的大圖標(biāo),我覺(jué)得用這個(gè)模板做參考就可以了。
你可以將應(yīng)用圖標(biāo)模板進(jìn)行裁剪,只保留 1024px 的圖標(biāo),或者處理模板上的其余元素。
下面我們正式開(kāi)始。
步驟 1:創(chuàng)建 iOS應(yīng)用圖標(biāo)的基本形狀
首先新建一個(gè)圖層并填充背景色,參考色值是#acced6。
接下來(lái),給顏色圖層添加蒙版,使其呈現(xiàn)圖標(biāo)的輪廓。技術(shù)上來(lái)講這一步可要可不要,因?yàn)樯蟼鲌D片之后,蘋果官方會(huì)自動(dòng)幫你切成圓角。
不過(guò),為了呈現(xiàn)更好的視覺(jué)效果,我建議使用蒙版。
怎么操作呢?按住COMMAND(MAC 用戶)或者CTRL(Windows 用戶)鍵的同時(shí)點(diǎn)擊圖標(biāo)模板圖層,顏色圖層就會(huì)出現(xiàn)一個(gè)選區(qū)啦。
再在圖層面板的底部點(diǎn)擊蒙版圖標(biāo),就可以創(chuàng)建蒙版了。
步驟 2:添加漸變色
在顏色圖層點(diǎn)擊鼠標(biāo)右鍵,在彈出的菜單中選擇混合選項(xiàng)。我們來(lái)給它加一個(gè)弱漸變。漸變的起始和終止色值分別為#acced6和#7cbece。
漸變樣式選擇線性漸變,角度設(shè)置為135度,呈現(xiàn)出由左上角的深藍(lán)色到右下角的淺藍(lán)色漸變效果。
如果這兩種顏色順序搞顛倒了,調(diào)整角度為 -135 度或者 315 度就行了。
步驟 3:創(chuàng)建內(nèi)圓
圖標(biāo)中部的白色圓形是整個(gè)圖標(biāo)設(shè)計(jì)的重要組成部分,我們可以利用iOS圖標(biāo)柵格畫(huà)一個(gè)圓:使用橢圓工具(U)創(chuàng)建一個(gè)寬高為 890px 的正圓,
在屬性面板中可以調(diào)整它的大小以便與柵格對(duì)齊。
標(biāo)簽(TAG) UI設(shè)計(jì)教程 翻譯教程 ps網(wǎng)頁(yè)設(shè)計(jì) 應(yīng)用圖標(biāo) UI教程 IOS圖標(biāo)