圖形圖標:圖標設(shè)計風格包括線性圖標、表面圖標、線面組合、微紋理,可給用戶一種簡單而清晰的感覺。
擬物化圖標:即模仿物理效果的圖像圖標設(shè)計方法,具有畫面層次分明、表達清晰、色彩豐富等優(yōu)點。
混合匹配:即圖形、圖像和擬物化相結(jié)合的設(shè)計方法,可滿足多樣化的業(yè)務(wù)需求。
一、如何設(shè)計UI標簽圖標1、圖形圖標
圖形圖標方法是最常用的方法之一,給用戶一種簡單而清晰的感覺。圖標設(shè)計的風格包括線性圖標、表面圖標、線面組合、微紋理等。圖標設(shè)計結(jié)合業(yè)務(wù)或功能模塊的關(guān)鍵詞是最簡單的圖標設(shè)計之一。如何用簡單的圖形表達最準確的信息,充滿設(shè)計感,是測試設(shè)計師圖標設(shè)計能力的關(guān)鍵。
2、擬物化圖標
(1)擬物化圖標是一種模仿物理效果的圖像圖標設(shè)計方法。擬物化圖標具有色彩豐富、畫面層次分明、表達清晰等優(yōu)點。缺陷也很明顯,具體圖標細節(jié)太多,應(yīng)用范圍有限,圖標太大,無法縮小等。但只要應(yīng)用得當,它仍然可以有很好的效果。
(2)案例中的分類頁面采用擬物化圖標設(shè)計。原本枯燥的文字分類增加了擬物化圖標,瞬間豐富了頁面,增加了文字介紹,讓用戶對每一個分類都有了清晰的印象,方便用戶檢索。
3、混合匹配
混合匹配是圖形、圖像和擬物圖標同時出現(xiàn)的情況。在連接業(yè)務(wù)需求時,單一方式不能滿足多樣化的業(yè)務(wù)需求,圖標將混合組合。為了盡可能統(tǒng)一視覺效果,將選擇基本圖形作為統(tǒng)一的外部輪廓,以便與其他圖標設(shè)計風格相對結(jié)合。
二、UI設(shè)計怎么運用元素疊加
1、元素疊加是一種常用的設(shè)計手法,如果我們不喜歡常規(guī)的圓形裝飾效果,那就可以把它們疊在一起,就有了更加豐富的視覺表現(xiàn),如果你覺得畫面有些平淡,同樣可以把元素進行堆疊,就形成了一種迷幻的神秘感。
2、在左右圖文的排版中,如果覺得如今的視覺的效果有些普通,可以把元素放大一些,突出的效果會更加吸引用戶的眼球,如果小伙伴們想要增加操作的趣味性,可以做成卡片堆疊的效果,既可以體現(xiàn)內(nèi)容數(shù)量的豐富度,也能夠引導(dǎo)我們的用戶進行操作。
3、如果你喜歡某樣?xùn)|西,也許你的喜歡是直白的也可能是隱晦的,把文字堆疊在一起,就會有種朦朧的美。
4、把主體放置在框內(nèi),疊加上文字,就有了一種文藝的氛圍,當然如果你想要增加一些神秘的藝術(shù)感,我們也可以使用一些疊加的手法和效果,就可以讓我們的整體畫面變得有層次感。