運(yùn)用分組建立層次 

在設(shè)計(jì)中，相鄰的元素比分開(kāi)較遠(yuǎn)的元素會(huì)更加吸引人注意，在做設(shè)計(jì)閱讀順序時(shí)，利用設(shè)計(jì)分組是一個(gè)非常有效的方法，將不同信息進(jìn)行視覺(jué)間距分組。能提升用戶對(duì)于內(nèi)容上的理解。

▲如上圖slack的設(shè)計(jì)，插畫(huà)引導(dǎo)圖和底部按鈕上面文字拉開(kāi)了距離，使得內(nèi)容更聚焦。第二個(gè)界面的頂部頭像和下面的文字也是通過(guò)分組形成了對(duì)比。

▲stadium-live的產(chǎn)品設(shè)計(jì)上，登錄頁(yè)面按鈕為一組，頂部品牌LOGO和slogan一組，人物為一組，每組信息之間分組非常明確，互相都不會(huì)對(duì)對(duì)方視覺(jué)產(chǎn)生干擾，后面兩張頁(yè)面也是如此，頂部的導(dǎo)航，和下面表單信息，以及頭像和底部按鈕，通過(guò)分組處理，內(nèi)容更加符合用戶的視覺(jué)動(dòng)線。

▲在球員定制的處理上，最右邊那張圖，通過(guò)卡片和線條分組處理，從視覺(jué)上很清晰的看見(jiàn)排名；哪兩個(gè)球隊(duì)之間正在進(jìn)行比賽。

▲當(dāng)一組信息比較接近時(shí)，證明他們是有關(guān)聯(lián)的，如果距離比較遠(yuǎn)，這意味著這組信息和他們是不同的，簡(jiǎn)單來(lái)說(shuō)，通過(guò)鄰近性原則創(chuàng)造這些關(guān)系，為信息帶來(lái)層次。

運(yùn)用空白建立視覺(jué)層次 

空白也是視覺(jué)設(shè)計(jì)元素，并不是留白就是空著，如果設(shè)計(jì)中留白運(yùn)用合理，可以幫助用戶理解很多信息，因此任何設(shè)計(jì)都需要通過(guò)適當(dāng)?shù)呢?fù)空間來(lái)傳遞信息。

▲classpass的設(shè)計(jì)不會(huì)使用太多的視覺(jué)元素，而是運(yùn)用留白把內(nèi)容進(jìn)行分組，每個(gè)頁(yè)面的留白恰到好處，同時(shí)留白本身就是對(duì)信息進(jìn)行區(qū)分，所以頁(yè)面中減少了很多線條使用，會(huì)更加干凈有品質(zhì)感。

▲must是一款電影軟件，整體設(shè)計(jì)非常雜志風(fēng)，頁(yè)面就是通過(guò)圖文處理，以及留白空間的處理，增加對(duì)比，基本產(chǎn)品使用過(guò)程中你不會(huì)感覺(jué)到視覺(jué)負(fù)擔(dān)，元素之間的信息組織的非常清晰。

▲在電影展示頁(yè)面，信息的處理，以及打分設(shè)計(jì)上，多次運(yùn)用留白來(lái)處理信息層級(jí)，在設(shè)計(jì)中，當(dāng)你元素周圍留白越多，它產(chǎn)生聚焦注意力的作用也越強(qiáng)，如右邊的打分頁(yè)面，幾乎所有焦點(diǎn)都在這個(gè)彈窗上。

網(wǎng)站名稱：網(wǎng)站建設(shè)中的設(shè)計(jì)小技巧增加你的設(shè)計(jì)層次感
分享URL：http://m.2m8n56k.cn/news40/221040.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營(yíng)銷seo公司；服務(wù)項(xiàng)目有網(wǎng)站建設(shè)等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：[email protected]。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)