火星網校
終極圖標設計指南——理論篇優(yōu)化版
發(fā)布時間：2024-08-28 11:32:30 瀏覽量：230次
如今的用戶界面中，圖標絕對是不可或缺的元素。雖然絕大多數(shù)的圖標都很小，甚至不被人注意到，但是它們幫助設計和用戶解決了許多問題。
圖標是可用性和導航的關鍵，用戶能夠感知到圖標的功用，但是只有設計師才會明白，想要讓圖標簡約、可用還富有表現(xiàn)力，要耗費多少時間和精力。
我們每天接收到各種信息，美的丑的，很多時候我們看的都是別人家誰做的高端的，拔高自己的同時，基礎不能落下。
扎實的基礎是拔高的前提。喬布斯曾經說過：“細節(jié)至關重要，花費時間仔細打磨是值得的”。
圖標是現(xiàn)如今UI界面中可用性和導航體系的核心組件。所以，這篇文章分為上篇、中篇、下篇三部分，仔細總結圖標的基礎知識。
一、什么是圖標
圖標是用戶界面不可缺少的元素，具有高度濃縮并且可以快捷傳達信息、便于以及的特性。
二、圖標的意義
隨著人們工作越來越忙，圖標已成為了生活中的一部分。幫助我們快速定位，幫助我們快速的做出決定和行為，以及幫助我們找到需要的東西。
三、圖標的優(yōu)勢
圖標設計是界面設計中很重要的元素之一，一套高質量的圖標對產品的品牌形象和用戶的體驗影響是巨大的。不僅能提升界面美觀度、降低用戶理解成本，還能塑造品牌形象、提升用戶的安全感和轉化率。
1. 圖標傳達信息快
本身對圖形的理解和接收能力就比單純的文字要快。圖形能更簡單清晰且很直觀的展示。
2. 圖標傳達信息準
通用圖形能跨語言、跨地區(qū)、跨文化群體表達出同樣含義，不易發(fā)生混淆。
3. 品牌塑造穩(wěn)定
同一個品牌、同一個平臺保持同樣的風格圖標，會讓人感到很專業(yè)。
4. 減少用戶辨識時間
通過簡單快速的查看就可以知道圖標中攜帶的復雜信息。
四、圖標的類型及設計屬性
圖標根據具體實際用途大體可以分為三大類：工具圖標、裝飾圖標、啟動圖標。
五、如何選擇線性還是面性
線性圖標顧名思義用線條來表現(xiàn)繪制。面性圖標也就是一個物體的剪影，用塊來表現(xiàn)語義。
六、如何準確運用圖標
1. 面性圖標的運用
面性圖標視覺表現(xiàn)力強，有效的強調頁面的視覺重心。
2. 面性與異形圖標的運用
面性圖標的第一視覺是一個色塊，異形圖標第一視覺是個形狀，所以面性圖標視覺表現(xiàn)力強。
3. 用圖標區(qū)別視覺層級、業(yè)務板塊
圖標有主有次，有視覺層級，強化用戶常用的或者產品主推的業(yè)務。
七、圖標的用色原則
圖標的顏色應保持合理性，保持視覺舒適。
八、圖標的大小規(guī)范
iOS的網格大小要求是4的倍數(shù)，安卓的設計規(guī)范要求網格大小是8的倍數(shù)。
九、圖標常用尺寸
@2x格式使用機型：iPhone 4，4s，5，5s，5s，s，6，6s，7，8，XR；
十、如何統(tǒng)一圖標
1. 創(chuàng)建凝聚力的圖標集
保持集合中每個圖標的大小相同，使它們保持一致。
2. 為什么圖標應該具有凝聚力
在整個集合中使用相同的元素會使圖標看起來更具凝聚力。
十一、B端、C端圖標的差異
1. 圖標內容差異化
C端產品的圖標設計更具備獨特的視覺風格。
2. 不同的設計難點
C端產品圖標更多偏向趣味性，B端產品圖標更講究延展性。
十二、小結
整個圖標設計分為三篇來講述的。
- 《理論篇》主要講述圖標設計的概念以及設計原則等理論內容；
- 《工作篇》主要講述工作中圖標設計過程以及圖標落地；
- 《分享篇》主要分享圖標設計的工具、圖標網站、圖標設計團隊或者設計師。
? 火星時代教育，電腦給他們參加自適應繪制，三星的長寬比是三比一。
熱門課程推薦
熱門資訊
-
怎樣可以提升你的UI設計能力!第一個:站酷站酷想必是設計師都知道的一個網站,里面不止有UI設計的資源,還有其他設計的,不如:平面設計、網頁設計、字體...
-
2. iPhone6的UI設計尺寸規(guī)范，原來如此重要！
想要了解iPhone6界面設計的尺寸規(guī)范嗎？這里為您詳細介紹iPhone6的UI設計尺寸規(guī)范，包括界面尺寸、圖標尺寸、可點擊高度規(guī)范、搜索欄高度規(guī)范以及界面元素之間的距離規(guī)范。
-
3. 移動端UI設計中常見的5種APP界面類型，你get到了嗎？
通過介紹移動端UI設計中的閃屏頁、引導頁、浮層引導頁、空白頁和首頁等5種APP界面類型，幫助大家更好地了解UI設計的基本知識
-
4. 12個絕佳的UI設計網站，助力你的創(chuàng)作之旅!
將為大家介紹12個絕佳的UI設計網站,這些網站不僅可以為你提供靈感,還可以幫助你學習新的技巧,助力你的創(chuàng)意之旅!dribbbleDribbble 是一個面向設計師的...
-
在移動端設計中,列表頁和表單頁是不可或缺的部分。一個好的列表頁和表單頁設計能夠讓用戶輕松地獲取信息并產生點擊欲望,從而提高點擊率。本文將為你...
-
6. 史上最全，平面設計UI設計必備的77個國內外素材、設計資源網站
ui設計社區(qū),大神太多了。3、behance: https://www.behance.net/ ,著名設計... 對于品牌設計師來說,除了圖案素材收集之外,還有一個很重要的,就是設計故...
-
對于想要提高自己的設計能力和創(chuàng)造力的小白和UI設計師來說,這本書是一個很好的選擇。4.《設計的覺醒》(IKKO TANAKA)推薦理由: 這本書是日本現(xiàn)代平面...
-
8. 設計中的色彩心理學:淺析中西方色彩的歷史演變與設計應用
摘要:本文探討了色彩的歷史演變和設計應用。通過對色彩在早期文明社會中的實用運用、不同文化背景下色彩觀念的差異、色彩在設計中的重要性以及新興技...
-
想了解武漢UI設計培訓班的費用是多少嗎？不知道學UI設計要花多少錢？不妨看看這篇文章，了解UI設計培訓班的學費價格以及學習內容。
-
探索零基礎UI設計培訓的時長與薪資前景。了解數(shù)字藝術教育領域的專業(yè)課程，以及培訓后的職業(yè)發(fā)展機會。
最新文章
