全國(guó)咨詢(xún)/投訴熱線:400-618-4000

首頁(yè)技術(shù)文章正文

電商直通車(chē)這樣設(shè)計(jì)轉(zhuǎn)化率將飆升!

更新時(shí)間:2018-06-26 來(lái)源:黑馬程序員 瀏覽量:

什么是淘寶直通車(chē)?

淘寶直通車(chē)是為淘寶賣(mài)家量身定制的,按點(diǎn)擊付費(fèi)的效果營(yíng)銷(xiāo)工具,實(shí)現(xiàn)寶貝的精準(zhǔn)推廣。用如何開(kāi)網(wǎng)店的小編一席話總結(jié):淘寶直通車(chē)推廣,在給寶貝帶來(lái)曝光 量的同時(shí),精準(zhǔn)的搜索匹配也給寶貝帶來(lái)了精準(zhǔn)的潛在買(mǎi)家。淘寶直通車(chē)推廣,用一個(gè)點(diǎn)擊,讓買(mǎi)家進(jìn)入你的店鋪,產(chǎn)生一次甚至多次的店鋪內(nèi)跳轉(zhuǎn)流量,這種以點(diǎn) 帶面的關(guān)聯(lián)效應(yīng)可以降低整體推廣的成本和提高整店的關(guān)聯(lián)營(yíng)銷(xiāo)效果。

【直通車(chē)是付費(fèi)流量,是按點(diǎn)擊收費(fèi)的營(yíng)銷(xiāo)工具】

尺寸說(shuō)明

直通車(chē)又分為店鋪直通車(chē)和產(chǎn)品直通車(chē),其區(qū)別除了設(shè)計(jì)尺寸不一樣外,其連接方式也不一樣,店鋪直通車(chē)鏈接落地頁(yè)是到店鋪首頁(yè)或者自定義活動(dòng)頁(yè)面,而產(chǎn)品直通車(chē)鏈接落地頁(yè)是到產(chǎn)品詳情頁(yè)面。

1529992252510_01.jpg

為什么要說(shuō)到最小呢?因?yàn)閳D片的尺寸會(huì)根據(jù)顯示器的大小調(diào)整不同尺寸,這就是所謂的自適應(yīng),把瀏覽器縮小便可以看到效果,在設(shè)計(jì)直通車(chē)時(shí)應(yīng)該注意到不同環(huán)境下的展示效果。

展示位置

店鋪直通車(chē)展現(xiàn)在搜索列表右側(cè)店鋪推廣的位置,不過(guò)要往下拉4-5屏才能看到(一般是PC端搜索頁(yè)右側(cè)最下面的店家精選)

1529992271979_02.jpg

產(chǎn)品直通車(chē)展現(xiàn)在搜索列表右側(cè)與列表底部的商品推廣位置(PC在搜索結(jié)果前1-3個(gè),和右側(cè)上面的掌柜熱賣(mài)等位置,無(wú)線就與搜索混排,左上角會(huì)標(biāo)記為HOT)

1529992353824_03.jpg

影響點(diǎn)擊要素

①直通車(chē)的位置

②直通車(chē)選詞

③行業(yè)搜索量

④關(guān)鍵詞出價(jià)

⑤關(guān)鍵詞質(zhì)量得分

⑥文案、賣(mài)點(diǎn)的提煉

⑦圖片創(chuàng)意

⑧文字排版

1529992472154_04.jpg

當(dāng)然,上面的前6條與我們?cè)O(shè)計(jì)師的關(guān)系不大,一般由運(yùn)營(yíng)調(diào)整,而且運(yùn)營(yíng)操作尤為重要,關(guān)系到整個(gè)店鋪的流量、轉(zhuǎn)化率、銷(xiāo)量,設(shè)計(jì)師要做的是第7、8兩點(diǎn),把文案產(chǎn)品結(jié)合起來(lái),設(shè)計(jì)要符合產(chǎn)品店鋪風(fēng)格、產(chǎn)品特性。


直通車(chē)如何構(gòu)圖?

