图标圆角角度_UI设计中图标的规范及原则【附全套视频】
icon是一種圖標格式,用于系統圖標、軟件圖標等,這種圖標擴展名為*.icon、*.ico。常見的軟件或windows桌面上的那些圖標一般都是ICON格式的。icon元素包括兩個可選的子元素:small-icon子元素和large-icon子元素。文件名是Web應用歸檔文件(WAR)的根的相對路徑。部署描述符并沒有使用icon元素。但是,如果使用XML工具編輯部署描述符,XML編輯器可以使用icon元素。圖標是特殊類型的小位圖,最大尺寸為32×32像素。
那很多UI設計師在接觸到線上項目時第一個需要考慮的就是他的圖標,那么接下來小編就帶著大家分析一下我們icon的設計規范及原則
1、icon可辨識性
一個圖標最終是否起作用取決于觀看者能不能容易的識別icon所描繪的對象、想法、或者行為。圖標的設計語義傳達正確:圖標更加直觀,易于用戶理解,可識別性
我們看一下下面的圖標你可以發現 第三個表述不明確有人把他當成調音有人當成設置,所以第三個是失敗的。
2、icon審美統一
審美統一是指在一個或者多個icon中共享同樣的設計要素
比如說都是圓形或者方形的角,角的具體尺寸(2像素、4像素、等等),一致的線的粗細(2像素、4像素、等等)、風格(面、線、填充的線、字形)、顏色等等。審美統一讓你的設計看起來是一個整體。
2.1.線條一致性
線的粗細比較常用的是使用1種線條粗細
2種是理想的,3種有時候也是必要的。目標是在不引入太多破壞圖標一致的多樣性前提下,提供視覺層次。線的粗細最低2像素,最好使用雙數單位去做設計
下圖左半部分和右半部分分別統一
下圖小鎖頭是不統一的
2.2.風格一致性
統一的元素能夠使你的圖標看起來是一個整體。
下圖的圖標有的有笑臉有的沒有 有的斷口有的沒有 不具備風格的統一
下圖都有拐點而且都是黑色塊狀 具備統一性
2.3.色彩一致性
統一的色彩能夠使你的圖標看起來是一個整體。線性以單色或者雙色為主,扁平化圖標制作時可以定義出幾種顏色進行搭配。圖標使用光影、漸變要注意角度問題。
所有圖標都只用兩種顏色
圖標的色彩飽和度是一致的
2.4.光影一致性
下圖的光不統一 要保證投影的位置是一致的
2.5面積的統一性
這里說的不是再方塊里繪制面積就一致了,要在視覺上保持一致,新手可以使用圖標網格繪制
3、繪制細節
圖標繪制要注意,旋轉角度、字體、曲線、邊角等細節
3.1旋轉角度
堅持使用45°角,或者它的倍數。由于像素的原因,45°角的情況下是抗鋸齒的,這個角度下會有一個完美的清晰的邊緣線,人眼看起來會很舒服。
3.2曲線
曲線決定了一個圖標的美觀,不要用鋼筆工具繪制曲線,手繪的不規則的曲線,嚴重損害了設計的質量。
3.3圓角大小
使用圓角可以讓你圖標變得圓潤,注意圓角的大小使用規則。
3.4無襯線字體
圖標中使用字體元素,必須使用無襯線字體進行修改
那么以上呢就是咱們做icon的原則和規范了。
下面給大家分享一套做icon的視頻教程,關注我私信icon視頻教程即可獲得驗證碼
鏈接:https://pan.baidu.com/s/16dnGmZ09s8LfjBZdPR5fCA
7.1 - UI視覺重要組成
7.1.1 - UI視覺重要組成之剪影圖標
7.2 - 手機主題設計概述
7.2.1 - 手機主題設計概述
7.3 - 安卓手機主題設計
7.3.1 - 主題設計介紹和構成
7.3.2 - 主題設計的思路
7.3.3 - 鎖屏頁介紹與繪制
7.3.4 - 鎖屏頁的繪制
7.3.5 - 主題圖標設計方法
7.3.6 - 郵件圖標繪制
7.3.7 - 短信圖標繪制
7.3.8 - 音樂圖標繪制7.4 - 主題圖標的繪制
7.4.1 - 視頻圖標繪制
7.4.2 - 電話圖標繪制
7.4.3 - 計算器圖標繪制
7.4.4 - 便簽圖標繪制
7.5 - 主題圖標的繪制
7.5.1 - 閱讀圖標繪制
7.5.2 - 游戲圖標繪制
7.5.3 - 時鐘圖標繪制
7.5.4 - 文件夾圖標繪制
7.6 - 圖標導出和主界面繪制
7.6.1 - 天氣圖標繪制
7.6.2 - 聯系人圖標繪制
7.6.3 - 導出圖標
7.6.4 - 主界面繪制
——圖片來源于網絡
總結
以上是生活随笔為你收集整理的图标圆角角度_UI设计中图标的规范及原则【附全套视频】的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 怎么把桌面计算机放到快速启动栏,怎么把桌
- 下一篇: 远程主机http协议版本信息泄漏_Web