融入品牌元素，讓你的圖示設計有理有據
相信每一個UI設計師，在工作中都會遇到做圖示設計的需求，而作為設計師的我們，經常會因為時間緊迫而“隨意”設計一下。這時如果要求高一點的Leader問：“你這個圖示為什麼這麼設計？”，我們就很難回答。那到底如何做才能在保證速度的情況下，又讓圖示有理有據呢？其實我們只需要多用點心，將“品牌元素”融入設計就能讓圖示變得大不一樣。
1. 形
做圖示，我們首先考慮的是圖示的外形。還記得自己剛做UI時，自問“首頁”為什麼是小房子？，“我的”為什麼是一個小人？其實這都是大家將意形化之後的結果。
現在有很多的icon平臺，能幫助設計師快速的製作圖示。只是這些圖示大都樣式雷同，形到而意難達，直接用就會顯得過於泛泛。這時，我們可以先借助這些平臺來了解大眾眼光中的此類圖示是什麼樣子。而當你的腦海中對你要做的圖示有一個大致的形狀瞭解後，你就可以思考“品牌元素”的提取了。
一般來說，我會先去研究品牌的logo，因為它是品牌形象的核心部分。然後通過logo或品牌定位提取出特定的形狀，而這個形狀是品牌固有的、是具象的，例如圓形、線面、甚至是logo本身等等。
那提取出“品牌元素”後，如何融入圖示設計中呢？
（1）直接使用logo外形
現在很多app的首頁圖示，不再像過去一樣拘泥於“小房子”的樣式，很多產品開始直接使用自己的logo來代表首頁。這樣的設計看上去好像比用“小房子”更加“隨意”，但卻潛移默化的加深了使用者對於產品品牌的印象，達到了圖意與品宣的雙重作用，如下圖：
（2）提取圖形作為外輪廓
將提取的形狀作為整套圖示的外輪廓製作成系列圖示，這種設計方式多體現在app的功能區。例如淘寶，從logo的“淘”字中提取出圓形後，功能區的整套圖示都是以圓形作為外形，如下圖：
“畫地為牢”，將原本複雜且關聯性較低的功能整合在相同的區域裡，也不失為一個好的解決辦法。
（3）產品特性與圖示相融合
相信大家的手機中都會有一款音樂類的app，可能是網易雲音樂，也可能是qq音樂，而在這次我要說一下“蝦米音樂”的圖示設計，先來看圖：
可以看出，設計師在製作每一個圖示時，都沒有忘了這是一款音樂App。四個圖示在本身的寓意基礎上巧妙的融合了音樂光碟的外形特性，使圖示在複雜寓意的情況下高度的保持了統一性。當然，也有人會說，除了“AI電臺”和“新歌新碟”，另兩個圖示的音樂光碟樣式並不明顯啊！在這必須要強調的一點是，很多時候我們很難將一個特定的形狀融入到所有的圖示當中，如果強行融合，會讓人覺得死板生硬，甚至多餘複雜，因此一定要有所取捨。
那為什麼案例中有些圖示沒有很好的融入音樂光碟的外形，卻也不影響整套圖示的和諧統一呢？
那是因為它們融入了另外一個品牌元素——品牌色。
2. 色
選用品牌色做圖示設計的基色，是一個最簡單直接的方法。我們在做一個系統時，不可能將所有的精力都放在圖示設計中，對於一些相對較弱的功能icon，為了節約時間，我們可以採取這種直接抽取品牌色的設計方式。
舉兩個例子，下圖是蝦米音樂和虎課網的個人中心頁面。可以看出，設計師在圖示製作的用色上，都使用了品牌色。這些功能icon，沒有再過多的加入logo或產品特性的元素，只是用簡單的線條進行了圖形設計，卻仍然讓人覺得具有統一性、品牌性。
3.整合
綜合前文說的形、色兩個方面，我們在圖示製作的過程中，還需要注意幾個問題：
（1）確定風格。選擇用線還是面或其他某種形式來表現圖示，注意整體性和統一性。比如用線，就要保證整個圖示的線是粗細相等的；如果用線面結合，就要確保每個圖示都有線和麵的體現。
（2）避免生硬的融合。當有些圖示與提取出來的品牌元素或產品特性很難完全融合時，寧可捨棄這種方法也不要強行融合。 就像很多時候，一個錢袋的圖示，我們很難說明它是錢包，還是餘額，或者是賺錢工具？這時候，我們就不要過於強求了。
（3）切忌屬性過多。當設計一套圖示時，屬性保持在2個左右就可以了。如果樣式屬性採取的過多，反而讓圖示設計過於復 雜，失去了簡易替代的意義。
其實說那麼多，關鍵是對品牌元素的提取，之後便是對其靈活運用。色易而形難，讓我們一起在實踐中鍛鍊吧~
