今天跟大家分享一下金剛區圖標的一些設計方法，希望能幫助到大家哦～
1.什么是金剛區？
金剛區是頁面的核心功能區域， 是聚合各類子板塊的入口，為各個子板塊分發內容。一般位于頁面中頭部位置，展示樣式為多行排列的宮格圖標。一般為2-3行，每行4-5個，內容多的時候可左右滑動。
比如餓了么首頁banner下的圖標、支付寶首頁的圖標。
2.金剛區圖標常見設計類型
金剛區常見的設計類型有5種：
1.面性圖標：有底板和無底板
2.線性圖標
3.線面結合圖標
4.實景圖圖標
5、節日/主題圖標
1、面性圖標
a.有底板
設計樣式：底版形狀一般使用圓形或大圓角的圖形，顏色一般飽和度較高，內部圖標風格樣式統一。
優點：有底板的圖標色彩面積更大， 視覺沖擊力更強。
缺點：對于類似的業務，因為圖形相似，視覺識別性不高。
舉例：
1、房產平臺類應用-安居客
b.無底板
設計樣式：沒有底板襯托，純圖標設計，設計樣式更加多樣化。
優點：設計細節豐富，富有創意，能營造小場景插畫。
缺點：對文字信息的依賴性強，圖形色彩等細節容易設計過度，輪廓復雜不一，統一性較差。
舉例：
1、音樂類應用-酷狗音樂
2、線性圖標
設計樣式：利用圖形外輪廓線條進行設計，色彩上基本以單色或雙色為主。
優點：視覺上簡潔干凈、安靜沉穩。
缺點：視覺沖擊力較弱
舉例：
銀行金融類應用-招商銀行
3、線面結合圖標
設計樣式：由線和面組成，通過面加強視覺沖擊力。
優點：設計細節豐富，富有創意。
缺點：視覺效果不易把握。
4、實景圖類圖標
設計樣式：以具有代表性的商品為圖標，單獨展示或配有背景底板。
優點：使用圖片可以帶來真實、可靠的感覺。而且還可以將運營方需要主推的商品換成圖標為板塊帶來流量。
缺點：商品圖片會時不時更換，用戶認知壓力較大，最終還是會依賴文字信息辨別入口。
舉例：
生鮮超市類電商產品-叮咚買菜、天貓超市
5、節日/活動主題圖標
設計樣式：以節日或活動為主題設計圖標，多以面性圖標為主。
優點：節日氣氛濃重，設計細節豐富，富有創意。
缺點：時效性強，只針對短時間內使用，識別度較低，比較依賴文字說明。
3.金剛區圖標區分樣式設計
有些產品會根據業務需求區分推薦應用和普通應用。區分設計能使推薦應用得到最大程度突出， 缺點是推薦個數有限。
1、旅游訂票類應用-同程旅行 、攜程旅游
兩款產品金剛區均采用區分式設計，但是形式大不一樣。 同程旅行相對攜程來說，業務較輕，因此金剛區設計較為常規，推薦應用部分采用圓形底板+面性圖標，其他應用則采用線性圖標設計，整體設計層次分明，簡單清新。攜程旅游業務體量大，純金剛區已不能滿足其產品需求。因此結合瓷貼設計，突出推薦應用。
2、主流外賣平臺產品-美團和餓了么
餓了么和美團外賣都是區分類型設計，推薦應用單獨一列，其余應用列兩行。
圖標設計上，推薦應用均采用底板+插畫圖標設計，自選應用采用去底板+插畫圖標設計。金剛區圖標的顏色總體給人鮮艷明亮的感覺，來表達食物的新鮮美味。圖標造型采用比較寫實、精致的插畫，充滿食欲感。 美團外賣推薦應用圖標采用破形設計，視覺更搶眼，內部圖形插畫細節更明顯，識別性更強。
4.金剛區圖標推薦設計
根據業務需要，產品會對金港區某個板塊進行推薦設計，常見的主要有2種方式：
1、添加標簽
給想要推薦的模塊添加標簽是最常用的方式。如下圖所示：
2、添加微動效
給應用圖標添加動效，使用圖標動靜對比來吸引用戶視線、進而達到推薦的目的。這種方式適用于強推少量應用圖標的時候使用。因為過多的動效會使頁面顯得雜亂，反而會降低推薦的效果。
5.金剛區圖標設計注意要點
1.設計尺寸：合理的金剛區圖標尺寸一般為80-100px左右，外環：內環=0.618視覺效果更佳。
2.顏色：采用漸變色時，漸變的兩色要在同一色系內，整體金剛區圖標底板色的飽和度和明度要盡量做成視覺統一。
3.差異性：金剛區圖標在設計上最好要與競品有一些差異度，通過對自家產品app的整體視覺語言設計讓用戶對我們的產品有一個明確的記憶，增加產品的辨識度。如貝殼找房APP金剛區圖標采用扁橢圓形狀，區別于常見形狀，增加了產品記憶點。
4、設計樣式選擇：
不知道大家在做金剛區圖標時會不會糾結使用什么風格，這里分享一個方法，我們可以根據產品的特性來選擇，主要可以劃分為功能型產品和業務型產品2類。
功能型產品：用戶的自主性較強， 線性圖標更加適合，因為線性圖標視覺上更加安靜沉穩，頁面更加統一整體，如支付寶的金剛區圖標。
業務型產品：面性圖標更加合適，因為面性圖標視覺沖擊力更強，能夠快速引導用戶點擊，完成導流的作用。如我們經常逛的淘寶APP金剛區圖標。
當然這個方法不是絕對的，只是一個參考，在我們沒有思路的時候可以試試這么做。
聲明：本文由網站用戶維維發表，超夢電商平臺僅提供信息存儲服務，版權歸原作者所有。若發現本站文章存在版權問題，如發現文章、圖片等侵權行為，請聯系我們刪除。
