為什么你的設(shè)計(jì)總感覺(jué)不舒服?很可能是視覺(jué)平衡沒(méi)有做好

2023-1-11    ui設(shè)計(jì)分享達(dá)人

畫(huà)面平衡是一個(gè)很基本的設(shè)計(jì)理念,但很多朋友在平時(shí)的作品中容易忽視這個(gè)點(diǎn)。彩云在星球中幫不少朋友看過(guò)作品集,發(fā)現(xiàn)最多的問(wèn)題之一就是畫(huà)面平衡沒(méi)做好,我覺(jué)得只要把這個(gè)基本問(wèn)題解決了,作品就能提升一個(gè)檔次。

用戶本能地會(huì)對(duì)不平衡的設(shè)計(jì)感到厭煩,如何在畫(huà)面中創(chuàng)造一個(gè)有吸引力的平衡?是本篇文章要分享的內(nèi)容。

為什么你的設(shè)計(jì)總感覺(jué)不舒服?很可能是視覺(jué)平衡沒(méi)有做好

平衡是一個(gè)作品中最重要的元素之一。平衡中的對(duì)稱關(guān)系能夠創(chuàng)造平衡與和諧,這種平衡狀態(tài)直觀上能夠讓用戶感到舒適。

人體是垂直對(duì)稱的,我們的視覺(jué)接收也與之相對(duì)應(yīng)。我們喜歡物體在垂直軸上保持平衡,直覺(jué)上總是傾向于平衡一種力量與另一種力量。

為什么你的設(shè)計(jì)總感覺(jué)不舒服?很可能是視覺(jué)平衡沒(méi)有做好

在設(shè)計(jì)環(huán)境中,平衡是基于元素的視覺(jué)重量,而視覺(jué)重量是用戶對(duì)圖像的注意力范圍。如果畫(huà)面是平衡的,用戶會(huì)下意識(shí)地感到舒適。畫(huà)面平衡被認(rèn)為是其元素在視覺(jué)上的比例安排。

如何讓一個(gè)頁(yè)面看起來(lái)平衡?

一、對(duì)稱(靜態(tài))平衡

最常見(jiàn)的平衡例子就是使用對(duì)稱。

在潛意識(shí)層面上,對(duì)稱的視覺(jué)能讓人愉悅,能讓畫(huà)面看起來(lái)和諧有條理。對(duì)稱的平衡是通過(guò)在水平或垂直的中軸兩側(cè)均勻放置元素來(lái)創(chuàng)造的。也就是說(shuō),畫(huà)面中間假想線的兩邊實(shí)際上是彼此的鏡像。有些人認(rèn)為對(duì)稱的平衡是無(wú)聊和可預(yù)測(cè)的,但它經(jīng)受住了時(shí)間的考驗(yàn),到現(xiàn)在仍然是在頁(yè)面上創(chuàng)造舒適和穩(wěn)健感覺(jué)的最好方法之一。

為什么你的設(shè)計(jì)總感覺(jué)不舒服?很可能是視覺(jué)平衡沒(méi)有做好二、不對(duì)稱(動(dòng)態(tài))平衡

兩側(cè)重量不相同的元素構(gòu)成具有不對(duì)稱平衡。

動(dòng)態(tài)平衡通常會(huì)比靜態(tài)平衡更有設(shè)計(jì)感,讓畫(huà)面不至于呆板在缺乏平衡的情況下,我們的目光會(huì)條件反射性地開(kāi)始尋找平衡點(diǎn),這是一個(gè)很好的機(jī)會(huì),可以將注意力吸引到頁(yè)面上可能還沒(méi)被注意到的部分。頁(yè)面重點(diǎn)就應(yīng)該放在這里——抓住用戶的注意力,就像產(chǎn)品的生命線一樣。

為什么你的設(shè)計(jì)總感覺(jué)不舒服?很可能是視覺(jué)平衡沒(méi)有做好

比如一般這樣去“配重”的元素會(huì)是一個(gè)按鈕或者標(biāo)題。

重要信息(或者是行動(dòng)按鈕)就是我們需要去配重的價(jià)值元素。

不對(duì)稱的現(xiàn)象越嚴(yán)重,用戶就越想找出其中的原因(檢查配重)。人們本能地比平時(shí)更仔細(xì)地研究這樣的畫(huà)面。然而,這里需要注意分寸,過(guò)于古怪的構(gòu)圖并不總是能被很好的感知。

三、徑向平衡

