<li id="g3zqm"></li>
2021-4-7 之晨
不知道大家有沒有被說過，設計做的不精致？拿圖標舉例，其實不精致的原因就是統一性沒做好。我們總說做圖標要統一，但是到底要統一哪些要素？有沒有一個完整的自檢表呢？以前我總結了 5 到 6 個要統一的要素，最近觀察大家的練習之后，直接擴增到 9 個了，今天就以線形圖標為例，看看我們需要統一哪 9 個要素。
大綱如下：
這個很容易理解，就是一組圖標看起來大小是一致的。但是最近發現了一個比較重要的點，就是很多同學做一組練習，相鄰的圖標都差不太多，但是隔的比較遠的圖標放在一起就差很多了，比如下面這幾個圖標，就是逐漸變大的：
所以對于大小統一，我們必須要做到，一組圖標里，任意兩個圖標拿出來都是大小統一的，否則就是不及格。
保持大小統一的方法見這篇 – 圖標設計規范。
圓角統一也是比較好理解的點，無非就是圓角大小，像下面這兩個圖標：
如果圓角差很多，你很容易發現，因為都是差不多大小的矩形，但是我們很容易忽略一些細節，比如下面第一個圖標的三角形，和旁邊的日歷相比，就過于尖銳：
這是圖標里面很細的細節，所以容易被忽視，大家一定要重視。
語言統一你可以理解為設計風格統一，如果一組圖標里面出現了多種風格，那會顯得非常不專業。
比如下面這組練習：
大體看好像是一種語言，但仔細觀察其實還是有很多細節不統一的，比如外輪廓上面有的有白色，有的沒有，白色還分帶描邊和不帶描邊：
這就是在語言上不統一的案例，大家在做練習的時候，一定要想清楚你的語言是什么。
粗細統一就不用說了吧，基本就是用在線性圖標線條粗的，比如像這種比較明顯的粗細不一致，就不應該出現了：
這都是最最基礎的問題。
疏密統一其實是很多新人朋友容易犯的錯，比如下面這一組圖標：
大部分地方是比較透氣疏松的，但是只有第二個比較密集，這樣就會讓人感覺比較突兀，整體不夠和諧。這就是疏密程度的統一性，一定要把握住節奏感，否則就會不舒服。
這個點一般用在斷線圖標上，也就是你開口大小的統一性，比如一個開很大，一個開很小：
那就證明細節沒有做到位。
比例可以分很多種，比如顏色比例，像下面這個原作的顏色比例就沒有太統一：
在小 y 優化臨摹之后，達到了顏色比例的平衡：
再比如之前說的一個案例，粗細線條的比例：
在這樣不統一的情況下，圖標是一定不會精致的。這些都是比例統一問題出現的實際場景。
正負形也是沒那么容易看出來的，舉個例子，下面這組周楠做的圖標，乍一看沒什么問題，但是仔細一觀察，其實我們會發現，白色面積的重量其實是不統一的，那個消息上面的“#”會偏重一點：
當優化之后，我們再看：
整體就會比之前統一精致很多。
角度，也是增加圖標統一感的因素之一，最常見的角度統一方式就是按照一定的倍數來制定規范，比如 30 度的倍數：
再舉一個角度其他方面的例子，在做下面這組圖標的時候，最初沒有考慮斷線的規律：
所以看久了會覺得有些凌亂，于是我將斷線處定為右下角 45 度，如遇到圓角拐角處，可挪動靠近拐角處進行斷線：
這樣我們就會看到所有的圖標斷線位置都大致出現在右下角的地方，最終效果如下：
很大程度上提高了圖標的統一性，并且在延展執行的時候節省了大量的思考時間（思考在哪里斷）。
但是對于斷線的位置是否一定要規定其出現的角度，我覺得不一定，也可以從其他角度考慮，但最終的目的還是讓整體統一和諧，且延展性高。
以上就是目前總結的 9 個需要統一的點，只要能把所有的統一性做好，精致一定是沒問題的。
文章來源：優設網 作者：菜心設計鋪
藍藍設計( m.hengshangtqd.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務