如何通過(guò)設(shè)計(jì)提升banner點(diǎn)擊率?
項(xiàng)目背景
——————
這個(gè)項(xiàng)目是我在18年下半年開(kāi)始負(fù)責(zé)的,當(dāng)時(shí)老大希望能通過(guò)一個(gè)小小的“點(diǎn)”來(lái)證明設(shè)計(jì)在商業(yè)中的價(jià)值,那應(yīng)該怎么樣去證明?比如我們通過(guò)設(shè)計(jì),優(yōu)化某一項(xiàng)功能來(lái)提升某個(gè)數(shù)據(jù)指標(biāo),實(shí)現(xiàn)幫助業(yè)務(wù)提高轉(zhuǎn)化,而對(duì)于運(yùn)營(yíng)設(shè)計(jì)來(lái)說(shuō)這個(gè)“點(diǎn)”可能會(huì)是什么?
我們找到的切入點(diǎn)是研究怎么樣通過(guò)設(shè)計(jì)來(lái)提升banner的點(diǎn)擊。那是不是提高了banner點(diǎn)擊就一定能提高業(yè)務(wù)轉(zhuǎn)化呢?并不是,提高點(diǎn)擊可以說(shuō)是變相提高了活動(dòng)賣場(chǎng)的曝光,意味著有更多的銷售機(jī)會(huì),但下單轉(zhuǎn)化是受很多方面的因素影響的,單純提高點(diǎn)擊其實(shí)不一定能提高銷售轉(zhuǎn)化,但正如上所述,我們能通過(guò)設(shè)計(jì)上的一些小小的“技巧”來(lái)幫助業(yè)務(wù)創(chuàng)造更多的機(jī)會(huì),甚至banner本身就可能會(huì)促成用戶的下單行為(banner的信息直接命中目標(biāo)用戶),而這就是此項(xiàng)目,或者說(shuō)是我們運(yùn)營(yíng)設(shè)計(jì)師的價(jià)值所在。
以上就是我接觸這個(gè)項(xiàng)目的大概背景,接下來(lái)將正式分享項(xiàng)目的部分成果,由于項(xiàng)目時(shí)間跨度太大,中間也因?yàn)橐恍┢渌匾?xiàng)目的穿插導(dǎo)致擱置了一段時(shí)間,且正好我們平臺(tái)最近剛升級(jí)了全新版本,于是干脆把項(xiàng)目拆分為上下兩個(gè)部分,今天先分享基于上一版本研究的上部,而下部會(huì)在平臺(tái)新版穩(wěn)定下來(lái)并重新開(kāi)啟研究且得出更多成果后再進(jìn)行分享。
注:由于項(xiàng)目是在我們分期樂(lè)平臺(tái)上進(jìn)行的,自然會(huì)根據(jù)我們平臺(tái)自身特點(diǎn)、用戶群體的特征來(lái)定制設(shè)計(jì)方案,當(dāng)中得出的部分結(jié)論及設(shè)計(jì)方法僅供大家參考。
如何提升banner點(diǎn)擊?
———————————————
日本著名平面設(shè)計(jì)師青木克憲說(shuō)過(guò):“廣告設(shè)計(jì)只有一個(gè)目標(biāo),就是吸引眼球”,個(gè)人認(rèn)為這句話不管是線下線上,傳統(tǒng)平面、廣告設(shè)計(jì)抑或互聯(lián)網(wǎng)等新興行業(yè)皆可適用。尤其當(dāng)今電商行業(yè)的交易,在移動(dòng)端的占比已經(jīng)達(dá)到95%以上,而移動(dòng)端使用環(huán)境的多樣化與不確定性,意味著用戶可能會(huì)受大量不同類型信息的轟炸。如果想要提升廣告點(diǎn)擊,那我們的廣告必須在2秒內(nèi)脫穎而出(2秒原則,最早出自龐門正道公眾號(hào))吸引住用戶才行,而我們憑什么能吸引用戶?
我認(rèn)為好的廣告需要具備以下這些維度:
● 首先它符合人的認(rèn)知慣性——不能過(guò)于天馬行空,造成用戶認(rèn)知困擾;
● 識(shí)別成本低——盡可能讓用戶在2秒內(nèi)完成閱讀并理解內(nèi)容;
● 滿足人性需求——懶(識(shí)別成本)、貪(低價(jià)優(yōu)惠)、虛榮、愛(ài)美等;
● 視覺(jué)美感——設(shè)計(jì)的基礎(chǔ)
好的廣告至少具備1到 2條,當(dāng)然如果完全具備則更好,這樣的廣告才能夠引起用戶的興趣,促使他們點(diǎn)擊。
驗(yàn)證方法
——————
根據(jù)設(shè)想的目標(biāo),以及對(duì)平臺(tái)實(shí)際情況的評(píng)估,我們決定利用平臺(tái)的首頁(yè)廣告來(lái)做ABtest,以驗(yàn)證我們的設(shè)想是否正確。
在實(shí)際執(zhí)行中我擬定相關(guān)的執(zhí)行計(jì)劃,分為5個(gè)步驟:
首先以用戶的需求出發(fā),大膽假設(shè)可能影響點(diǎn)擊的因素;其次根據(jù)平臺(tái)資源情況,結(jié)合合適的類目進(jìn)行測(cè)試;然后定期匯總測(cè)試結(jié)果,檢驗(yàn)測(cè)試方向是否正確,如有問(wèn)題的話需要及時(shí)修正;接著對(duì)已有的結(jié)果沉淀出相關(guān)的設(shè)計(jì)方法論,并用方法論設(shè)計(jì)新的廣告圖,繼續(xù)投放測(cè)試驗(yàn)證結(jié)果,確保這些方法論是真實(shí)可行的;最后,這是一個(gè)不斷更新迭代的過(guò)程。下面我們一起來(lái)看看案例。
風(fēng)格氛圍
——————
● 手機(jī)、3C類采用數(shù)碼產(chǎn)品常用的暗色漸變、強(qiáng)光感環(huán)境(所謂的酷炫風(fēng)格)點(diǎn)擊更好;包括電腦類同樣是酷炫風(fēng)格更好。
原因是長(zhǎng)久以來(lái)大部分?jǐn)?shù)碼產(chǎn)品的品牌方、平臺(tái)方或小商家,都傾向于采用類似的風(fēng)格為產(chǎn)品烘托科技感的氛圍,而用戶在經(jīng)過(guò)這么長(zhǎng)時(shí)間的認(rèn)知教育后,自然也更認(rèn)同酷炫風(fēng)格是更適合數(shù)碼類產(chǎn)品的。于是大部分時(shí)候用戶第一眼看到類似風(fēng)格的圖,會(huì)下意識(shí)的認(rèn)為這是一個(gè)賣數(shù)碼產(chǎn)品的廣告,這在一定程度下也降低了banner的識(shí)別成本,讓用戶在更短的時(shí)間內(nèi)get到廣告內(nèi)容,并決定是否需要點(diǎn)擊了解,從而挽留了部分因?yàn)樵O(shè)計(jì)風(fēng)格而流失的用戶,因此點(diǎn)擊率也相對(duì)更高。
● 暖色系的實(shí)拍場(chǎng)景更適合快餐類
主要原因也是認(rèn)知慣性,快餐類長(zhǎng)期使用精美的食物實(shí)拍做廣告設(shè)計(jì),而精美的食物照片顯得更加誘人,讓人更有食欲,這同時(shí)也滿足了人性的需求(食欲),因此插畫風(fēng)格雖然看起來(lái)更新穎,但點(diǎn)擊率卻沒(méi)有傳統(tǒng)做法來(lái)的高。
商品與代言人
—————————
● 手機(jī)類用代言人會(huì)引起反效果
最初我采用了榮耀play及它的代言人做測(cè)試,發(fā)現(xiàn)代言人的點(diǎn)擊率遠(yuǎn)不如單純展示產(chǎn)品,于是我懷疑是否跟代言人的人氣有關(guān)?而后又繼續(xù)做了三組測(cè)試,分別采用了當(dāng)紅偶像,得出的結(jié)果卻仍然是展示產(chǎn)品點(diǎn)擊更好,這就很有意思了。
我們橫向?qū)Ρ纫幌缕渌脚_(tái)以及手機(jī)品牌方的banner其實(shí)可以發(fā)現(xiàn),這類banner基本上主打產(chǎn)品的性能、功能、外觀造型等賣點(diǎn),少有直接使用代言人做banner的,歸根到底其實(shí)是手機(jī)類的用戶更關(guān)注的是手機(jī)本身的功能,而不是代言人是誰(shuí),代言人更多情況是配合品牌方的宣傳策略,在提升產(chǎn)品品牌形象上做貢獻(xiàn)。另一方面,在手機(jī)類的電商banner中使用代言人也降低了產(chǎn)品的識(shí)別性,使banner的識(shí)別成本提高。
● 服飾類用代言人能有效提升點(diǎn)擊
在服飾類的測(cè)試結(jié)果卻正好相反,代言人是能更有效提升點(diǎn)擊的,因?yàn)榇匀四芨玫匾r托服飾的形象氣質(zhì),更容易讓用戶代入自身,想象出一個(gè)更美好的自我。同時(shí)明星總是處于潮流的尖端且飽受關(guān)注,他們的穿著打扮更會(huì)引起大批人的追捧,因此明星同款在一定程度上降低了用戶追求美的門檻(如照搬明星的穿搭形式),滿足了人性中“愛(ài)美”的需求,所以更加吸引用戶。
合成與街拍
———————
關(guān)于服飾類banner,用街拍圖和把人物摳出來(lái)做合成哪種更好?
通過(guò)問(wèn)卷調(diào)查我們得到的結(jié)果是絕大部分用戶都更傾向于街拍圖,而實(shí)際點(diǎn)擊結(jié)果會(huì)怎樣呢?
很意外吧?點(diǎn)擊結(jié)果與調(diào)查報(bào)告是截然相反的,合成banner的點(diǎn)擊率反而比使用街拍圖的更高。
我們來(lái)分析一下原因,首先,造成問(wèn)卷調(diào)查與實(shí)際點(diǎn)擊結(jié)果相反的主要因素是閱讀環(huán)境的不同,真實(shí)的banner閱讀環(huán)境是在app端,app端礙于手機(jī)屏幕的尺寸,所展示的內(nèi)容是非常受限,這就要求我們的banner信息必須非常簡(jiǎn)練且便于識(shí)別(文章開(kāi)頭所說(shuō)的2秒原則),而街拍圖具有非常豐富的場(chǎng)景細(xì)節(jié),在移動(dòng)端廣告中這些細(xì)節(jié)反而會(huì)干擾用戶識(shí)別主要信息,因此點(diǎn)擊率自然會(huì)比干凈簡(jiǎn)潔的合成圖更低;而調(diào)查問(wèn)卷則是一個(gè)相對(duì)更穩(wěn)定封閉的環(huán)境,用戶有更多時(shí)間和注意力來(lái)判斷banner在視覺(jué)上帶給自己的直觀感受,因此問(wèn)卷調(diào)查得到的是相反的答案。
版式結(jié)構(gòu)
——————
針對(duì)banner圖中,左邊放文案/商品哪種點(diǎn)擊更好而進(jìn)行測(cè)試
● 測(cè)試結(jié)果顯示手機(jī)類新品廣告是左邊放商品,右邊放文案的效果更好,具體原因是什么?我們可以先看看其他類目的測(cè)試情況。
● 其他類目包括服飾、美妝、珠寶、腕表、箱包以及虛擬類等等,均是左邊放文案,右邊放商品點(diǎn)擊更高,這時(shí)我們?cè)倏纯淳唧w原因究竟是什么。
首先有一個(gè)前提,人類的閱讀慣性是從左至右、從上至下的一個(gè)過(guò)程。對(duì)應(yīng)我們的banner來(lái)說(shuō),自然是左邊區(qū)域的信息更容易被用戶接收得到?;谶@個(gè)前提,我們?cè)倏椿匕咐?br/>
首先左邊是推新品手機(jī)的廣告,手機(jī)類有什么品牌,有什么新品上市,關(guān)注這塊的用戶都比較了解(品牌方早已有鋪天蓋地的宣傳),這時(shí)先看圖就知道是不是他們所需要的,也就是說(shuō)左邊放商品的識(shí)別成本更低,于是點(diǎn)擊會(huì)更好;
而其他類目或賣場(chǎng)活動(dòng)由于品牌十分繁雜,缺少知名爆款,用戶其實(shí)是很難會(huì)被商品圖吸引的,用戶更多是先看有什么優(yōu)惠,然后再進(jìn)去看看有沒(méi)自己喜歡的,這時(shí)候左邊放文案的識(shí)別成本更低,點(diǎn)擊也就更高。
因此我們得到的結(jié)論是,不同類目的用戶訴求不同,應(yīng)根據(jù)用戶的需求來(lái)決定版式形式。
商品展示形式
—————————
● 手機(jī)類展示局部的效果更好
主要原因有兩點(diǎn):一是展示局部有利于體現(xiàn)產(chǎn)品的渲染細(xì)節(jié)、突出品質(zhì)感;
另外從設(shè)計(jì)構(gòu)圖上來(lái)看,局部展示的廣告畫面更加飽滿、穩(wěn)重,視覺(jué)中心更突出,沖擊力相對(duì)更強(qiáng),自然更加抓眼球。
● 輕奢類手表用場(chǎng)景擺拍效果更好
精美的攝影圖能讓該類產(chǎn)品顯得更有檔次,同時(shí)在結(jié)合十分優(yōu)惠的利益點(diǎn)(在分期樂(lè)中12期免息是非常優(yōu)惠的利益點(diǎn),能大幅減輕用戶分期消費(fèi)的壓力)的情況下,可以讓用戶覺(jué)得“誒,這個(gè)表看起來(lái)非常高檔大牌,居然還不貴”,一定程度的滿足了人性中“貪”(便宜)的需求。
文案及利益點(diǎn)
—————————
● 指定的爆款直降/秒殺效果更好;低價(jià)商品推滿減等信息更好,反之免息更好
如果banner有明確的爆款商品,那么直接打爆款的優(yōu)惠信息,比大牌香氛/明星同款這類說(shuō)法比較模糊的利益點(diǎn)更好(識(shí)別成本);
另外,客單價(jià)低,用戶沒(méi)有分期需求的商品,使用滿減、折扣等優(yōu)惠更好,反之如果有分期需求,自然是免息效果最佳(人性需求)。
● 文案越精煉越好
字少點(diǎn)擊率遠(yuǎn)比字多的高,畢竟字?jǐn)?shù)越多識(shí)別成本越高,另外標(biāo)題字?jǐn)?shù)在6-8個(gè)字之間點(diǎn)擊率是最穩(wěn)定的(字?jǐn)?shù)的結(jié)論為阿門當(dāng)年在騰訊時(shí)所測(cè)出的結(jié)論,詳情可在龐門公眾號(hào)推薦面條姐的書的文章中找到)。
——————————————————————
另外還有一些綜合類型的測(cè)試,跟上面的單點(diǎn)測(cè)試不一樣,綜合測(cè)試的主要目的是找出能有效推高banner點(diǎn)擊的方法,而不是測(cè)某個(gè)點(diǎn)是否可行或影響多寡,下面我們一起來(lái)看一下案例。
● 把文案放大處理是可行的
這種特殊的大文案版式,在視覺(jué)上的沖擊力就非常強(qiáng),且大文案也更容易被用戶識(shí)別,哪怕banner上的商品已經(jīng)淪為點(diǎn)綴元素也絲毫不受影響。
● 運(yùn)動(dòng)潮鞋類沖擊力強(qiáng)的風(fēng)格
關(guān)注這一品類的用戶有個(gè)共同的特點(diǎn),他們非常熱衷于潮牌潮鞋,喜好個(gè)性和獨(dú)特的風(fēng)格,拒絕平庸,年輕且充滿活力并具有自己的堅(jiān)定態(tài)度。面對(duì)這類用戶,在banner設(shè)計(jì)上投其所好是很好的做法,采用充滿爆發(fā)力或獨(dú)特藝術(shù)表現(xiàn)力的風(fēng)格能有效地提升點(diǎn)擊。
——————————————————————
以上就是項(xiàng)目至今得到的部分成果,其實(shí)大家可以看出,文章大部分結(jié)論都離不開(kāi)識(shí)別成本及認(rèn)知慣性這兩維度,畢竟廣告設(shè)計(jì)的本質(zhì)是為了傳達(dá)信息,滿足這兩維度的banner已經(jīng)可以說(shuō)是成功的banner,而如何在此基礎(chǔ)上融合其他維度,為提高banner的觸達(dá)率增磚添瓦,是我在項(xiàng)目下半部分的主要目標(biāo)。
希望這篇分享能為大家在設(shè)計(jì)banner時(shí)提供一些小小的參考方向,也希望酷友們多給意見(jiàn),指出不足之處,謝謝大家!
最后感謝LIM、小白、龍哥、fiona和JJ在項(xiàng)目中提供的設(shè)計(jì)支持
本文地址:http://m.pkvc.cn/tutorial/ui4206.html
您可能還喜歡
- 經(jīng)典網(wǎng)頁(yè)配色方案之無(wú)色系
- 對(duì)齊!框框框!ps中對(duì)齊和參考線詳解
- banner實(shí)戰(zhàn)技巧-版式平衡構(gòu)圖
- 晉小彥視覺(jué)設(shè)計(jì)系列文章(二):全屏大視
- 如何成功運(yùn)用扁平化設(shè)計(jì)與色彩趨勢(shì)
- 做有思想的網(wǎng)頁(yè)設(shè)計(jì)-banner實(shí)例講解
- [圖趣]色彩搭配的核心原則和聯(lián)想
- 扁平化設(shè)計(jì)與可訪問(wèn)性
- 網(wǎng)頁(yè)設(shè)計(jì)專題技巧淺析
- WEB設(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ì)系列文章(二):全屏