設計原則:視覺重量與方向

網(wǎng)頁理論
2015-4-09 07:55:05 文/趙陽 圖/常詩琪

網(wǎng)頁上的每個元素都會通過發(fā)揮自身的視覺力量吸引觀者的眼球。而這種力量越大,吸引力也就越強。這些力量同時也能作用于其他元素,從而形成一種潛在的視覺運動方向,引導觀者的閱讀。
我們把這種力量叫“視覺重量”,把我們所感知到的視覺力量方向,叫做視覺方向。理解這兩個概念對于作品中層級、流程、節(jié)奏和平衡的打造具有重要的意義。
注:本文是設計原則系列文章第四篇。本系列前三篇為:
1. 設計原則:視覺感知力及完全形態(tài)原則
2. 設計原則:空間與圖形背景關(guān)系
3. 設計原則:通過對比與相似聯(lián)系或分離元素
視覺重量
物理學的重量是對地心引力施加于物體上的力的度量,但是二維的物體(例如網(wǎng)頁上的元素)沒有質(zhì)量,所以也就沒有物理范疇的重量可言。視覺重量是對元素吸引人眼球力量的度量。二維的物體都能夠吸引人的注意力。一個元素吸引力越強,其視覺重量也就越大。
在本系列的上一篇文章中,我談到了元素的原始特性或者叫固有特征,例如其尺寸、顏色和形狀等等。在文中,我還說到了如何通過這些特性來表現(xiàn)不同元素之間的對比與相似。
舉例來說,兩個元素一個很大一個很小就能形成鮮明的對比。
而通過組合這些不同的特性,我們就可以控制視覺重量。紅色比藍色更加吸引人,大的元素比小的元素更加吸引人,所以說,一個大的紅色物體所具有的視覺重量就要大于小的藍色物體。
那么這些特征或者說原始特性的集合,就決定了元素的視覺重量高低。要強調(diào)的是,決定元素視覺重量的不是單個特性,而是多個特性的組合。但不同的特性組合吸引人的力度也有不同。要打造具有不同視覺重量的元素,就需要結(jié)合不同的原始特性。
如何衡量視覺重量?
據(jù)我所知,精確衡量設計元素視覺重量的方法是不存在的。但你可以憑借經(jīng)驗和判斷力來分辨哪些元素重量大,哪些重量小。所以你要培養(yǎng)并相信自己的眼力。一幅作品中最吸引眼球的區(qū)域就是視覺重量比較高的區(qū)域。還是那句話,要相信自己的眼力。
但這并不是說你可以隨便亂試然后用眼睛判斷什么吸引力最強什么吸引力不夠強。舉個例,你可以通過把每個不同特征分離開來判斷出比較大的東西重量要大于比較小的東西。與此同時,你的眼力可以幫助你區(qū)分不同特性組合的視覺重量。
不過好在已經(jīng)有高人把各種不同的特征進行了分離和測試。下面是幾個元素特征以及其增減對視覺重量的影響說明。
首先我們來看上一篇文章中提到過的幾個原始特性:大小、顏色、色值、位置、材質(zhì)、形狀及朝向。
大小
比較大的元素相比小元素的視覺重量要高。
顏色
暖色能夠比較好的融入前景,比冷色重量高。冷色更傾向于融入背景。紅色是一般認為是重量最大的顏色,黃色則為最輕。
色值
較暗的元素視覺重量較高。
位置
在作品中所處位置較高的元素重量要大于所處位置較低的元素。距離作品中心或核心區(qū)域越遠,元素的視覺重量也就越高。前景中的元素所具有的重量要高于背景元素。
材質(zhì)
有材質(zhì)的元素重量大于無材質(zhì)物體。材質(zhì)能讓元素更具三維感,從而更表現(xiàn)出一定的質(zhì)量和物理重量感。
形狀
形狀規(guī)則的物體比不規(guī)則的物體重量較高。不規(guī)則形狀會讓人產(chǎn)生其質(zhì)量被從規(guī)則形狀中抽離的感覺。
朝向
垂直的物體重量高于水平物體。呈對角線放置的元素重量最高。
當然,你不一定要局限在上述的這些原始特性之中,大可通過其他的特征來掌控視覺重量。
密度
增加特定空間內(nèi)元素的數(shù)量能夠提高空間的視覺重量。在觀看者眼中,高密度的區(qū)域會結(jié)合成為一個較大、較暗的組合元素,而不再是幾個小的、淡色的元素。
局部留白
留白的空間呈現(xiàn)出空的狀態(tài),因此不具有任何視覺重量。因此,放置在留白空間中的物體就會在周邊環(huán)境的襯托下顯得更具重量。
內(nèi)在興趣點
不同的物體有趣程度也不盡相同。元素越復雜、越繁復會讓人興趣越高,從而吸引眼球的能力也就越強。在這一方面,個人的興趣點也發(fā)揮著作用。比方說,你對汽車的興趣大于飛機,那么汽車的圖片相比飛機就更能吸引你的注意力。
深度
較高的景深度能夠讓位于焦點的元素更具視覺重量,這一點有可能是焦點與非焦點區(qū)域之間的對比度造成的。
飽和度
飽和的顏色比不飽和顏色更重。
物理重量感覺
我們都知道房子的重量顯然大于鞋子的重量。那么,一所房子的圖片在視覺上也就自然比鞋子圖片更重,因為我們心里知道房子重。
在本系列上一篇有關(guān)于對比與相似的文章中,我提到了對比度能夠提高元素的吸引力。換句話說,一個與周邊環(huán)境對比強烈的元素在視覺上就比環(huán)境元素的重量更高。舉個例吧,在網(wǎng)頁上,圓形一般比矩形看起來更重,因為大部分網(wǎng)站元素都是矩形的。
當然,并不是所有特征對視覺重量的影響程度都相同。大部分人對元素顏色的注意力要先于元素形狀,這也就說明顏色對視覺重量的貢獻較大。同時你還要考慮特定作品的獨特性,因為形成對比的元素的重量要高于用來與之對比的元素。作品的獨特性將決定哪些東西能夠形成對比,哪些不能。
要牢記,視覺重量是上述各種屬性的組合。所以,盡管大的物體視覺重量高于小的物體,但一個周邊環(huán)繞大量留白空間、放置在頁面頂部的深色小圓形物體,其重量很可能會高于放置在頁面底部、形狀不規(guī)則的淺冷色大物體。
視覺重量與完全形態(tài)
本系列文章背后的一個重要目的就是指出完全形態(tài)原則對設計原則的貢獻度有多少。
圖形-背景
通過提高圖形相對背景的視覺重量,我們可以將這兩者進行分離。
鄰近
不同元素之間的空間會形成不同的局部留白空間量和不同的空間內(nèi)物體密度。
相似與對比
我們可以從視覺重量的角度來對這兩者分別進行定義。對比可以給形成對比的元素帶來較高的視覺重量。而視覺重量差不多的元素則會自然地表現(xiàn)出相似性。
焦點(本系列下一篇的主題)
一幅作品中的吸引點