網(wǎng)頁(yè)設(shè)計(jì)的視覺構(gòu)成 -3
作者:X設(shè)計(jì)聯(lián)盟 文章來(lái)源:X 設(shè)計(jì)聯(lián)盟
3. 面的視覺構(gòu)成: 線的推移形成面。面是無(wú)數(shù)點(diǎn)和線的組合。面具有一定的面積和質(zhì)量,占據(jù)空間的位置更多,因而相比點(diǎn)和線來(lái)說(shuō)視覺沖擊力更大更強(qiáng)烈。面的形狀可以大概的分為以下幾種:幾何型的面:方,圓,三角,多邊型的面在頁(yè)面中經(jīng)常出現(xiàn)。而一段文字也可以看做是一個(gè)方形的面; 有機(jī)切面:可以用弧形相交或者相切得到;不規(guī)則形的面和意外因素形成的隨意形面。面具有自己鮮明的個(gè)性和情感特征,在網(wǎng)頁(yè)的版面設(shè)計(jì)上,不同形狀的面之間的相互關(guān)系和整體的和諧需要我們?nèi)ナ炀毎盐?梢赃@么說(shuō),只有合理的安排好面的關(guān)系,才能設(shè)計(jì)出充滿美感,藝術(shù)加實(shí)用的網(wǎng)頁(yè)作品。
例一:
http://www.ibm.com
方形的面具有沉著,穩(wěn)重,厚實(shí),堅(jiān)強(qiáng)的男性特征。IBM的網(wǎng)站使用了大量方形的面,充分表達(dá)了這個(gè)國(guó)際公司深厚的背景和強(qiáng)大實(shí)力。在方形面的應(yīng)用上,大小有明顯的區(qū)別,重點(diǎn)突出。位置整齊但也有微小的變化,在嚴(yán)肅中透露輕松。在視覺中心的位置,放置頁(yè)面面積的深灰色的方形,配合線條、文字和色彩,以及頁(yè)面上的,亮麗的自由面(女性頭部)將重點(diǎn)信息完整強(qiáng)烈的表達(dá)出來(lái)。這個(gè)頁(yè)面可以說(shuō)是商業(yè)站點(diǎn)中的典范之作。
http://www.adobe.com
同樣是方形面運(yùn)用的典范之作。在這個(gè)頁(yè)面,面的大小和色彩對(duì)比更加強(qiáng)烈。頁(yè)面中部的幾個(gè)彩色塊也可以看做是點(diǎn),在豐富了頁(yè)面的色彩,起了點(diǎn)睛的作用。
例二:
http://www.apple.com/imac/
在這個(gè)頁(yè)面中,有機(jī)的接近流線形的面(蘋果電腦)占據(jù)了頁(yè)面的大部分位置,造成強(qiáng)烈的視覺沖擊。帶圓狐的稍微向右上方傾斜的有機(jī)三角形,充滿了時(shí)尚和流行的味道,在由多個(gè)透明按鈕組成的水平的面上,大方又帶有動(dòng)感,輕盈又不失穩(wěn)重。
http://www.newbeetle.co.uk/
圓形的面和自由形的面組成了一個(gè)極不穩(wěn)定的倒三角構(gòu)圖。加上網(wǎng)頁(yè)中動(dòng)態(tài)的高速向外沖的卡通飛車高手,制造了一個(gè)緊張的環(huán)境,讓觀眾在擔(dān)心之后,自然記住了這個(gè)特殊的視覺效果。倒三角形可以給人們活潑,新穎的感覺。倒三角面的不穩(wěn)定性,可以制造危險(xiǎn)的氣氛。
例三:
http://www.humongous.com
圓形的面給人以充實(shí)、圓滿、活潑的感覺,比較適合表現(xiàn)兒童或者女性特征。這個(gè)頁(yè)面充滿了天真和童趣,緊張之余,我們都希望能夠去這放松放松。同時(shí)這個(gè)頁(yè)面還采用了很多的動(dòng)態(tài)元素,符合兒童好動(dòng)的心理。
http://www.nike.com/usa/index.html
耐克的站點(diǎn)大量采用了接近圓形的幾何面,加上灌藍(lán)高手的精彩定格,使整個(gè)站點(diǎn)充滿了跳躍和運(yùn)動(dòng)的感覺。在這個(gè)頁(yè)面中,自由形(喬丹)的運(yùn)動(dòng)方向?qū)σ暰的引導(dǎo)起了很大作用,他將視線牽引到頁(yè)面的右上角。右上角的面所要推薦的產(chǎn)品,應(yīng)該是這個(gè)頁(yè)面的重點(diǎn)中的重點(diǎn)了。中間位置不同內(nèi)容的幾何面的運(yùn)用,避免了單純采用文字的單調(diào)感。既能夠最直接地反映產(chǎn)品的信息,又在色彩和版面上為整個(gè)站點(diǎn)活躍了氣氛,可謂是一舉多得。
例四:
http://www.h73.com/
不規(guī)則面和幾何面在頁(yè)面中交錯(cuò)出現(xiàn)。點(diǎn),線,面的綜合運(yùn)用,合理的布白(也是面),加上色彩的對(duì)比,形式新穎,使視線保持興奮,完美的實(shí)現(xiàn)了視覺傳達(dá)的目的。頁(yè)面中面的黑白灰的合理關(guān)系和安排,使頁(yè)面產(chǎn)生了空間層次,豐富了整體效果。
總結(jié) 自然界的萬(wàn)物形態(tài)構(gòu)成都離不開點(diǎn)、線、面。點(diǎn)、線、面是視覺構(gòu)成的基本元素,是每個(gè)網(wǎng)頁(yè)設(shè)計(jì)師必須熟練掌握的設(shè)計(jì)語(yǔ)言。點(diǎn)、線、面具有不同的情感特征,我們要善于采用不同的組合去體現(xiàn)不同的情感訴求。在網(wǎng)頁(yè)的視覺構(gòu)成中,點(diǎn)、線、面既是最基本的造型元素,又是最重要的表現(xiàn)手段。在我們確定網(wǎng)頁(yè)主體形象的位置、動(dòng)態(tài)時(shí),點(diǎn)線面將是需要考慮的因素。只有合理的安排好點(diǎn)線面的互相關(guān)系,才能設(shè)計(jì)出具有視覺效果的頁(yè)面,充分的表達(dá)出網(wǎng)頁(yè)最終的訴求!