別把設(shè)計(jì)只當(dāng)成是排版、配色···

有人可能會說，并沒什么明顯的問題啊，產(chǎn)品和賣點(diǎn)都很突出、排版清晰整潔、各元素對比很鮮明、色彩與產(chǎn)品調(diào)性也是相符的，要不把字體再設(shè)計(jì)一下？把圖片再修漂亮一點(diǎn)。以上說的這些觀點(diǎn)都是對，但是你們有沒有發(fā)現(xiàn)一個問題，就是這些觀點(diǎn)的關(guān)注點(diǎn)都是在一些具體的細(xì)節(jié)上，比如排版、配色、字體設(shè)計(jì)、修圖等方面，卻沒有從整體去評估這件作品是否有完成設(shè)計(jì)需求，可不可以讓它的效果變得更好。產(chǎn)品主圖的首要目的是要吸引消費(fèi)者的注意，而上圖在這一方面做得明顯不夠，因?yàn)樗炔皇呛芷粒曈X沖擊力又不太強(qiáng)；既沒有與同類產(chǎn)品的主圖有明顯差別，也沒什么意思，這樣的設(shè)計(jì)通常很難讓客戶買單，就算客戶買單了實(shí)際效果也不會太好。而如果我們在設(shè)計(jì)形式做一點(diǎn)更改，比如像下圖這樣，不是直接的羅列文字和圖片，而是把設(shè)計(jì)形式與產(chǎn)品的屬性結(jié)合起來，是不是就比上圖更新穎、更有趣了一點(diǎn)。

這里并沒把功夫花在字體設(shè)計(jì)上，因?yàn)楸匾圆淮蟆Ｋ哉f，不論是做設(shè)計(jì)還是看設(shè)計(jì)，我們都應(yīng)該要遵循從大到小、從整體到局部的過程，先保證有一個好的大方向，再去完善細(xì)節(jié)。具體如何做呢？接下來我將從四方面來詳細(xì)闡述。

◇◆  一、準(zhǔn)確傳達(dá)訴求  ◆◇

這是平面設(shè)計(jì)最重要也是最基本的原則，卻經(jīng)常會被很多設(shè)計(jì)師忽略，所以我們可以看到很多作品花里胡哨，卻連自己想要傳達(dá)什么信息都沒講清楚，或者會讓人產(chǎn)生誤解，這是很可笑的。那么想要準(zhǔn)確傳達(dá)訴求該怎么做呢？

1.信息要便于閱讀

a.重點(diǎn)信息要突出。將標(biāo)題、標(biāo)題中的關(guān)鍵字、價格、優(yōu)惠信息、活動時間、電話號碼等，用大一點(diǎn)的字號、粗一點(diǎn)的字體突出，不僅能提升其傳達(dá)率，還能使文字排版更有張弛。比如下面這則海報：

從總體來看，版面下方的主題被重點(diǎn)突出，上面的信息相對弱化。

從局部來看，在主題中，設(shè)計(jì)師又特別突出了“該你上場”這幾個字，這么處理會便于讀者快速了解海報的核心內(nèi)容。

b.信息分類明確。在一張海報中，信息可能會有很多，如主題、副標(biāo)題、小標(biāo)題、內(nèi)文、時間、地址、電話等信息，這時就要將它們進(jìn)行合理的分類，以免信息太過繁雜、相互干擾，影響閱讀。例如下圖的信息就很明顯地被分成了五大塊，可以讓讀者很清晰地閱讀、理解版面上的信息。

在這里，設(shè)計(jì)師合理運(yùn)用了間距的關(guān)系，以及統(tǒng)一各同類信息的排版方式、元素、色彩等，來達(dá)到版面中各信息的統(tǒng)一與區(qū)隔。

除了以上這兩點(diǎn)外，把文字對齊排列、保證字體的識別性以及文案的正確閱讀順序等等，都能提升信息的易閱讀性。

 

2.創(chuàng)意簡單、準(zhǔn)確

創(chuàng)意可以使設(shè)計(jì)變得更有趣、更有內(nèi)涵，但創(chuàng)意也會在一定程度上提高理解的門檻，所以在商業(yè)設(shè)計(jì)中的創(chuàng)意一定要簡單且準(zhǔn)確。比如下圖是我早前做的一則冰箱廣告，想表達(dá)該冰箱保鮮功能好的訴求，雖然創(chuàng)意很有趣，但老實(shí)說理解起來會有一點(diǎn)難度。

