網(wǎng)站建設(shè)中的設(shè)計小技巧增加你的設(shè)計層次感

2022-12-09    分類: 網(wǎng)站建設(shè)

運用分組建立層次 

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

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

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

▲在球員定制的處理上,最右邊那張圖,通過卡片和線條分組處理,從視覺上很清晰的看見排名;哪兩個球隊之間正在進行比賽。

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

運用空白建立視覺層次 

空白也是視覺設(shè)計元素,并不是留白就是空著,如果設(shè)計中留白運用合理,可以幫助用戶理解很多信息,因此任何設(shè)計都需要通過適當?shù)呢摽臻g來傳遞信息。

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

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

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

網(wǎng)站題目:網(wǎng)站建設(shè)中的設(shè)計小技巧增加你的設(shè)計層次感
鏈接分享:http://www.bm7419.com/news/221040.html

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

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

網(wǎng)站托管運營