淘寶雙12親親節(jié):活動(dòng)視覺分析(預(yù)熱期)

5 評(píng)論 11839 瀏覽 45 收藏 10 分鐘

雙12對(duì)比雙11,最大的區(qū)別是雙11更強(qiáng)調(diào)品牌的狂歡、而雙12更強(qiáng)調(diào)年輕、有趣、活力。本文作者將為大家分析一些觀點(diǎn),僅供參考!

一、活動(dòng)定位

(活動(dòng)定位由同事亮神分析)

1、設(shè)計(jì)關(guān)鍵詞 ─── 年輕、網(wǎng)絡(luò)、親

雙12對(duì)比雙11,最大的區(qū)別是雙11更強(qiáng)調(diào)品牌的狂歡、而雙12更強(qiáng)調(diào)年輕、有趣、活力。

(1)采用有趣的人物形象為主體,能快速地將用戶代入輕松的氛圍里,而且能呼應(yīng)“親”的主題。人物不管是老的少的小的,都齊聚一堂。

uisdc-banner-201612051

(2)網(wǎng)絡(luò)用語(yǔ)的烘托氛圍,如圖中的@、#、,、~……不管是逗號(hào)還是句號(hào),這些的確都是我們平常聊天中會(huì)用到的。

uisdc-banner-201612052

其次是 “Fashion” 的 logo和其它元素做到統(tǒng)一,同時(shí)元素上面也區(qū)分了以往活動(dòng)中大家都用的幾何形狀,千篇一律。相反這些更有意思、有趣、貼合網(wǎng)絡(luò)。

(3)淘寶親親節(jié)在視覺定位上更加年輕,豐富的色彩和立體的網(wǎng)絡(luò)符號(hào)以及情緒化的文案。

uisdc-banner-201612053

(圖片來自淘寶)

2、內(nèi)容營(yíng)銷───話題及直播設(shè)計(jì)風(fēng)格

今年淘寶親親節(jié)更加注重內(nèi)容營(yíng)銷,圍繞用戶興趣主推了12個(gè)話題。在話題設(shè)計(jì)上,使用了手寫字體及網(wǎng)絡(luò)表情這更符合年輕用戶群體的風(fēng)格喜好,也可以更好的和有趣文案相互動(dòng)。

uisdc-banner-201612054

uisdc-banner-201612055

uisdc-banner-201612056

視覺上面就感覺很二次元,的確也是符合年輕人的定位。

二、官網(wǎng)首頁(yè)氛圍

uisdc-banner-201612058

淘寶雙12活動(dòng)主題為《1212淘寶親親節(jié)》,視乎主題的由來是我們所有人都熟悉的購(gòu)物開頭語(yǔ):

親,能包郵嗎?親,還能在便宜點(diǎn)嗎?

主題也很符合淘寶定位,也有親切感。從元素中看到波點(diǎn)元素和其它紋理的裝飾。

頁(yè)面

主會(huì)場(chǎng):

uisdc-banner-201612059

特色頻道會(huì)場(chǎng):

uisdc-banner-2016120510

品類分會(huì)場(chǎng):

uisdc-banner-2016120511

雖然淘寶給出的圖形規(guī)范中說這種是不規(guī)則曲線,文中就暫且用“不規(guī)則”一詞代替。

從大風(fēng)格方向看我更喜歡把它稱為迷彩風(fēng)格,波點(diǎn)元素。形狀很有律動(dòng)感、流動(dòng)的視覺感受。區(qū)別以往棱角分明,嚴(yán)肅的感。

放了2張迷彩感覺的圖:

uisdc-banner-2016120512

三、會(huì)場(chǎng)視覺分析

層次

uisdc-banner-2016120513

紅色背景和黃色藍(lán)色的撞色非常熱烈,商品和裝飾向外散發(fā)。而中間的不規(guī)則圓形則把視覺收縮進(jìn)來。

但兩者似乎有一些沖突了,不知道大家有沒有這種感覺。

