作(zuò)者：美工美邦

「層次感」這個(gè)詞在設計中的出現頻率是很(hěn)高(gāo)的，主要體(tǐ)現在信息層級關系和(hé)視覺豐富度這兩點，而缺少(shǎo)層次感的設計會(huì)給人一種信息雜亂、畫(huà)面單調的視覺感受，甚至枯燥、乏味，這也恰恰與設計目的相悖。那(nà)麽當我們的作(zuò)品出現層次感缺失時(shí)，應該從哪些(xiē)方面着手改善、解決呢？本期內(nèi)容希望能對大(dà)家(jiā)有(yǒu)所幫助。

視覺元素差異化

營造視覺元素的差異化可(kě)以起到很(hěn)好的改變畫(huà)面信息層級關系的作(zuò)用，從而增強設計作(zuò)品的層次感，這和(hé)對比手法很(hěn)雷同。無論是畫(huà)面中的視覺元素多(duō)還(hái)是少(shǎo)，都要做(zuò)到有(yǒu)主有(yǒu)次、有(yǒu)大(dà)有(yǒu)小、有(yǒu)粗有(yǒu)細、元素與元素之間(jiān)形成對比關系，舉個(gè)簡單的例子：

很(hěn)明(míng)顯第一排的形狀之間(jiān)是完全相同的，在視覺上(shàng)給人的感覺就會(huì)很(hěn)平，缺少(shǎo)變化；而下面兩排在視覺上(shàng)都營造了一個(gè)與周圍存在差異化的視覺元素，使得(de)整體(tǐ)在視覺上(shàng)有(yǒu)了閱讀的先後順序，形成了簡單的信息層級關系。

當畫(huà)面中的視覺元素相同或者相似時(shí)，信息的層級關系就相對而言不容易體(tǐ)現出來(lái)，那(nà)麽此時(shí)就需要我們營造具有(yǒu)差異化的視覺元素打破這一現象，從而增強畫(huà)面的視覺層次感，無論切入點是什麽。再比如我們看到的風景照：

從近到遠在視覺上(shàng)存在着很(hěn)明(míng)顯的差異化，比如：近實遠虛、近大(dà)遠小、近處的飽和(hé)度高(gāo)遠處飽和(hé)度低(dī)、近處的明(míng)度暗遠處的明(míng)度亮等等，大(dà)自然的風景本身就能很(hěn)好地诠釋視覺層次感，所謂「設計源于生(shēng)活」正是如此。那(nà)麽這些(xiē)應用到設計中又應該如何體(tǐ)現呢？下面再看一個(gè)例子：

如果産品這麽擺放的話(huà)，那(nà)麽何來(lái)層次感而言呢？隻能理(lǐ)解為(wèi)重要的事情重複三遍。做(zuò)個(gè)小小的改變：

畫(huà)面有(yǒu)了大(dà)小關系，故而有(yǒu)了主次關系，此時(shí)視覺的層次感已經有(yǒu)所體(tǐ)現：

大(dà)小與虛實的雙重結合，視覺層次感更加強烈了，加點透視看看：

這裏做(zuò)了點透視效果，結合大(dà)小、虛實的變化，是不是有(yǒu)種由近到遠的既視感？通(tōng)過營造視覺元素的差異化，視覺層次感也更加強烈，這種虛實結合的形式在設計中也非常實用，下面我們再看案例：

這種虛實對比的形式也是視覺元素差異化體(tǐ)現形式之一，很(hěn)直觀地提升了整體(tǐ)的視覺層次感，包括在一些(xiē)文字排版中也很(hěn)實用。所以當我們的作(zuò)品整體(tǐ)視覺層次感不夠強烈時(shí)，不妨試試通(tōng)過營造視覺元素差異化的形式進行(xíng)提升和(hé)改變，隻是既然用了這種表現手法，就要做(zuò)得(de)足夠明(míng)顯，否則隻會(huì)适得(de)其反。

裝飾性元素

我們前面說了，提升視覺層次感可(kě)以從兩個(gè)點切入，即：提升信息層次感以及畫(huà)面整體(tǐ)豐富度，而裝飾性元素的使用剛好可(kě)以契合這兩點，它既有(yǒu)提升信息層次感的作(zuò)用，又能起到很(hěn)好豐富畫(huà)面的作(zuò)用。下面我們看個(gè)案例：