由于直通車(chē)是點(diǎn)擊付費(fèi),所以產(chǎn)品一定要放在顯眼的位置,以免誤導(dǎo)點(diǎn)擊產(chǎn)生不必要的扣費(fèi),而直通車(chē)圖展示效果一般很小,所以構(gòu)圖的方式比較拮據(jù),大部分情況下排版方式都要根據(jù)產(chǎn)品圖的特性來(lái)進(jìn)行構(gòu)圖,下面給大家介紹幾種常規(guī)構(gòu)圖方法。

左右構(gòu)圖

因?yàn)樯唐穲D片比較細(xì)長(zhǎng),所以排版采用左右格式,文字在左邊商品在右邊,或者相反;這類(lèi)設(shè)計(jì)比較嚴(yán)謹(jǐn)大方、常規(guī),設(shè)計(jì)中一般不會(huì)出現(xiàn)什么錯(cuò)誤,但選圖要適合,文案層次要清晰。

1529992523951_05.jpg

上下結(jié)構(gòu)

這類(lèi)排版一般商品比較寬,完全放置到畫(huà)面中后,下方會(huì)有空余,所以這類(lèi)商品盡量采用上下結(jié)構(gòu)的排版方式,商品偏向穩(wěn)重、大氣、有質(zhì)量等,文字一般排在商品上面;商品偏向輕盈、小物品等,文字一般排列在商品下面。

1529992534139_06.jpg

對(duì)角結(jié)構(gòu)

此類(lèi)構(gòu)圖同樣是根據(jù)商品圖來(lái)的,分為兩分構(gòu)圖和三分構(gòu)圖(如圖2、5為三分構(gòu)圖),并且這類(lèi)直通車(chē)的產(chǎn)品圖一般為傾斜的。同時(shí)在做一些電器、需要有動(dòng)感的設(shè)計(jì)時(shí)也會(huì)用到對(duì)角線構(gòu)圖方式;另外,當(dāng)商品圖特別細(xì)長(zhǎng)的時(shí)候,如釣魚(yú)竿,我們采用對(duì)角線構(gòu)圖的方式可以把商品展示的更大、更直觀。

1529992545217_07.jpg

壓住四角

當(dāng)商品放置在頁(yè)面居中的地方時(shí),通過(guò)把文案或圖形分散排放在各個(gè)角落,合理控制文字 或圖形的大小來(lái)使頁(yè)面整體具有平衡感。當(dāng)然這里并不是說(shuō)都使用文字去壓住四角,比如第一張案例,商品本身的翅膀就已經(jīng)壓住了一個(gè)角落,所以使用產(chǎn)品圖時(shí)就應(yīng)該控制好構(gòu)圖,預(yù)留出文案排版的位置。

1529992571780_08.jpg


直通車(chē)如何分類(lèi)設(shè)計(jì)?

除了要掌握排版的方法以外,不同的類(lèi)目,還要搞清楚需求方向,了解產(chǎn)品,分析競(jìng)品等;然后有針對(duì)性的突出產(chǎn)品某個(gè)特點(diǎn),掩蓋不足,提升點(diǎn)擊率和轉(zhuǎn)化率。

形象類(lèi)商品

此類(lèi)商品主要是產(chǎn)品本身形象和產(chǎn)品價(jià)格(例如服飾、鞋子,買(mǎi)家更關(guān)心的是款式、價(jià)格),所以盡可能真實(shí)、完整的展現(xiàn)商品本身,通過(guò)不同的角度,合理的色彩搭配來(lái)烘托商品;文字設(shè)計(jì)要求簡(jiǎn)潔易懂,不需要過(guò)多的修飾。

1529992593468_09.jpg

功能類(lèi)商品

功能類(lèi)商品當(dāng)然是要突出功能了,這類(lèi)直通車(chē)文案可能會(huì)很多,所以,展現(xiàn)排版功底的時(shí)候就到了,排版的時(shí)候要做到文字的排列要有一定的規(guī)律、有層次、有重點(diǎn)。同時(shí)背景的烘托效果也上不了哦。

1529992604327_09.jpg

下圖雖然圖片的整體設(shè)計(jì)很好看,但是因?yàn)槲淖诌^(guò)多,排版層次不清晰,沒(méi)有規(guī)律,不知從何開(kāi)始閱讀,也不知道哪是頭哪是尾,如果采用規(guī)律的排版方式,買(mǎi)家一眼即可看完整體文案結(jié)構(gòu),再看一眼即可看清所有功能,所以在追求視覺(jué)的同時(shí)也要注重用戶(hù)體驗(yàn)。

