在之前的文章《新媒體運營必需知道的 4 個設(shè)計原則》中,琛姐談到過?4 個設(shè)計的基本原則——親密性、對齊、重復(fù)、對比。
本文是對「對比」原則的修正和補(bǔ)充。
對比的目的主要有 2 個,一個是打破統(tǒng)一的版面設(shè)計,增強(qiáng)視覺效果。比如,差不多的兩個拳頭放在一起時,畫面很平淡,因為只存在方向的對比:
但如果是一個老人的拳頭和一個小孩的拳頭出現(xiàn)在同一畫面,視覺效果就會強(qiáng)烈很多,因為同時存在方向、大小、糙嫩3種類型的對比:
對比的另一個目的是組織信息邏輯。完全統(tǒng)一的版面無法有效閱讀,只有通過對比,讀者才能對信息邏輯一目了然,對比越強(qiáng)烈,信息邏輯就越清晰。
比如,一篇文章一般由標(biāo)題、小標(biāo)題、正文組成,如果標(biāo)題和正文間的對比不夠強(qiáng)烈,就很難一眼看出文章的邏輯,比如下面左圖中,只有文字大小的對比,小標(biāo)題就不夠顯眼,辨識較困難,如果加強(qiáng)對比,增加粗細(xì)和顏色的對比,改成右圖的樣式,對比就非常鮮明了,信息邏輯也就一目了然。
對比的方式主要有:方向?qū)Ρ?、形狀對比、色彩對比、字體對比和圖文對比。
1.方向的對比
排版布局時,可以采用不同的方向進(jìn)行對比,比如下圖中縱向文字和橫向文字就形成了鮮明的對比:
這種方向的對比不只存在于文字和文字之間,也可以運用于圖像和文字間,比如下圖的海報中,圖像主體中的地平線是水平的,橫向的,文字部分是垂直的,縱向的,方向的對比也非常鮮明。
公眾號 HomeFacialPro 的排版中也采用了這種方向的對比,標(biāo)題部分采用縱向布局,正文部分橫向排列,整體視覺效果非常靈動。
公眾號Voicer中的部分插圖也使用了橫向和縱向文字的對比,并增加了動態(tài)效果,進(jìn)一步強(qiáng)化了對比。
2.形狀的對比
1)大VS小
同時放置2張或2張以上的圖片時,常規(guī)的方式是將2張圖設(shè)置成同樣的尺寸和比例:
但這樣很容易顯得單調(diào)、乏味,更好的辦法是加入尺寸的對比,比如,將上圖中的其中一個對象縮小,在尺寸上和另外一個對象形成對比,改成下圖這樣,整體效果會更生動、活潑:
2)幾何VS有機(jī)
大部分形狀可以分為幾何形狀和有機(jī)形狀 2 大類。
幾何形狀主要包括正方形、矩形、三角形、圓形等規(guī)則形狀(如下圖左),有機(jī)形狀主要是指受自然啟發(fā)的不規(guī)則形狀(如下圖右)。
規(guī)則的幾何形狀可以和不規(guī)則的有機(jī)形狀形成很好的對比。比如,下面的這張海報就是由規(guī)則的外矩形框和不規(guī)則的內(nèi)邊框組成,對比效果非常好。
3.色彩的對比
色彩的對比方案非常豐富,最為典型的有暖色和冷色的對比、亮色和暗色的對比、互補(bǔ)色對比等等,琛姐在之前的文章《新媒體運營必須知道的色彩搭配常識》中詳細(xì)講解過色彩相關(guān)概念,不清楚的童鞋可以點進(jìn)去看看,這里不再贅述。
一般來說,色輪的右上方是暖色,左下方為冷色。暖色給人的印象:生動、激情、有表現(xiàn)力,給人感覺在空間的位置靠前。適用于前景色。冷色給人的印象:謹(jǐn)慎、冷靜、平靜感,給人感覺在空間的位置靠后。適用于背景色。
所以,當(dāng)我們把這兩種顏色放在一起時,對比非常強(qiáng)烈,而且一般把冷色作為背景,暖色作為前景。比如,下面這張海報,就是采用冷暖色的對比,冷色(藍(lán)色)作背景,暖色(紅色)作前景。
明暗的對比非常常見,比如,下面的這張圖片,就是用暗色作背景,高亮的HOTEL標(biāo)志作前景,對比非常鮮明,主題很突出。
互補(bǔ)色是色輪上相對的2種顏色,互補(bǔ)色對比是色彩對比中最鮮明的組合之一,比如紅色和綠色。
這種對比非常鮮明,畫面沖突感很強(qiáng),故有“紅配綠,唱大戲”之說。因為這種搭配的不穩(wěn)定性,在正式的設(shè)計中比較少見。如果想特別引人注目,可以嘗試采用。比如,電影《三槍拍案驚奇》就大量采用了互補(bǔ)色的對比,整體視覺效果非常夸張。
4.字體的對比
字體可以分為襯線體和非襯線體 2 大類,襯線體的筆畫開始、結(jié)束的地方有額外的裝飾,而且筆畫的粗細(xì)會有所不同(如下圖左)。無襯線字體,沒有這些額外的裝飾,而且筆畫的粗細(xì)差不多(如下圖右)。
根據(jù)經(jīng)驗,最好選擇一種襯線字體和一種非襯線字體來設(shè)置對比,因為通常來說,互補(bǔ)的兩種元素會產(chǎn)生很好的對比效果。下圖logo中非襯線體和襯線體,以及書寫體的對比完美平衡了整個設(shè)計。
5.圖文的對比
在前面的平衡中我們已經(jīng)說過,圖片和文字的視覺重量是不一致的,一般情況下,遵循圖重文輕的原則,所以,將圖片和文字放在一起時,可以有效突出圖片,將圖片作為有效的視覺線索。比如,下圖中的箭頭符號,在一大片文字中顯得非常突出,成為了有效的視覺線索。
小結(jié)
對比的目的主要有 2 個,一個是打破統(tǒng)一的版面設(shè)計,增強(qiáng)視覺效果。另一個目的是組織信息邏輯。對比的方式主要有:方向?qū)Ρ?、形狀對比、色彩對比、字體對比和圖文對比。