如何提升UI設(shè)計(jì)的高級(jí)感？

在互聯(lián)網(wǎng)產(chǎn)品日趨成熟的今天，你會(huì)發(fā)現(xiàn)所有的App越來(lái)越像，似乎是同一套模版設(shè)計(jì)出來(lái)的產(chǎn)品。而這種普適化的設(shè)計(jì)會(huì)導(dǎo)致同質(zhì)化嚴(yán)重，使得設(shè)計(jì)不精致，產(chǎn)品沒(méi)有氣質(zhì)和品牌感。一個(gè)App設(shè)計(jì)是否精致，是否富有設(shè)計(jì)感，在于它的細(xì)節(jié)，這就意味著我們?cè)谶M(jìn)行設(shè)計(jì)的時(shí)候，要從細(xì)微之處著手，從多方面去鉆研如何創(chuàng)造出打動(dòng)人心的UI設(shè)計(jì)。本節(jié)總結(jié)了5個(gè)簡(jiǎn)單直觀(guān)的提升設(shè)計(jì)感的小細(xì)節(jié)，一起來(lái)學(xué)習(xí)。

1.使用顏色深淺構(gòu)建層次結(jié)構(gòu)

在對(duì)UI文本進(jìn)行樣式控制的時(shí)候，最常見(jiàn)的錯(cuò)誤莫過(guò)于過(guò)度依賴(lài)字體大小差異來(lái)營(yíng)造對(duì)比。單純使用字體大小對(duì)比，所營(yíng)造的對(duì)比并不夠，嘗試結(jié)合色彩和字重來(lái)營(yíng)造更好的對(duì)比效果。

2.統(tǒng)一色調(diào)

選擇一種基礎(chǔ)色，再調(diào)整色調(diào)和顏色深淺來(lái)增加均衡。設(shè)計(jì)時(shí)避免用過(guò)多的顏色。如果項(xiàng)目允許，只需使用固定的色板，通過(guò)調(diào)整基礎(chǔ)色的飽和度和明度，利用這種簡(jiǎn)單的方式為設(shè)計(jì)增加一致性。

3.干凈的陰影

陰影是UI設(shè)計(jì)中最常見(jiàn)的視覺(jué)表現(xiàn)手法，它可以增加元素的深度，使其從背景中脫穎而出，引起用戶(hù)的注意力，同時(shí)也能增強(qiáng)畫(huà)面的視覺(jué)層次感。相比于采用大范圍的擴(kuò)散模糊陰影，使用微妙的垂直偏移陰影效果更明顯，更自然，它模擬了最常見(jiàn)的光源特征，光線(xiàn)從上往下照下來(lái)所營(yíng)造的陰影效果。

4.個(gè)性的圖標(biāo)設(shè)計(jì)

合格的設(shè)計(jì)師能夠繪制風(fēng)格統(tǒng)一的圖標(biāo)，而優(yōu)秀的設(shè)計(jì)師能夠創(chuàng)造風(fēng)格獨(dú)特的圖標(biāo)。我們能否在追求大小一致，圓角一致，線(xiàn)寬一致和配色一致的同時(shí)，為它的視覺(jué)表現(xiàn)力加入更多的創(chuàng)意呢？

5.無(wú)框設(shè)計(jì)去繁從簡(jiǎn)

在UI設(shè)計(jì)中，有許多的裝飾元素，如卡片的邊框、列表的分割線(xiàn)等，雖然邊框，分割線(xiàn)是分隔兩個(gè)元素的好辦法，但是它不是唯 一的方法，使用過(guò)多會(huì)讓整個(gè)布局的設(shè)計(jì)感降低，或多或少都會(huì)干擾用戶(hù)瀏覽的視線(xiàn)，讓信息內(nèi)容失去注意力，因此可以減少不必要的裝飾元素。