1529992614343_11.jpg

促銷(xiāo)、活動(dòng)類(lèi)

不用多說(shuō),促銷(xiāo)類(lèi)的設(shè)計(jì)相信大家做的肯定不少,首先是用色,選擇常用的大促色彩,添加活動(dòng)的氛圍元素,文案相對(duì)于其他類(lèi)直通車(chē),更加厚重、更加突出現(xiàn)眼。

1529992631078_12.jpg

品牌、品質(zhì)、逼格類(lèi)

為什么高端?因?yàn)樽孕?商品本身就非常具有獨(dú)特風(fēng)格特點(diǎn),所以設(shè)計(jì)時(shí),我們需要弱化文字,用盡可能大的空間展示商品和留白。

1529992642296_13.jpg


如何提高圖片吸引力?

搞定了前面的那些,是時(shí)候來(lái)點(diǎn)加分項(xiàng)了,這個(gè)不僅考驗(yàn)到設(shè)計(jì)師的設(shè)計(jì)能力,也考驗(yàn)對(duì)生活的了解和熱愛(ài),然并卵,你造嗎?

網(wǎng)絡(luò)熱詞、表情、隱喻、電影等

通過(guò)時(shí)下非常流行的網(wǎng)絡(luò)用語(yǔ),或者是比較創(chuàng)新有意思的用語(yǔ)打動(dòng)消費(fèi)者,此類(lèi)設(shè)計(jì)因?yàn)橛迷~比較新穎,色彩、文字排版一般采用比較活潑的表現(xiàn)形式,圖文結(jié)合效果更好;因?yàn)橹攸c(diǎn)在文案,所以主要文字層次要求清晰,但也不能太弱化商品。

1529992677563_14.jpg

創(chuàng)意合成圖片

通過(guò)夸張、比喻的手法突出商品的某個(gè)賣(mài)點(diǎn),非??简?yàn)設(shè)計(jì)師的閱歷和合成技巧,因?yàn)椴坏Ч龅煤?,還得完美貼合文案主題。此類(lèi)設(shè)計(jì)含金量非常高,所以這類(lèi)創(chuàng)意都會(huì)給用戶(hù)創(chuàng)造深刻印象,從而達(dá)到品牌營(yíng)銷(xiāo)的效果。

1529992874799_15.jpg

意境、氛圍、情景模式

通過(guò)一個(gè)畫(huà)面表達(dá)一種意境,它或是唯美清晰,或是百花環(huán)繞,或是威武霸氣,通過(guò)對(duì)比襯托形象的突出商品和其功能。此類(lèi)對(duì)色彩、光影應(yīng)用的要求比較高,需要深厚的合成功底。

1529992884971_16.jpg

情調(diào)感情

通過(guò)一些特殊的方法來(lái)吸引注意力,要注意淘寶規(guī)則,如果使用的圖片有侵權(quán)、明星等,遭到投訴后后果不堪設(shè)想。

1529992909737_17.jpg

使用應(yīng)季色彩/元素

設(shè)計(jì)中的色彩、素材元素,不一定要用類(lèi)似色;可以嘗試使用一些隨季節(jié)變化而變化的色調(diào),這樣不僅可以看到產(chǎn)品與不同顏色、風(fēng)格搭配的多樣性,還能展現(xiàn)的與眾不同。

1529992923863_18.jpg

拉近距離

在適當(dāng)?shù)那闆r下,拉近產(chǎn)品與眼睛的距離(近大遠(yuǎn)小),讓產(chǎn)品更有質(zhì)感、更真實(shí)、讓版面更加豐滿(mǎn)、整潔,從而更具有視覺(jué)沖擊力。

1529992936207_19.jpg

本文版權(quán)歸黑馬程序員視覺(jué)設(shè)計(jì)學(xué)院所有,歡迎轉(zhuǎn)載,轉(zhuǎn)載請(qǐng)注明作者出處。謝謝!


作者:黑馬程序員視覺(jué)設(shè)計(jì)培訓(xùn)學(xué)院


首發(fā):http://m.pantone-color.com.cn/special/uijpzly/index.html

分享到:
在線咨詢(xún) 我要報(bào)名
和我們?cè)诰€交談!