外圍的紅色和黃色屬于暖色,暖色給人收縮感。中間的藍(lán)色屬于冷色給人一種向外擴(kuò)展的視覺感受。

視覺層次大概6中,背景的形狀加上標(biāo)題和元素。

uisdc-banner-2016120514

這樣雖然層次多了,但我卻無(wú)法集中。而且還有一種視覺疲勞感,因?yàn)榧t色的視覺刺激比較大。(你可以試試把PC的兩邊遮擋起來,在看中間的內(nèi)容會(huì)輕松很多)

那么,我們?cè)倏碝端上們看看:

uisdc-banner-2016120515

在手機(jī)端上面直接去掉了紅色背景,這樣的確感覺沒有那么疲勞了。在手機(jī)上可以一眼把內(nèi)容都包攬下來,減少了周圍的干擾,視覺上會(huì)比PC上面舒服。

其次,我們看PC的上面主要的顏色有紅色、黃色、紫色、藍(lán)色和綠色,而且部分顏色的范圍很大,已經(jīng)超過了我們平時(shí)說的配色不要超過3中的原理。

氛圍

以分會(huì)場(chǎng)舉例分析

uisdc-banner-2016120516

排版采用居中布局模特或主推商品主打、其它商品為輔。

1、背景采用不規(guī)則的形狀做層次疊加、讓頁(yè)面律動(dòng)性更強(qiáng)。

背景的視覺走向:

uisdc-banner-2016120517

2、元素使用 @ ?# ? 。~……我們平常都會(huì)用到的。比如微博@誰(shuí)誰(shuí),熱門標(biāo)題中的#等這些網(wǎng)絡(luò)符號(hào),年輕活力。

元素及商品的視覺走向:

uisdc-banner-2016120518

配色

顏色之間的撞色讓畫面更加熱鬧,加上不規(guī)則形狀的漸變色畫面則更加繽紛多彩。部分形狀為頁(yè)面中高亮色,高亮色也是作為視覺的落點(diǎn)。

uisdc-banner-2016120519

uisdc-banner-2016120520

上面黃色圈出來的是高亮色

uisdc-banner-2016120521

uisdc-banner-2016120522

做活動(dòng)不會(huì)配色的,多看看官方的頁(yè)面,會(huì)場(chǎng)這些配色。有暗色和亮色,顏色直接的碰撞。今年雙11、12活動(dòng)配色都偏向微漸變色、色彩的碰撞。所以不敢用色、不會(huì)配色的朋友得琢磨琢磨了。

其它部分會(huì)場(chǎng)

uisdc-banner-2016120523

uisdc-banner-2016120524

uisdc-banner-2016120525

uisdc-banner-2016120526

里面的那些元素,不是3D做的,就是復(fù)制了一層往下移動(dòng)然后改變顏色的深淺。總體來說:淘寶這次的1212賣場(chǎng)頁(yè)面較為常規(guī)。

淘寶H5

uisdc-banner-2016120527

uisdc-banner-2016120528

厲害了淘寶!旋梯式,形式不錯(cuò)。

 

作者:不沉的骨頭,一個(gè)段子與干貨兼有的設(shè)計(jì)師。

來源:微信公眾號(hào)【三根設(shè)計(jì)骨】

本文由 @不沉的骨頭 授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)作者許可,禁止轉(zhuǎn)載。

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 這叫好看??

    回復(fù)
  2. 這叫好看??

    回復(fù)
  3. 一直就不喜歡淘寶app的界面設(shè)計(jì),太花哨太雜亂,多看兩眼就頭暈

    回復(fù)
  4. 只有我覺得很難看么?這種大面積撞色和高飽和度不是不好,只是一整篇看下來已經(jīng)產(chǎn)生了生理的不適感

    來自上海 回復(fù)
  5. 暖色給人收縮感。中間的藍(lán)色屬于冷色給人一種向外擴(kuò)展的視覺感受。
    ??LZ是不是弄反了 ??

    來自上海 回復(fù)