偷偷摘套内射激情视频,久久精品99国产国产精,中文字幕无线乱码人妻,中文在线中文a,性爽19p

學會這 7 個技巧,畫出完美圖標

移動開發(fā) Android
設(shè)計圖標是一個藝術(shù)創(chuàng)作的過程,里面也有很多需要被關(guān)注而不可忽視技巧。要知道如何設(shè)計好圖標,是對于 UI 設(shè)計師來說是不可或缺的重要技能。

大家好,我是布萊恩。圖標是 UI 設(shè)計中最基礎(chǔ)也是很重要的部分,輔助人們更好的理解功能內(nèi)容。隨著扁平化設(shè)計風格的普及,圖標的風格越來越簡約,看似簡單的圖形,實際要準確的表達含義,也是需要注意一些方法的。以下是圖標設(shè)計技巧的分享內(nèi)容:

設(shè)計圖標是一個藝術(shù)創(chuàng)作的過程,里面也有很多需要被關(guān)注而不可忽視技巧。要知道如何設(shè)計好圖標,是對于 UI 設(shè)計師來說是不可或缺的重要技能。

在我設(shè)計圖標的時候,我個人認為有以下7個規(guī)則:

簡單

一個圖標一個非寫實的表現(xiàn)。不需要擔心圖標不夠真實,消除不必要的細節(jié),用基本的形狀只保留最基礎(chǔ)的部分,讓這個圖標更容易被理解。

有時候圖標會因為有更多細節(jié)而傳達了更復雜的意思,這反而是樣式問題!

一致性

在整個圖標系統(tǒng)中,你的圖標要保持同一種樣式來確保圖標完美協(xié)調(diào)。比如同樣的形狀,填充,描邊粗細,尺寸等。要制定好可以被復用的柵格,規(guī)范和樣式。

如果可以的話,盡可能重新設(shè)計這些圖標,而不要混入其他不同風格的圖標來使用。

清晰

設(shè)計「完美像素」的圖標,特別是在圖標非常小的時候。這樣圖標的描邊就可以保持銳利,不會有模糊。注意半像素的情況出現(xiàn),盡量避免小數(shù)點參數(shù)。

這也可以幫你保持圖標的辨識度,在你等比縮放他們的時候保持清晰。

空間

確保你的圖標的所有形狀有足夠的空間。筆畫和空間過于狹小會使圖標更難被理解。

最少給2px的負空間

視覺調(diào)整

確保你的圖標看起來是正確的,適當?shù)恼{(diào)整元素的對齊來達到視覺上的平衡。

不要只關(guān)注參數(shù),如果有需要就用上你的眼睛來衡量,輕微移動這些元素。

布局規(guī)格

所有圖標保持同樣的尺寸,在圖標周圍定義一個可調(diào)整的內(nèi)邊距范圍,盡量讓元素設(shè)計在這個范圍內(nèi)。不要擠滿所有元素。

當圖標需要額外控件時可以超出這個內(nèi)邊距范圍。

測試驗證

在設(shè)計階段,你的圖標可能看起來是完美的,但還是需要將圖標放到實際的界面環(huán)境中,測試他們是不是完美,有沒有可以調(diào)整的細節(jié)問題。

確保每個新增的圖標和其他圖標顯示一致。

你在設(shè)計圖標過程中,有用到以上的這些技巧嗎?可以在評論區(qū)告訴我,你是怎么怎么設(shè)計圖標的。

責任編輯:未麗燕 來源: 布萊恩學設(shè)計
相關(guān)推薦

2020-07-29 08:05:42

JavaScriptTypeScript工具

2021-07-14 23:57:26

Vue高級技巧

2020-07-07 14:35:41

Python數(shù)據(jù)分析命令

2021-11-01 09:19:51

谷歌技巧搜索工具

2022-11-03 07:07:49

函數(shù)Pandascsv

2012-06-25 16:14:26

Windows Pho

2021-06-02 20:13:41

Matplotlib繪圖工具

2020-10-27 12:06:17

MathJavaScript對象

2021-06-30 00:14:24

JS代碼數(shù)組

2020-11-16 10:27:38

云計算

2021-01-30 10:59:30

無代碼編碼應(yīng)用程序

2021-12-27 14:33:47

Python語言開發(fā)

2020-12-31 10:33:05

Python開發(fā)編程

2020-08-19 09:22:14

Python語言工具

2020-07-14 07:12:19

云安全AI無服務(wù)器

2020-04-29 14:50:40

代碼對比工具

2021-08-13 22:41:35

手機工具插件

2025-02-27 07:00:00

解構(gòu)賦值代碼JavaScript

2020-07-02 08:27:47

Javascript

2022-03-03 09:10:24

css隱藏滾動條前端開發(fā)
點贊
收藏

51CTO技術(shù)棧公眾號