通(tōng)過上(shàng)下兩個(gè)案例的對比我們發現：

• 上(shàng)側案例畫(huà)面整體(tǐ)的豐富度欠缺，甚至感覺有(yǒu)些(xiē)空(kōng)；而且文字信息沒有(yǒu)形成很(hěn)好的對比關系，信息的層次感受也比較單一，所以給人感覺層次感不夠。

• 下側案例中用到了一些(xiē)裝飾性的文字、線條、形狀符号等，首先在視覺豐富度上(shàng)較上(shàng)側案例中就提升了很(hěn)多(duō)，不會(huì)給用戶一種空(kōng)的感覺。其次這些(xiē)裝飾性的元素與主文案在視覺上(shàng)也形成了很(hěn)好的對比，使得(de)畫(huà)面有(yǒu)了主次、大(dà)小之分，視覺形态的變化形式更多(duō)，視覺層次感也更加強烈。

• 裝飾性元素可(kě)以是文字、線條、形狀、圖形等等一些(xiē)點狀、線狀的元素，甚至于一些(xiē)塊狀元素（比如：水(shuǐ)印文字、産品等），目的是通(tōng)過增加畫(huà)面豐富度和(hé)視覺形态變化的多(duō)樣性提升整體(tǐ)視覺層次感。

需要注意：裝飾性元素也不能過多(duō)的使用，因為(wèi)過量使用很(hěn)容易在視覺上(shàng)形成散亂、不夠整體(tǐ)的情況，要根據實際情況合理(lǐ)使用。

使用肌理(lǐ)

使用肌理(lǐ)是設計中非常實用的一個(gè)設計手法，肌理(lǐ)有(yǒu)着很(hěn)好的豐富畫(huà)面、增加細節、提升層次感的作(zuò)用，比如可(kě)以用做(zuò)一些(xiē)海報的底紋、文字的材質，甚至是一些(xiē)形式感很(hěn)強的肌理(lǐ)可(kě)以作(zuò)為(wèi)畫(huà)面的抽象主體(tǐ)。下面舉個(gè)例子：

案例中将遠山(shān)風景圖片通(tōng)過透明(míng)度調整作(zuò)為(wèi)肌理(lǐ)使用，這樣做(zuò)的好處在于：首先肌理(lǐ)相較于整個(gè)畫(huà)面來(lái)說不是那(nà)麽顯眼，這樣就避免搶了主體(tǐ)；其次因為(wèi)遠山(shān)給人的視覺感受就是層次感強烈，而這裏當作(zuò)肌理(lǐ)既起到了一定的填充、豐富的作(zuò)用，又保留了一些(xiē)遠山(shān)的屬性，在視覺上(shàng)層次感更加強烈。

再比如一些(xiē)文字也會(huì)使用肌理(lǐ)，用于增強文案信息的視覺層次感受，比如：

主要字體(tǐ)使用肌理(lǐ)會(huì)在讓其形象更加鮮明(míng)，與正常文案形成對比，也能間(jiān)接提升文字排版的視覺層次感。

改變配色形式

當作(zuò)品視覺層次感不夠強烈時(shí)，我們可(kě)以轉化為(wèi)思考如何提升畫(huà)面豐富度以及信息層次感。比如前面說的：對比、裝飾元素、肌理(lǐ)都可(kě)以與之對應起來(lái)，那(nà)麽為(wèi)什麽說合理(lǐ)的使用色彩在一定程度上(shàng)也能起到提升視覺豐富度的作(zuò)用呢？下面舉個(gè)例子：

這裏是通(tōng)過有(yǒu)彩色與無彩色的案例對比，以視覺感受來(lái)看：左側明(míng)顯比右側顯得(de)更空(kōng)一些(xiē)，因為(wèi)色彩也是一種信息傳達的媒介，也就是說顔色也在傳遞信息，所以當畫(huà)面顯得(de)空(kōng)、缺少(shǎo)層次感的時(shí)候，通(tōng)過顔色的調整也能起到一定的增加視覺層次感的作(zuò)用，舉個(gè)例子：

