UI系列-如何統一圖標風格？

1.圓角

無論是面形圖標還是線形圖標，圓角最能決定它們的氣質。

大圓角風格的圖標造型圓潤，給人活潑可愛的感覺。

例：iOS的設計語言是圓角矩形，因此在iOS系統應用中的功能圖標都具有圓角這一元素。

小圓角或趨向直角風格的圖標造型簡潔，給人穩重直接的感覺。

例：Material design 中定義了一種小圓角圖標的設計風格。

2.斷線

線形圖標本身自帶線框描邊這一統一元素，通常它們是封閉路徑，而在此基礎上又延伸出了一種新的變體，即斷線風格。

在線形圖標的局部進行斷開，呈現一種開放的路徑。

斷線圖標是由一根線條扭曲而成，這種精心處理過的風格又比單純的線形圖標更具有設計感。

繪製斷線風格的圖標需注意斷線的位置，不可隨意截斷，而是要根據圖標的造型結構針對性的處理。

通常選擇圖標的角落作為斷線的位置，無論如何也不要破壞圖標原本的造型，使得圖標的識別性變弱。

3.統一元素

在圖標的構造中使用某種統一的元素，能直接體現出一致性來。

例：Google Play 的家族圖標高度一致，全新的子品牌圖標設計使用母品牌的三角形作為統一的外形和背景，使得無論何種外形的圖標都保持一致的視覺風格。

統一的元素不是隨意設計的，既要提升圖標的設計感，又要符合產品的定位。

例：阿里健康的整套圖標都繪製了一個可愛的笑臉符號。與產品屬性契合，因此給用戶帶來非常深刻的記憶點。

4.品牌基因

通過品牌Logo的視覺元素來延續圖標的設計

可以給用戶帶來由外而內的一致感。

例：優酷 功能圖標運用其品牌的紅藍主色作為填充色，藍色填充主體結構，紅色填充局部結構，並將紅藍色進行疊加，使得圖標風格獨樹一幟，具有非常鮮明的記憶點和識別性。

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！