11招!提升設(shè)計(jì)的立體感、深度感
為設(shè)計(jì)增加深度能夠讓你的設(shè)計(jì)看起來(lái)更寫實(shí),而且也有視覺(jué)趣味。營(yíng)造出一種三維的延伸感,從而讓觀看者陷入你的設(shè)計(jì)之中。而且,還能幫助你在你想要的地方構(gòu)建視覺(jué)切入點(diǎn)。
我們是三維的存在,我們周圍的物體也是三維的,但是屏幕是二維的,缺少的那個(gè)維度意味著在頁(yè)面上的視覺(jué)表現(xiàn)要比真實(shí)生活的視覺(jué)感差。通過(guò)一些圖形手段,把缺少的那維找回來(lái)可以提升真實(shí)感,一種物理感。
那我們?cè)鯓釉谠O(shè)計(jì)中創(chuàng)造深度呢?
深度感暗示
首先,有兩種深度暗示:
一種是圖形暗示——可以在真實(shí)的繪畫或者相片中再現(xiàn)質(zhì)感;
一種是非圖形暗示——不能在真實(shí)的繪畫或者相片中再現(xiàn)質(zhì)感;
(繪畫藝術(shù)家把他們使用的靜態(tài)單眼線索(觀察著和景物都是靜止的)稱為圖形暗示(pictorial cues),通過(guò)這些暗示,可在兩維的平面上產(chǎn)生出三維的深度效果。)
圖形深度暗示不會(huì)給整體設(shè)計(jì)造成突兀感,可以獨(dú)立的作用于不同的設(shè)計(jì)元素,最后所有元素統(tǒng)一匯合成你的設(shè)計(jì)時(shí),深度感就出來(lái)了。
每種暗示方式都有自己獨(dú)一無(wú)二的特性,表達(dá)了不同的視覺(jué)信息。每種暗示方式都用自己不同的方式去傳遞深度感。
很多用戶能夠在扁平化設(shè)計(jì)中尋找到深度感,因此問(wèn)題不在于是三維還是二維的設(shè)計(jì),問(wèn)題在于你怎樣選擇深度暗示的方式。
下面我將介紹一些圖形深度暗示的方法
圖形深度暗示
1、重疊
這是深度暗示中很強(qiáng)烈的暗示方法,它比其他方式都要好用,而且提供了一種物體間沖突的感覺(jué)。
當(dāng)一個(gè)物體被另一個(gè)物體所掩蓋的時(shí)候,那肯定在他們之間有縱深的空間。
被掩蓋的物體一定要設(shè)計(jì)的清楚,以便能夠識(shí)別他們的形狀。否則整體作品的感覺(jué)僵尸兩個(gè)形狀二維上緊緊貼在一切,而不是縱深關(guān)系。
透明度是重疊的方法之一,能夠讓我們清楚的了解到被掩蓋物體的情況。視差是另外的一種展現(xiàn)被掩蓋物體的方法。
從上面我們可以了解到,我們可以通過(guò)重疊的方法,把主要信息放在最上面,次要信息放在下面,讓主要信息掩蓋次要信息,同時(shí)營(yíng)造了一種縱深感。
2、尺寸和比例
大的物體看起來(lái)近一些,而小的物體看起來(lái)遠(yuǎn)一些,通過(guò)擺放不同尺寸的并且緊挨著的物體,能夠帶來(lái)一種感覺(jué)就是:并不是他們的實(shí)際尺寸不同,而是因?yàn)檫h(yuǎn)近縱深的原因。
如果我們把物體復(fù)制并延伸,創(chuàng)造了一系列形狀相似的物體,僅僅比例相同,那么縱深感就出來(lái)了。
信息組織上,重要信息放在近處,醒目點(diǎn),不重要的信息放遠(yuǎn)一點(diǎn)。
3、材質(zhì)
材質(zhì)的運(yùn)用會(huì)給人一種暗示,就是這有點(diǎn)像現(xiàn)實(shí)生活中視覺(jué)元素的表面。
材質(zhì)一般精細(xì)緊密,精密的材質(zhì)也能讓人聯(lián)想到現(xiàn)實(shí)生活中三維的物體。
4、直線透視法
通過(guò)組織,將圖形中位置緊挨的平行線匯聚到一點(diǎn)或一處,能夠營(yíng)造一種三維視感。
單獨(dú)的線不能構(gòu)造三維視感,但是大量的線能。同時(shí)也可以暗示物體之間位置的關(guān)系。
透視法是在二維平面上構(gòu)建三維物體縱深感的技法典范。
5、陰影
從一個(gè)物體投射到另外一個(gè)物體上的陰影可以暗示他們之間的距離觀影。投影可能是我們用來(lái)增加縱深感最常用的方法。
當(dāng)陰影變得更小,更黑,形狀更銳,這就說(shuō)明離被投影物體更近了。如果顏色更淺,陰影更大,陰影越模糊,說(shuō)明與被投影物體更遠(yuǎn)了。
6、圖像面上的位置關(guān)系
物體越高,通常都表示離我們?cè)竭h(yuǎn)。
我們可以用現(xiàn)實(shí)生活中的例子表示。
我們?cè)谙路娇吹降臇|西比如(土壤、草地)這些東西我們身體都能所接觸到的,因此離我們很近
我們看到的云和天,我們無(wú)法觸及,在上方,因此離我們很遠(yuǎn)。
7、光影和明暗
正如投影那種方法一樣。光在物體的表面上產(chǎn)生的不同效果暗示出物體是三維的。
漸變、斜面、凹凸,都能展示出光影效果,從而展示縱深感。
而且可以通過(guò)光的明暗度來(lái)展示與光源的三維位置關(guān)系,如果亮一點(diǎn),說(shuō)明近,如果暗一點(diǎn),說(shuō)明遠(yuǎn)。
8、聚焦
眼睛所聚焦之處會(huì)清晰,其他的放會(huì)變得模糊。
越清晰的地方說(shuō)明離焦點(diǎn)越近,越模糊的地方說(shuō)明離焦點(diǎn)越遠(yuǎn);根據(jù)這種暗示,空間上的關(guān)系便建立了。
9、參照物
任何已知大小的物體都能給我們作為一種比較另外一種物體的參照物。根據(jù)兩種熟悉物體的大小比例的關(guān)系,我們隱約的可以感覺(jué)到他們的縱深關(guān)系或位置關(guān)系。
10、顏色對(duì)照
距離越遠(yuǎn),那么物體和背景之間的對(duì)照就小。因此更黑的投影看起來(lái)近。原因在于更具有對(duì)比性。再想下聚焦,越遠(yuǎn)的物體,越模糊,對(duì)比因此比較小。
11、顏色
黑色似乎遠(yuǎn)一點(diǎn),溫暖明亮的顏色似乎要靠近一點(diǎn)。
總結(jié)
更多的縱深度暗示方法能夠讓你更好的駕馭設(shè)計(jì),不同的深度暗示方法提供不同的深度質(zhì)感。
縱深感做的越好,那么前景和背景的差異越大,前景元素就能得以更好的圖形展示。
上面這些方法你用過(guò)幾種?我自己用過(guò)了集中,或許,一個(gè)更巧妙的問(wèn)題是”上面這些方法哪種你沒(méi)用過(guò)?”
可以嘗試一下沒(méi)用過(guò)的方法,探索,或許你會(huì)收獲意想不到的結(jié)果。
本文地址:http://pkvc.cn/tutorial/di1697.html
您可能還喜歡
- Macaron 馬卡龍系色譜 ;附HC(16進(jìn)制碼
- 7個(gè)手機(jī)版網(wǎng)頁(yè)設(shè)計(jì)的原則
- 折紙多邊形網(wǎng)頁(yè)背景效果制作教程
- 龐門正道:好好玩耍的點(diǎn)線面(上)
- 網(wǎng)頁(yè)設(shè)計(jì)中的常見(jiàn)頁(yè)面布局方式
- WAP APP的柵格設(shè)計(jì)
- 八種很漂亮的排版方法和技巧分享
- 網(wǎng)頁(yè)設(shè)計(jì)的首屏標(biāo)準(zhǔn)你了解多少?
- 字體大寶庫(kù):40款為網(wǎng)頁(yè)設(shè)計(jì)師準(zhǔn)備的時(shí)
- 視覺(jué)設(shè)計(jì)分享—專題頁(yè)面設(shè)計(jì)篇
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問(wèn)題
- 網(wǎng)頁(yè)設(shè)計(jì)精粹 網(wǎng)頁(yè)中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁(yè)UI - 原子設(shè)計(jì)理論(上)
- 如何通過(guò)設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺(jué)設(shè)計(jì)系列文章(二):全屏