下圖的海報同樣也是要表現(xiàn)冰箱保鮮功能效果好，但該創(chuàng)意更直觀，所以理解起來會簡單很多，而且形式上也并不是太常規(guī)。

 

3.配圖與主題相符

圖片是設(shè)計(jì)的主要構(gòu)成元素，它不僅能使版面更好看、增強(qiáng)視覺沖擊力，而且圖片本身也能夠傳遞信息，幫助受眾理解。當(dāng)然，前提是你配的圖片在調(diào)性和寓意上要與主題相符，如果只是覺得圖片好看就放上去是不可取的。

以上是給同一個主題配上不同畫面的兩個設(shè)計(jì)方案，很明顯左圖比右圖在調(diào)性上和元素內(nèi)容上要更符合主題的需求。

◇◆  二、設(shè)計(jì)調(diào)性與主題相符  ◆◇

1.字體相符

特別是標(biāo)題字體，由于字號一般比較大，占的空間也比較大，它的風(fēng)格會影響到整個畫面的調(diào)性，所以你要有能力評判什么樣的主題、畫面，適合使用什么類型的字體，這一點(diǎn)你可以去看看同類產(chǎn)品、品牌設(shè)計(jì)的做法。

在logo設(shè)計(jì)中字體調(diào)性也要與品牌和圖形相符，下圖是一個互聯(lián)網(wǎng)品牌的Logo，它的圖形是由幾何色塊組合成的一只鳥，那它的標(biāo)準(zhǔn)字用什么類型的字體更合適呢？通過對比我們可以看出左圖的字體比右圖的字體更合適一些，因?yàn)榍罢叩娘L(fēng)格與圖片的調(diào)性更統(tǒng)一。

 

2.顏色相符

色彩本身是具有一定寓意的，所以在搭配顏色時，要選擇與主題寓意相近的色彩。例如下圖是一則境外銀行卡的banner，主題和配圖都跟旅游相關(guān)，而背景卻用了玫紅色，雖然紅色、藍(lán)色、白色搭配在一起很漂亮，但在調(diào)性上與旅游不相符，因而不是一個好的選擇。

所以我重新搭配了一個寓意自然、純凈的藍(lán)色背景。

 

3.風(fēng)格相符

設(shè)計(jì)的風(fēng)格有很多，但并不是使用什么樣的風(fēng)格都行，例如目標(biāo)消費(fèi)群是年輕女生的面膜包裝設(shè)計(jì)適合使用二次元風(fēng)格。

而以中老年人為目標(biāo)消費(fèi)群體的保健品包裝就不大適合這種風(fēng)格，它比較適合的是中國風(fēng)和復(fù)古風(fēng)。

嬰兒奶粉的廣告一般會用寫實(shí)或插畫風(fēng)格，以表現(xiàn)產(chǎn)品健康、天然的特質(zhì)。

而藝術(shù)感比較強(qiáng)、色彩比較濃重的波普風(fēng)就不適合該類品牌的設(shè)計(jì)。

 

4.形式相符

形式對設(shè)計(jì)的氣質(zhì)和吸引力有很大的影響，例如以文字作為主題搭建場景的設(shè)計(jì)形式，比較適合主題類海報，或者產(chǎn)品是服務(wù)的海報設(shè)計(jì)，但不太適合做以實(shí)物產(chǎn)品為主的海報設(shè)計(jì)，因?yàn)樵撔问經(jīng)]法突出產(chǎn)品。

還有下圖這種發(fā)散構(gòu)圖的形式，適合表現(xiàn)比較酷、比較熱鬧的主題，但不太適合表現(xiàn)溫馨、安靜等主題。

 

5.版式相符

不同的排版方式也是有調(diào)性差別的，比如下圖是一則蘋果電子手表的輪播圖，圖片部分給人的感覺比較高大上，所以文字的排版像下圖一樣簡簡單單就可以了。

而如果像下圖一樣用藍(lán)色塊將文字突出，并且刻意的與logo錯位排版，反而給人很low的感覺，與品牌以及圖片調(diào)性都不匹配。

 

6.元素相符

