雷火电竞首页-中国电竞赛事及体育赛事平台

聯系我們 face+ 關于 服務 案例
首頁 案例 服務 關于 face+

UI圖標設計五大原則,輕松解決你的設計疑問

Time: 2020-01-09

UI圖標的設計在我們日常生活中是非常常見的,而且它的運用也是非常廣發的,但是有很多新手UI設計師卻對它非常頭疼,下面我們跟隨小編一起來了解一下UI圖標設計的相關資料吧。


UI圖標設計原則

一、統一性原則

  一個軟件或程序的系統中,圖標的設計風格需要保持統一。因為統一的圖標比單一零散的圖標更具品質,更容易讓用戶理解和接受。圖標的造型設計,可以使用輕松詼諧的繪畫風格,也可以使用簡潔明快的平面剪影效果或酷炫時尚的3D效果。

  ①圖標的透視效果表現,是圖標造型中的重要因素。如果某一圖標元素的造型設計成平行透視的表現效果,那么其他的圖標,也要按照平行透視效果來進行設計。而如果圖標元素視覺效果是成某一個特點角度,即成角透視效果,那么其他所有的圖標,都要按照這個特定角度進行設計。

  ②圖標的光影效果表現,也能很好地體現圖標的統一性。圖標的光影效果,如果不是從同一光源角度射入,那么可能會導致整個圖標系統視覺混亂。使用統一的光源效果,不僅可以使圖標整體效果統一,而且也會讓使用者覺得圖標的設計比較專業。

 ?、蹐D標的色彩風格,也需要和圖標造型風格相統一。特別是在色彩的選擇和搭配上,盡量考慮色彩三屬性的協調,色相、明度或純度3項中至少有1項是相互統一協調的。同時,顏色選用也不宜過多,因為過多的顏色在一個很小的區域里出現,會讓人產生雜亂的感覺,影響到最終視覺效果。


1.jpg

(圖片來自網絡)


  二、用戶認知性與識別性原則

  圖標設計的目的,是通過符號化的圖形傳達信息。因此,圖標的用戶認知性與識別性原則,在圖標設計中就顯得尤其重要。圖標,是建立在虛擬世界和真實世界的一種隱喻或映射關系的橋梁。隱喻旨在“以一種更為明顯,更為熟悉的觀念符號來表示某種觀念”,觀念之間存在著類似性。

  在圖標設計中,隱喻是一個相當重要的表現手法。通過歸納和聯想,使圖標的圖案造型與圖標的使用功能,可以建立起最為直接的聯想。但是,這種直接的聯想關系,取決于圖標使用用戶的認知水平和認知習慣。相較之下,具有隱喻表現手法的界面圖標設計,可以化繁為簡,將抽象事物的內涵明確化,讓使用者更容易理解和認知,因此顯著地提高了圖標在人機交互間的有效性和準確性。


  三、簡潔性與符號性原則

  視覺圖案的寫實程度,與受眾對視覺圖案的關注度,是成正比的。即越寫實的圖案,越容易引起受眾的關注。因此,設計師在進行圖標設計時,其設計的圖標的視覺表現越是逼真,越是可以引起用戶更多的注意,也可激發更多用戶的使用興趣。但是,形象寫實逼真的圖標設計,卻也從另一個方面影響了圖標信息的快速傳達。

  在小尺寸圖標中,由于圖標尺寸偏小,導致視覺上的識別度降低。

  同時,也需要避免過多的元素在同一圖標中出現。如果必須在圖標中加入過多元素的話,那么就要盡量在圖標設計時保持強烈的符號品質,讓主體圖案以符號化的形式出現。在圖標中,應謹慎地設置圖標的圖形元素,因為不可能所有的圖標,都有使用簡約的黑白剪影效果。


2.jpg

(圖片來自網絡)


  四、尺寸性原則

  由于圖形化用戶界面的使用環境不同,導致圖形用戶界面在使用中的顯示環境不同。因此,圖形化用戶界面的圖標尺寸,也出現了不同。同時,隨著顯示技術的不斷發展,圖標對應的顯示尺寸越來越大,分辨率越來越高,這使得圖標的細節,也不斷地在進行改進中。并且跨平臺軟件的圖標大小或像素的數量,通常按照特定的技術規范進行設計 。一般的圖標標準尺寸有4種,分別為像素、24×24 像素、32×32像素和48×48像素。

  ui圖標設計,不同于其他的ui視覺設計。同一圖標,由于其尺寸不同,展示效果和制作細節也不盡相同。因此,在不同顯示系統下的圖標,在圖標設計時,都有其對應的圖標效果。



  五、文字應用原則

  在圖標設計中,除了圖形設計之外,還有一個重要的組成部分就是文字。簡潔明快的文字標簽和清晰準確的文字說明,能更好地提高圖形化用戶界面的工作效率 。在設置圖標文字時,最好使用簡單通俗的文字作為圖標的說明文字。在圖標文字的選擇上,需要具備高度的概括性。同時,圖標文字又需要有高度的信息傳達性,能夠充分體現其是對圖標圖案的一種解釋和說明。

  在圖標文字的設計中,需要對文字屬性和文字使用環境進行考慮。而文字的字體、尺寸和色彩等方面,也會對圖標的整體視覺和運行效果產生影響。在文字字體的選擇上,考慮圖標字體的形態不宜復雜。文字的識別度差異,在通常情況下,中文字體應不小于14px,英文字體應不小于 12px。另外,應該盡量使用均勻的間距,使文字更為整齊清晰,易于辨體識。


3.png

(圖片來自網絡)


  圖標中的文字使用,是對圖標圖案的說明,能夠讓用戶高效、快速地讀懂圖標所需要傳達的全部信息。圖標文字的設計,涉及到圖標文字內容的選擇、字體選取、字形安排以及文字的色彩的選用等多個方面,是綜合應用的結果,也體現了圖標文字應用在圖形化界面中的重要性。


  其實小編覺得UI圖標設計并沒有大家想象中的那么復雜,關鍵只要抓住UI圖標的設計原則,這樣才能做出更好的UI設計圖標哦!


合作咨詢

上海(總部)

上海市浦東新區郭守敬路498號22號樓
021-61057328
[email protected]

辦公地址地圖

北京

北京市東城區后永康17號A座
010-64015620
[email protected]

辦公地址地圖

成都

四川省成都市錦江區東大街牛王廟段100號
028-62790929
[email protected]

辦公地址地圖
首頁 | 案例 | 服務 | 關于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號-5

上海辦公地點地圖
北京辦公地點地圖
深圳辦公地點地圖
在微信中搜索faceui
或保存二維碼在微信中打開