信息流如何把控頁面設計，減少廣告浪費？
2018-03-19 點擊量：
一個能夠調動用戶消費欲的設計首先得是用戶愿意看的設計。否則，這個廣告就是浪費了一大半廣告費的廣告。本文要說的，就是如何通過把控頁面設計的色彩明度、排版、素材選擇等，做出讓用戶看得下去的廣告，進而起到催促目標用戶更快下單的作用，將廣告投放的性價比最大化。
色彩明快激發(fā)情緒
圖片的明度很容易影響我們的情緒。
大家都去過賣場，無論是超市、商場，還是柜臺……回憶一下，給我們留下的是什么樣的印象？
沒錯，就是亮！
為什么商場都要采光好、燈光亮呢？
因為在明亮的環(huán)境內，用戶的情緒更放松，而人在放松狀態(tài)下更容易跳過理性思考，做出決策——這種根據(jù)環(huán)境自發(fā)調整狀態(tài)的行為，是我們在進化過程中習得的被動技能。
我們人類還在進化過程中的時候，陽光明媚的天氣下，天敵不容易隱藏，我們可以放松的享受休閑時光，不需要繃緊神經讓自己可以面對隨時需要面臨的決策；
而在陰沉、暗淡的天氣里，我們無法清晰的看到敵人，也不能判斷是否會有狂風暴雨的降臨，這時候，如果我們走在外面，大腦就會高度緊張，隨時隨地進行運算，確保自己不會做出錯誤決策。
所以一般賣場環(huán)境會試圖通過營造一個好的光線環(huán)境，讓用戶情緒放松、精神亢奮，以期達成用戶少過腦子、盡快決策的效果。
對應到廣告頁面的設計上，當我們想要看到頁面的用戶盡快做出決策時，最好采用高明度、高飽和度的色彩，也就是營造一個“光線很好”的狀態(tài)。
比如顏色越接近白色，則這個色彩明度越高；越接近黑色，則色彩明度越低；而顏色越濃烈，則色彩飽和度越高，比如正紅、正黃，都是飽和度很高的顏色，而相對應的粉紅、暗黃的飽和度就偏低。
說一個大家都可以判斷的方法：在空氣清新，天氣好的自然光線下，我們看到的世界，就是一個高明度、高飽和度的世界——一起來回憶一下，是不是這樣的天氣下，天分外藍？花分外紅？光線分外明亮？心情分外舒暢？
同樣，面對類似的賣場環(huán)境、廣告頁面，人受到“好光線”氛圍的影響，思考似乎就不那么重要了，他會更在意心情和感受，也更容易受感性牽引做出決策。
這也是京東、淘寶等購物平臺的頁面采用高明度色彩的原因。
再比如下圖這個天貓主頁面，白色底的明度自然是最高的，而其他部位則是大面積的高、中飽和度的色彩，只有左側商品分類用了暗色調，占比較少。
這樣的頁面給人的總體感覺就是歡快的，明亮的，輕松的，對應的，人的思考的需求就會被忽略，決策速度就會變快。
與明快相對的，是暗沉。
暗沉的顏色，會讓人心情下沉，這種下沉，可以是安靜，也可以是沉重。在暗沉的顏色下，我們往往會覺得時間變得更慢，于是我們會靜下來思考。
對應的，當廣告的目的，是需要用戶思考時，或者想讓用戶感覺到安靜時，設計應當以暗色調配色或圖片為主，同時輔以冷淡風格的字體。
比如下面這張空氣凈化器的詳情頁首屏：
雖然色調是以暗色為主，但是對比度、飽和度搭配合理，就會讓人感覺冷靜，去思考頁面上給出的信息點（雖然思考了不見得懂），但是這些信息點是用戶本來就希望去看的，用戶希望通過這些數(shù)據(jù)自己去比對的這個機器好不好、值不值，那么用這樣的配色來襯托，讓用戶覺得自己的思考是理性的，就能更好的實現(xiàn)產品方的銷售目的。
再比如很多高端瑞士機械表會用暗色調背景凸顯產品，雖然用戶不見得懂，但是用戶會覺得有必要了解這個產品各方面的數(shù)值，當你給他營造出深沉思考的場景，把他們似懂非懂的重點列出，用戶的“比較心”就部分得到了滿足，可以減少用戶猶豫的時間。
而下圖這種價格偏低的時尚智能手表，就適合選用明快的色調，一方面可以凸顯表的風格，另一方面也是在用一種婉約的方式“催促”用戶盡快做出購買決定。
所以，如果你的產品是決策門檻較高的產品，那么無論創(chuàng)意怎樣煽動用戶的購買情緒，用戶也仍然會去思考、比較，這個時候，不如干脆用暗色調營造高端感，把用戶可能會對比的重點列出。
因為大多數(shù)的時候，用戶以為自己在獨立思考是否購買，但其實并沒有脫離設計和文案可以調控的范圍（但如果用戶存在超出設計和文案調控范圍的情緒了，我們就盡量不要去觸碰，避免引起的用戶反感）。
那么是否只要明度、飽和度對應了產品特性就全對呢？并不是。上面我們給出的，都是用色正確的示范，而有的圖片的色調應用錯誤，無論是什么樣的產品，都無法調動用戶的購買欲。
如果用明度、飽和度來解釋，可能很多人會覺得理解困難。我試著用更容易理解的方式講解一下下面這四個錯誤案例。
我們前面說過了，之所以要用明度高、飽和度高的圖片，是為了調動我們基因中對晴朗天氣比較安全的記憶，而黑暗、陰天、空氣不透亮的天氣里，危險隨時可能出現(xiàn)，我們的大腦會本能的緊張，高速運轉，抗拒。
所以我們看看上面這四個落地頁
左一，不僅整體色調暗沉，而且文字也很模糊，整體的感覺，是不是很像黑夜？左二，低明度、低飽和度、低對比度的色調，非常像霧霾天；左三，明度低的對比色搭配，就好像整個落地頁掉到了泥里；左四，艷粉、暗紅、草綠、灰、黑、米色的搭配，不僅感覺很亂，而且透出一股塑料假花的味道。
這四種配色，無論明度高低，我們都會說他的顏色用的“臟”，沒有讓我們感受到“靜謐美好”，而是讓人心情暗沉，甚至厭惡。
圖片相關增強興趣
很多信息流廣告，都是寫標題的管標題，配圖片的管配圖，即使這兩件事都是一個人完成的，這人在寫標題和配圖的時候，用的也不是大腦的同一區(qū)域……簡直人格分裂。比如下面這張圖：
光看圖，你覺得這是什么廣告？（此處思考5S）
然后再來看完整版：
看完標題，我們知道這是一個移民廣告。
但如果光看圖片，你會不會以為這是一個私人婦產醫(yī)院的廣告呢？
這就是這個入口創(chuàng)意（標題+圖）的莫名之處。
我們都知道，信息流廣告入口創(chuàng)意由標題和配圖組成。大部分優(yōu)化師都會非常重視標題的寫法，卻忽略了可能起到更關鍵作用的圖片。
我們的祖先從幾萬年前就已經會通過眼睛獲取圖像信息，而文字的發(fā)明最早只能追溯到三千多年前，我們的大腦對于圖像信息的編譯，比對文字信息要更快、更省力，也正因為如此，當圖片和文字同時出現(xiàn)的時候，我們的視覺重心點會不自覺的落在圖片上。
比如上面這個案例。用戶通過圖片產生的聯(lián)想是：“婦產”，而這樣的聯(lián)想，很可能和廣告投放的帶有移民標簽的人群沒多大關系，所以很自然的，他很可能就會忽略這個廣告。
再比如這個：
相信看到的用戶會像圖右的貓一樣，一臉懵逼。
空調地暖空氣不流通，如何能讓我們更舒適？看圖左，去戶外嗎？圖中和圖右干脆完全搞不清楚想表達什么……
我寫文章找案例這么仔細的看和揣摩都沒搞明白什么意思，憑什么認為用戶能在看資訊時掃過的那2秒鐘會對一個不知所云的廣告產生興趣呢？
還有這個朋友圈廣告：
這是一個運動會所的店慶活動廣告，目的應該是讓目標用戶來參加活動，進而辦卡成為會員?？墒浅鞘俏覀冞@種找茬的廣告人，不然一眼望過去，沒人會認為這個廣告跟運動會所有什么關系。
我就問問，正在看我文章的你，第一眼望過去覺得這是什么呢？是大商場活動？新飯店開業(yè)？還是某個樓盤搞答謝？
需要用戶絞盡腦汁去揣摩的廣告，就已經丟掉用戶了，用戶可沒有耐心在一個不知所謂的廣告上注目停留，所以，這樣的廣告設計也就無所謂產生更多效果了，更別提幫助銷售了。
就信息流廣告而言，圖文要一致，是入口創(chuàng)意最起碼應該做到的。配圖就像打仗的先發(fā)部隊，需要先盡力吸引用戶的注意力，然后和標題搭配做功，將用戶引至落地頁。
這就要求設計師在做入口創(chuàng)意圖的時候，需要考慮圖片如何配合標題吸引用戶注意力，讓圖片成為標題的助力，而不是拖累。
具體到配圖形式，不管是?。▎危﹫D、大圖還是三（圖），不同的圖片位置、面積比重，都會給用戶不同的影響。以入口大圖為例，因為圖片比重大，圖片會比標題更容易抓住用戶的眼球，這個時候，如果我們的圖片跟標題看起來完全不相關，那么極有可能吸引進來的，是圖片給到用戶的直觀印象中用戶感興趣的重點，而不是我們希望的目標用戶。
比如下圖：
這個廣告的標題蠻有意思，圖片也符合雙11的氛圍。但問題在于，圖片和標題完全無關。
上文我們說了，用戶往往是先看圖片，而此時如果標題能跟圖片一致，在那一瞬間會有加強作用。而這個標題和圖片單獨看都沒毛病，但是放在一起卻起了減弱作用。
再來對比下面的圖2，你就會清晰的感受到差距：
如你所見，上圖的標題和圖片分開看其實很平常，但勝在有關聯(lián)，有關聯(lián)就能互相加分，為落地頁上的銷售助力。
排版齊整延長耐心
實操中還有一個影響用戶閱讀興趣的大問題就是設計排版混亂。
通俗來說，排版好比我們和用戶溝通的“語言”，設計排版規(guī)則就是你的語言邏輯的一個展現(xiàn)形式，混亂的排版規(guī)則會像你混亂的語言邏輯一樣，影響用戶get到你想要表達的點。
常見的頁面排版誤區(qū)有三：
?。?）過度表達
即，試圖在一屏內把所有想表達的內容都排進去，讓用戶找不到重點，失去耐心。
?。?）沒有規(guī)則
具體指邊距、行距、段落間的隔斷、間距、圖文間距、標題字體字號、內容字體字號等，這些在一個頁面中應當有一個統(tǒng)一的規(guī)則。如果規(guī)則不統(tǒng)一，則視覺邏輯是混亂的，對應的，用戶的閱讀體驗也是混亂的。
?。?）認為視覺順序不重要
人腦有自己已形成的視覺權重順序，因此，哪個設計元素排列在哪個位置是非常重要的，決定了用戶會如何理解你所表達的內容。
我們用一個典型案例來詳述上面的這些問題：
問題1：過度表達
我們來看看第一屏都表達了些什么？
先看文案部分，我們看到的是（根據(jù)視覺權重向下排列）：
旋轉小火鍋；誠招加盟；優(yōu)勢。
圖片部分，我們看到的是（根據(jù)視覺權重向下排列）：
熱騰騰的小火鍋；食材；logo；云朵元素。
內容之多可以說是毫不節(jié)制。
作為想要創(chuàng)業(yè)的人來說，他們最關心的低成本、易選址、兩人即可開店等優(yōu)勢，但在這個頁面里，這些內容被放的很小，而主文字“誠招加盟”四個字，因為字體和色彩的緣故，雖然很大，卻并不是第一視覺落腳點。所以，文案部分最明顯，最容易被人意識到的，是旋轉小火鍋，配上調動用戶食欲（而不是創(chuàng)業(yè)欲望）的圖片……是否會讓人以為是火鍋店推廣呢？
問題2：邊距、間距、行距過小
不管是設計一個頁面還是一個內容區(qū)，都需要注意邊距、間距和行距。我們常說一個區(qū)域要留出左右天地來，而首屏底部這個旋轉火鍋的介紹，就是典型的不留天不留地：
再比如下面這一屏，投資優(yōu)勢底下的爆炸形底板，和上面的圖片、下面的圓角底板都緊緊挨在一起。圓角灰色底板內，白色菱形板塊也是頂天立地不留空白，內部的文字也沒有考慮留白：
整個給人的感受，就是一個字：“擠”，直接結果就是讓用戶閱讀困難，閱讀體驗差，降低耐心，然后退出。
問題3：字體過多
還是以上圖為例。僅這一張圖內就出現(xiàn)了造字工房悅黑體、幼圓體、宋體、隸書體4個字體，更別說整個落地頁里還有手寫體、粗宋繁體、圓體、綜藝體、楷書……落地頁上半部分的內容字體，和下半部分也不一致，可想設計師在做的時候，腦袋里并沒有一個整體規(guī)劃。
用戶沒有受過專業(yè)訓練，不會像我般知道問題所在，他只會覺得不舒服，無法抓到你的重點。
就好像你同別人溝通，即使說的內容再好，但是如果你一會兒文言文，一會兒現(xiàn)代文，一會兒英語，一會兒法語，看起來很酷炫，但其實沒人明白你說了什么。
其實要想讓用戶看著舒服非常簡單，只要給自己制定一個排版規(guī)則：左右邊距留多少、段落間距留多少、行距多少……形成一個規(guī)則，大標題、中標題、小標題、內容文字、slogan文字有固定字體和字號……這些只要稍稍關注一下不難做到——概括一下就倆字：有序。
微信關注
手機網(wǎng)站