即使是表現(xiàn)統(tǒng)一內(nèi)容的元素，其調(diào)性也是會有很大差別的，比如由于五官、發(fā)型、著裝、表情的不同，會導(dǎo)致模特的氣質(zhì)也有很大差別，有的會偏向樸實(shí)、有的比較商務(wù)、有的比較潮、有的比較冷酷、有的比較溫暖等等，我們再給畫面搭配模特時也要選擇氣質(zhì)匹配的。例如下圖的氛圍比較時尚，所以應(yīng)該搭配一個外表看起來比較潮的模特。

而下圖的模特穿著比較職業(yè)，所以不太適合用在這里。

 

◇◆ 三、形式要有吸引力  ◆◇

做好了前兩點(diǎn)還僅僅是把設(shè)計(jì)做對了而已，想要做好，表現(xiàn)形式很關(guān)鍵。文章開頭列舉的例子之所以中規(guī)中矩，就是因?yàn)楸憩F(xiàn)形式太普通，蔥爺通過總結(jié)發(fā)現(xiàn)，優(yōu)秀的表現(xiàn)形式必須滿足有趣、新穎、視覺沖擊力強(qiáng)，這三者中的至少一個條件。

 

1.有趣

設(shè)計(jì)形式有趣的作品相比無趣的作品更有活力，更能獲得受眾的好感，所以有趣也是評判設(shè)計(jì)好壞的一個重要指標(biāo)。我們可以通過圖形創(chuàng)意、擬人、增加互動、使用小孩或動物元素等方式，來增加設(shè)計(jì)的趣味性。

▲上圖采用擬人的手法來增添趣味性。

 

▲上圖把可愛的emoji表情與人物結(jié)合，表現(xiàn)手法新穎而有趣。

 

▲上圖把文字當(dāng)成實(shí)物來與圖片元素發(fā)生互動，也挺有意思。

 

2.新穎

如果你總是用很常規(guī)、很老的表現(xiàn)形式做設(shè)計(jì)，不僅會很無聊，而且很難起到好的效果，因?yàn)榭蛻艉拖M(fèi)者都已經(jīng)視覺疲勞了。所以每次做設(shè)計(jì)的時候，不要總想著按按最常見、自己最熟悉的方式來做，而是要想想怎么帶給受眾新的視覺體驗(yàn)，我們可以跨行業(yè)去找參考，很多在其他行業(yè)比較常見的形式，在本行業(yè)中可能還是香餑餑，也可以多運(yùn)用當(dāng)下比較流行的一些表現(xiàn)形式。

▲用真實(shí)人物與黑白漫畫結(jié)合起來是比較新穎的一種設(shè)計(jì)形式。

 

▲爆炸貼其實(shí)是虛擬的一個東西元素，把它當(dāng)成實(shí)物表現(xiàn)出來也是很新穎的做法。

 

3.視覺沖擊力強(qiáng)

由于消費(fèi)者每天接觸到的設(shè)計(jì)、廣告非常多，所以只有你的設(shè)計(jì)視覺沖擊力很強(qiáng)時，才有可能吸引到消費(fèi)者的注意力。想要有強(qiáng)烈的視覺沖擊，一個重要的手段就是在設(shè)計(jì)中創(chuàng)造強(qiáng)烈的對比，比如大小對比、色彩對比、空間對比、風(fēng)格對比等等。

▲上圖主要為色彩對比與質(zhì)感對比

 

▲上圖為空間對比，前面的老虎由于離鏡頭非常近，所以有很強(qiáng)的親近感。

 

還有一種形式的視覺沖擊也很強(qiáng)，就是創(chuàng)造一種全新的視覺，比如下圖把立體字當(dāng)成披風(fēng)一樣與前面的人物結(jié)合起來，就是以前沒有過的做法，所以視覺沖擊力也很強(qiáng)。

 

◇◆ 四、細(xì)節(jié)到位  ◆◇

一件作品如果能夠做好前面三條，就應(yīng)該是一件不錯的作品了，過稿的成功率也會比較高，但想要更上一層樓就得靠細(xì)節(jié)的執(zhí)行了，這一點(diǎn)很考設(shè)計(jì)師的功底，所以很多新手在細(xì)節(jié)方面都處理不好，奇怪的是他們都很喜歡把精力用在細(xì)節(jié)的處理上。好吧，既然如此，蔥爺也來說幾個在設(shè)計(jì)中要注意的細(xì)節(jié)。

 

