構(gòu)建界面視覺層級的元素有顏色的顯著程度，圖片、文字的尺寸大小，還有最基礎(chǔ)的，內(nèi)容的組織結(jié)構(gòu)。

結(jié)構(gòu)設(shè)計(jì)是指對界面內(nèi)容進(jìn)行分組，對界面中的信息、數(shù)據(jù)進(jìn)行設(shè)計(jì)使之結(jié)構(gòu)化呈現(xiàn)的過程。

好的結(jié)構(gòu)設(shè)計(jì)能使界面信息傳達(dá)更加清晰、快捷。那么，如果進(jìn)行結(jié)構(gòu)設(shè)計(jì)呢？

結(jié)構(gòu)設(shè)計(jì)———內(nèi)容的分組

使用線、框、背景色來分組

這是最常見的分組方式，在UI設(shè)計(jì)中歷史悠久。

使用線來分組

使用框來分組

使用背景色分組

不管是線、框，還是背景色，都是可見的邊界，本來引入這些可見邊界的目的就是為了使信息的呈現(xiàn)更加清晰，但是這些視覺元素的加入也在一定程度上增加了界面的凌亂感。所以，現(xiàn)在越來越多的會利用空間的遠(yuǎn)近來對界面內(nèi)容進(jìn)行分組。

利用空間的遠(yuǎn)近來對界面內(nèi)容進(jìn)行分組

從XP到win7，變化很明顯。

網(wǎng)頁設(shè)計(jì)中也是一樣，越來越多的新界面采用極簡主義的思路，只保留了極少的線和背景色，更多時候是通過拉大區(qū)塊之間的距離來分組。

喜歡深究的人也許會問，為何沒有可見邊界，我們也能清楚的根據(jù)距離的遠(yuǎn)近來對信息進(jìn)行分組呢？

關(guān)于這一現(xiàn)象，在20世紀(jì)早期，一個德國的心理學(xué)家研究小組就進(jìn)行過研究，試圖解釋人類視覺的工作原理。他們觀察了許多視覺現(xiàn)象，并提出了格式塔(Gestalt)原理。針對這一現(xiàn)象，是其中的"接近性"原理。

標(biāo)簽： 界面設(shè)計(jì) 結(jié)構(gòu)設(shè)計(jì) 交互設(shè)計(jì) 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請與原作者聯(lián)系。