UI教程,快速設計一個IOS應用圖標(2)
步驟 4:給圓形添加圖層樣式
給形狀圖層添加描邊、陰影和漸變等圖層樣式。
添加漸變
圓的漸變比較簡單,漸變色值為#ffffff和#d9d9d9。
漸變樣式選擇徑向漸變。要讓圓的中心呈現(xiàn)些許亮色,從圓心到邊緣有一個白色到淺灰色的漸變,縮放比例設置為150%。
添加描邊
圓的描邊要加粗,描邊位置選擇內部,描邊大小的參考數(shù)值為30px,填充類型選擇漸變。
漸變所用顏色比圖標的背景漸變色要亮一些。起始色值和終止色值分別為#d1e4e8和#a9deeb,漸變角度設置為-45度,呈現(xiàn)出由頂部的淺藍色到底部的深藍色漸變效果。
添加內陰影
這里的內陰影其實是白色高光,你也可以使用內發(fā)光樣式。將混合選項設置為正常,距離設置為0。將大小設置為70。
(注:此處原文為 140px,但是與截圖上的參數(shù)不符,所以譯者暫時將參數(shù)改為70px)
添加投影
最后給這個圓添加投影,讓描邊看上去更清晰,也可以讓整個圓在藍色背景下看的也很明顯。把陰影的透明度設置為10%,
距離設置為0,將大小設置的稍微大一點,我的參考數(shù)值是55。
效果如下圖所示:
步驟5:添加鉛筆圖標
我們在上一步的基礎上添加一枚圖標,我選的是鉛筆圖標。你可以在Sliceberry或者the Noun Project搜索你想要的圖標。由于我們制作的圖標是1024*1024規(guī)格的,
所以一定要選大圖標。
如果你也想用鉛筆圖標,可以從the Noun Project下載,作者是Molly Bramlet,下載鏈接:https://thenounproject.com/term/pencil/16973/
將該圖標導入你的PSD文件并調整大小。如果你用的鉛筆圖標跟我用的一樣大,需要將其縮小到原來的1/2。你可以利用iOS模板把該圖標控制在內圓的范圍之內。
為了讓該圖標垂直于水平線,需要將其旋轉62.32度。按下COMMAND(MAC用戶)或者CRTL(Windows用戶)鍵的同時按下T鍵,
在頂部緊挨著小三角形圖標的窗口中輸入數(shù)值62.32。(你也可以跳過旋轉圖標這一步驟)
學習 · 提示
相關教程