IT培訓-高端面授IT培訓機構
          云和教育:云和數據集團高端IT職業教育品牌
          • 國家級
            全民數字素養與技能培訓基地
          • 河南省
            第一批產教融合型企業建設培育單位
          • 鄭州市
            數字技能人才(碼農)培養評價聯盟
          當前位置:
          首頁IT問答正文

          如何用Sketch簡單地做一款擬物圖標

          • 發布時間:
            2022-11-25
          • 版權所有:
            云和教育
          • 分享:

          擬物化圖標基本上使用生活中原有的物象來反映產品的功能,同時圖標的內部加入更多的寫實細節,比如色彩、3D效果、陰影、透視效果,甚至一些簡單的物理效果,使得用戶認知時一目了然,視覺刺激強烈,大大提高辨識程度。

          今天小編就帶著大家一起學習如何使用Sketch軟件來繪制擬物圖標,打開軟件一起操練起來吧!

          Step1:創建畫板+圖標背景

          1. 快捷鍵A,創建畫布400*300,背景顏色為漸變(#82D7FF—# 3D8DFF)。

          2. 快捷鍵U,繪制一個152*152白色圓角矩形,圓角為32。

          1.png

          Step2:制作圖標背景質感+圖標陰影

          1. 添加三層陰影,這樣會顯得外陰影更加自然,關于這三層陰影的X,Y,模糊度,透明度的數值分別為(0,2,2,24%)、(0,4,14,%24)、(0,10,16,34%)。

          2. 添加內陰影數值為(0,-5,6,%90),色值為87B8FF。

          2.png

          Step3:制作圖標內部細節

          3.png

          1. 快捷鍵O,創建一個半徑128的圓型,填充漸變顏色,具體色值下圖可見。

          2. 復制當前圓型,改變其半徑為116, 與底層圓形進行減去頂層。

          3. 內部填充其半徑為124的圓形,顏色為#078EFF。

          4. 制作其圓形陰影,創建一個半徑144的原型,顏色填充漸變色(# FFFFFF—#80A8FF),并且進行高斯模糊,模糊度為3。

          Step4:制作圖標頂部細節

          4.png

          1. 快捷鍵O,創建一個半徑58的內部圓型,內部填充為,添加兩層內陰影。

          5.png

          2. 在內部添加一個直徑為48的圓形,顏色填充為漸變。

          3. 添加內部圓形的陰影,其數值參考其下圖。

          6.png

          一款簡單的擬物圖標做好啦,是不是超簡單!