為什么你的設(shè)計(jì)總感覺(jué)不舒服?很可能是視覺(jué)平衡沒(méi)有做好平衡中的另一種類型,特點(diǎn)是視覺(jué)元素從一個(gè)共同的中心點(diǎn)放射出來(lái)。徑向平衡在設(shè)計(jì)中不常用。它的優(yōu)點(diǎn)是,注意力很容易找到并保持一個(gè)焦點(diǎn)——恰好就在它的中心,這通常是構(gòu)圖中最引人注目的部分。

四、馬賽克平衡

這是一種平衡中的混亂,就像 Jackson Pollock的畫(huà)作一樣。這樣的組成沒(méi)有突出的焦點(diǎn),所有的元素都有同樣的視覺(jué)重量。沒(méi)有層次,乍一看,畫(huà)面就像視覺(jué)噪音,但所有元素又相互匹配,形成一個(gè)連貫的整體。

(彩云注:這是一種比較高階的設(shè)計(jì)平衡處理手法,用的好可以讓畫(huà)面非常具有設(shè)計(jì)感,但把握不好的話,就會(huì)非常凌亂。所以,我們平時(shí)能看到很多大師的作品看似一些簡(jiǎn)單圖形的使用,但就是好看,輪到自己設(shè)計(jì)的時(shí)候就會(huì)發(fā)現(xiàn),越簡(jiǎn)單的設(shè)計(jì)似乎越難設(shè)計(jì)好。)

為什么你的設(shè)計(jì)總感覺(jué)不舒服?很可能是視覺(jué)平衡沒(méi)有做好

五、視覺(jué)平衡的秘密?

當(dāng)談到構(gòu)圖中的重量平衡時(shí),他們經(jīng)常將其與物理世界中的重量進(jìn)行比較:重力、杠桿、重量和支點(diǎn)。我們的大腦和眼睛感知平衡的方式非常類似于力學(xué)定律。我們很容易把一幅畫(huà)想象成一個(gè)在某一點(diǎn)上平衡的平面,就像一個(gè)天平。如果我們?cè)趫D像的邊緣添加一個(gè)元素,它就會(huì)失去平衡,有必要修復(fù)它。元素是否是一組色調(diào)、顏色還是點(diǎn)并不重要,目標(biāo)是找到圖像的視覺(jué)“重心”,即圖像的重心。

不幸的是,沒(méi)有精確的方法來(lái)確定一個(gè)物體的視覺(jué)質(zhì)量。一般來(lái)說(shuō),設(shè)計(jì)師依賴于他們的直覺(jué)。不過(guò),下面這些有用的觀察可能會(huì)有所幫助:

1)大小

大的物體總是更重。

2)形狀

不規(guī)則形狀比規(guī)則形狀的元素輕。

3)顏色

暖色比冷色重。

為什么你的設(shè)計(jì)總感覺(jué)不舒服?很可能是視覺(jué)平衡沒(méi)有做好

4)色調(diào)

深色物體比淺色物體重。

5)圖案

帶有圖案的元素顯得更重。

6)3D

帶有紋理貼圖的元素顯得更重。

為什么你的設(shè)計(jì)總感覺(jué)不舒服?很可能是視覺(jué)平衡沒(méi)有做好

7)位置

物體離中心越遠(yuǎn),其視覺(jué)重量越大。

8)方向

垂直元素比水平元素更重。

9)密度

許多小元素可以抵消一個(gè)大元素。

為什么你的設(shè)計(jì)總感覺(jué)不舒服?很可能是視覺(jué)平衡沒(méi)有做好

10)內(nèi)部復(fù)雜性

物體內(nèi)部越復(fù)雜,視覺(jué)重量更大。

11)填充空間關(guān)系

正形空間比負(fù)形空間更重。

12)對(duì)重量的感知

照片中的啞鈴看起來(lái)會(huì)比一只鋼筆更重。

六、總結(jié)

當(dāng)使用對(duì)稱時(shí),作品看起來(lái)可以更加的專業(yè)和有科學(xué)性。其中,靜態(tài)對(duì)稱的作品顯得更加有專業(yè)精神和嚴(yán)肅的;而動(dòng)態(tài)對(duì)稱的設(shè)計(jì)方法則能吸引用戶的興趣,表達(dá)出個(gè)性和創(chuàng)造力,能讓用戶集中注意力。

作者:彩云sky
來(lái)源:人人都是產(chǎn)品經(jīng)理
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司

分享本文至:

日歷

鏈接

個(gè)人資料

存檔