今天跟大家分享一下做圖標(biāo)，以及注意的一些事

首先做一套圖標(biāo)，我們先要定個(gè)主題和風(fēng)格。

然后圖標(biāo)的原則要清楚明白，那有哪些呢？

1 識(shí)別性      2 一致性      3 兼容性      4 差異性

識(shí)別：讓人一眼看出是什么，準(zhǔn)確表達(dá)其中含義

一致：顏色、風(fēng)格、大小、漸變，透明度，透視角度、風(fēng)格等

兼容：圖標(biāo)在不同環(huán)境都清晰可見

差異：每個(gè)圖標(biāo)都有明顯的特征

主題：給愛的人最好的禮物

接下來我們一起練起來吧，一個(gè)字干。

拆分下，也就圓底+鬧鐘圓框+指針+臺(tái)座+耳朵響鈴

詳細(xì)步驟如下：

【1】畫一個(gè)正圓90*90px，135°橙色漸變，注意顏色跨度不宜太大

【2】復(fù)制一層，縮小90%左右，往下對(duì)齊屬性—蒙版—羽化6像素，這樣就做好彌散陰影了

【3】畫一點(diǎn)點(diǎn)90°漸變的圓，大小46*46，然后畫指針在圓里減去兩個(gè)圓角矩形，用直線畫一個(gè)4*8px像素圓角矩形斜45°的底座然后復(fù)制，水平翻轉(zhuǎn)，放圓兩邊建組垂直居中對(duì)齊

【4】加兩個(gè)圓形的耳朵放在后面，露出三分之一左右，然后整體90°投影大小

2像素透明度調(diào)至60%

拆分下，就是圓角矩形+心形裹胸+矩形裙擺

詳細(xì)步驟如下

【1】畫一個(gè)正圓90*90px，135°玫紅色漸變，同樣的注意顏色跨度不宜太大

【2】復(fù)制一層，縮小90%左右，往下對(duì)齊屬性—蒙版—羽化6像素，這樣就做好彌散陰影了

【3】畫兩個(gè)圓角矩形，大小4*8px,然后畫一個(gè)心型(一個(gè)正方形加兩個(gè)同等大小圓形組合在一起合并，旋轉(zhuǎn)-45°）再用矩形減去下面的。做完整個(gè)如果太鼓了，心型可以左右壓縮1px

【4】加矩形，調(diào)整下面裙擺，然后用多個(gè)排列好的小圓減去做出裙擺效果，最后編組做輕微的漸變，然后加2px透明度30%陰影

細(xì)節(jié)要慢慢的，耐心的做好，比如顏色漸變的跨度每一種顏色明度都適中，漸變的角度統(tǒng)一，圓角大小統(tǒng)一，鏤空的大小一致（視具體情況分析）我們做帶有原本色彩的彌散陰影，里面投影大小距離透明度。顏色都相對(duì)應(yīng)。出來的圖標(biāo)大小跟底有個(gè)呼吸感，0.618的黃金比例。例如90px大圓，那你的圖標(biāo)應(yīng)該在54px左右，然后視覺修正，接近正方形要縮小，圓形適中，矩形要超出一點(diǎn)范圍，視具體情況而定，完整一套就出來了。

以上數(shù)值作參考，做的不好多多包涵，其他圖標(biāo)同上步驟就不一一制作了。大家一起練習(xí)起來吧

總結(jié)：1 大小統(tǒng)一，呼吸感，用規(guī)則圖形去加減

2 漸變用色不能跨度太大

3 彌散陰影用羽化或者高斯模糊

4 圖標(biāo)面性用一點(diǎn)點(diǎn)漸變，增加細(xì)節(jié)

5 圖標(biāo)線條，圓角，鏤空尺寸統(tǒng)一

6 給向下2像素有色投影，透明度給30%

7 顏色要考慮圖標(biāo)的含義，特性，用途，環(huán)境