1.文字行距

行距是很小的東西，但在排版中很關(guān)鍵，以下圖的名片設(shè)計(jì)為例，左右兩個方案除了行距有點(diǎn)差別，其他地方都是一樣的，但是明顯可以感覺到，右圖的排版比左圖要舒服很多？這就是行距的作用。

從下圖中我們可以看出，其實(shí)左右圖方案在文字行距的控制上非常講究。

一般來說，正文的行間距至少要大于字間距三倍以上，而且不同信息之間的行距要大于同類信息之間的行距。

 

2.裝飾元素

裝飾元素可以豐富版面、增添氛圍，而且還可以增加設(shè)計(jì)的精致感，下圖是一則banner，整體感覺還是比較大氣的的，但總感覺少了點(diǎn)什么東西，對，就是裝飾元素，所以中間白色塊部分顯得很單調(diào)。

而下圖的解決方案是在人物后面以及其他空白的地方增加了一點(diǎn)裝飾的圖形和文字，感覺是不是好多了。

注意，裝飾元素的調(diào)性要與畫面相符，且不能干擾主要元素。

 

3.保證元素與版面的關(guān)聯(lián)性

版面中的任何一個元素都不應(yīng)該是獨(dú)立存在的，它一定在某方面與版面中的其他元素存在關(guān)聯(lián)，比如位置、顏色、字體、輪廓、邏輯等方面。

例如上圖大大小小的元素有很多，但是各元素之間的關(guān)系我們通過下圖就可以看出來。主要是排版位置與色彩的關(guān)聯(lián)。

 

4.背景的處理

以海報設(shè)計(jì)為例，背景一般需要起到以下三個作用：1.突出主體；2.增添整體的氛圍；3.使設(shè)計(jì)更精致、更有品質(zhì)感。

上圖的背景只使用了兩個色彩相近的色塊，感覺非常單調(diào)，主體也沒有得到明顯的突出，并且視覺上左輕右重不平衡。

在上圖的方案中，背景中的大色塊改成了漸變灰色，人物與前面的色塊得到了有效突顯；并且把人物素材二次使用疊印在背景中，增添了背景的豐富性以及與主體的關(guān)聯(lián)。

 

5.各元素之間的統(tǒng)一協(xié)調(diào)性

一件完整的設(shè)計(jì)作品通常是由多個不同的元素組成的，而這些元素組合在一起是否統(tǒng)一和諧，則決定這件作品給人的舒適度。比如下圖就結(jié)合了很多的元素，雖然很節(jié)制地控制了顏色的數(shù)量，但整體給人的感覺還是不太和諧。

認(rèn)真觀察我們就可以發(fā)現(xiàn)上圖的元素組合有以下幾個問題（如下圖所示）：

• 標(biāo)1的地方把高矮建筑左右分布，視覺不平衡；
• 標(biāo)2的地方把小樹放在最左邊，視覺不平衡；
• 標(biāo)3的地方都是單獨(dú)放一個元素，太孤立；
• 標(biāo)4的地方人物擋住無限符號右邊孔的空間太多，不透氣。
• 標(biāo)5的三個元素以飄在空中的方式結(jié)合進(jìn)來顯得太隨意，不自然。

所以我在此基礎(chǔ)上做了一些調(diào)整：

• a.讓所有元素盡量在一個矩形內(nèi)，這樣整體看起來會比較平衡；
• b.把扎堆在一起的建筑采用三角形構(gòu)圖排列，平衡性更好；
• c.把孤立的元素與其他元素并在一起；
• d.人物往中間移動，使其既要平衡畫面又不要擋住無限符號的孔太多；
• e.給飄散的幾個Icon增加了光線，讓它們更自然地融入主體。

 

結(jié)語

終于寫完啦！由于本文討論的是一個大而全的話題，信息量很大，幾乎涵蓋了所有設(shè)計(jì)中比較關(guān)鍵的問題，所以也沒法把每個問題都說得很細(xì)，但核心觀點(diǎn)就是一句話：大感覺比細(xì)節(jié)更重要，先把大感覺做對了、做好了，再去打造細(xì)節(jié)。

 

原文地址：蔥爺（公眾號）

作者：蔥爺