這裏隻是改變了底色，在視覺豐富度上(shàng)給人的感受差距一目了然，因為(wèi)純白底會(huì)給人一種空(kōng)、缺少(shǎo)內(nèi)容的視覺感受，所以一般情況下我們的處理(lǐ)方式會(huì)選擇添加一些(xiē)視覺元素，比如：裝飾性元素、材質、線條等等，現在我們又多(duō)了一個(gè)選項，就是無彩色向有(yǒu)彩色的改變，雖然這種方法有(yǒu)一定的局限性，但(dàn)也不失為(wèi)一種可(kě)行(xíng)的解決方式。

營造疊加關系

其實這種營造前後疊加關系的方式在之前的文章中也提到過，其實就是尋找元素與元素之間(jiān)的物理(lǐ)疊加關系，會(huì)給人一種很(hěn)強烈的層次變化，對于提升畫(huà)面層次感能起到立竿見影(yǐng)的作(zuò)用，比如：

案例中的文字與主體(tǐ)物之間(jiān)存在着視覺上(shàng)的前後疊加關系，給用戶更強烈的視覺層次感，這種營造前後疊加關系的處理(lǐ)手法在标題設計中也很(hěn)實用。

透視

透視也可(kě)以理(lǐ)解為(wèi)營造空(kōng)間(jiān)關系的手法，當平面的視覺元素賦予其透視關系後，會(huì)形成一種類似三維空(kōng)間(jiān)的視覺感受，在一定程度上(shàng)也能起到增強畫(huà)面視覺層次感的作(zuò)用。下面舉個(gè)例子：

很(hěn)明(míng)顯，透視的感覺會(huì)給人一種空(kōng)間(jiān)感、延伸感，視覺層次更加強烈，這種形式在日常的設計中也很(hěn)實用，比如：

改變透視會(huì)在視覺上(shàng)形成一種縱向的延伸感，空(kōng)間(jiān)上(shàng)層次關系更加強烈，隻是這種形式有(yǒu)一定的局限性。

案例

結合今天所說到的這些(xiē)手法，通(tōng)過不斷演變的形式，我們簡單做(zuò)一組文字排版的案例：

這就是一句普通(tōng)的話(huà)，沒有(yǒu)主次、沒有(yǒu)修飾、毫無層次感，改變一下：

已經有(yǒu)了信息的層級關系，即大(dà)小對比，視覺元素之間(jiān)形成了差異化的表現，還(hái)可(kě)以繼續深入：

通(tōng)過改變顔色，對比更加強烈，層次感稍加增強，感覺還(hái)不夠？下面我們繼續再改：

這裏通(tōng)過肌理(lǐ)、虛實結合以及改變字體(tǐ)形态的表現形式，使得(de)整體(tǐ)視覺層次感又提升了一個(gè)檔次，如果還(hái)想繼續提升，那(nà)麽就要想，還(hái)缺少(shǎo)點什麽？比如裝飾性元素試一試？

增加了裝飾性元素之後，畫(huà)面整體(tǐ)的豐富度提升了很(hěn)多(duō)，而且對比的形式更多(duō)元化。案例中主要用到了：差異化元素、對比、肌理(lǐ)、裝飾性元素這四種表現形式，當然這也許不是最好的表現形式，目的是為(wèi)了讓理(lǐ)論成為(wèi)實踐。

總結

當作(zuò)品缺少(shǎo)層次感時(shí)，上(shàng)述的一些(xiē)改變方法可(kě)以供大(dà)家(jiā)參考，但(dàn)是不要僅僅局限于這些(xiē)，還(hái)有(yǒu)一些(xiē)我們常用的，比如：投影(yǐng)就非常實用，可(kě)以給文字、色塊、主體(tǐ)物等等做(zuò)投影(yǐng)，拉開(kāi)前後關系，這樣也會(huì)一定程度上(shàng)增強視覺層次感。再比如：倒影(yǐng)、環境感等等，這些(xiē)目的都是盡可(kě)能去豐富畫(huà)面、營造信息層次關系。并不是說這些(xiē)手法一定要完全體(tǐ)現在一個(gè)作(zuò)品上(shàng)，層次關系過多(duō)反而會(huì)使得(de)畫(huà)面整體(tǐ)散亂，一定要根據實際情況選擇使用，切記并不是視覺層次數(shù)越多(duō)就越好，這是一個(gè)誤區(qū)。