來(lái)源：三根設(shè)計(jì)骨（微信號(hào)：bone-bones）
作者：不沉的骨頭
原標(biāo)題《天貓雙11頁(yè)面視覺(jué)分析（預(yù)熱期）》
本文經(jīng)作者授權(quán)，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載
天貓官方雙11頁(yè)面上線(xiàn)了，大家都知道11.11（光棍節(jié)要來(lái)了）替還是單身的微微心疼3秒。又或者是買(mǎi)買(mǎi)買(mǎi)、又要開(kāi)始敗家了。
而作為設(shè)計(jì)師，我們看到了什么？
首先先放一張?zhí)熵?1.11入口圖
紅金搭配、依然豪氣的不要不要的。
今年的天貓雙11給大家的感受是什么、牛逼、炸裂、絢麗，要過(guò)目不忘、要流連忘返？
先看下GIF里面的幾張圖
大量運(yùn)用了平面構(gòu)成中的設(shè)計(jì)手法
平面構(gòu)成是視覺(jué)元素在二次元的平面上，按照美的視覺(jué)效果，力學(xué)的原理，進(jìn)行編排和組合，它是以理性和邏輯推理來(lái)創(chuàng)造形象、研究形象與形象之間的排列的方法。是理性與感性相結(jié)合的產(chǎn)物。（百度平面構(gòu)成的解釋?zhuān)?/span>
通過(guò)幾何圖形的重復(fù)排列，配合明亮、輕跳的色彩帶來(lái)讓人興奮、刺激的視覺(jué)效果。
那么頁(yè)面還有那些地方出彩的呢、所以在這里我通過(guò)幾點(diǎn)分析給大家：
第一、售賣(mài)頁(yè)主會(huì)場(chǎng)
一、場(chǎng)景
非常強(qiáng)烈的購(gòu)物情景代入感覺(jué)、背景由商場(chǎng)樓盤(pán)組成，這就是為什么看到銀泰這些地方就會(huì)有購(gòu)物的欲望，看到商城大腦反應(yīng)給我們的直覺(jué)就是用來(lái)購(gòu)物、那自然就達(dá)到了節(jié)日的目的。
背景上面承載的信息：
1. 雙11logo標(biāo)識(shí)用來(lái)強(qiáng)調(diào)形象傳遞、這也是每年雙11都會(huì)這樣做。
2. 促銷(xiāo)海報(bào)及大牌logo，促銷(xiāo)海報(bào)引導(dǎo)刺激用戶(hù)購(gòu)物欲望，大牌logo（全英文）增強(qiáng)品質(zhì)感和全球、時(shí)尚的感受。
二、角度
1. 在角度上面，背景高樓的傾斜和下面色塊的傾斜，帶來(lái)非常強(qiáng)的縱深感。在平面上構(gòu)造空間縱深感。
2. 其次也起到了非常強(qiáng)烈聚焦效果，讓你的視覺(jué)直擊中心。沒(méi)錯(cuò)就是商品和標(biāo)題。
3. 強(qiáng)烈的傾斜角度也給人帶來(lái)了速度感，在心理上面讓用戶(hù)感受到節(jié)日的氛圍和緊張感受。（一緊張就想抓點(diǎn)什么）
三、顏色
配色上面主打紫色調(diào)和漸變色、另外如左圖所示，漸變色均為臨近的顏色漸變，所以也不會(huì)那么突兀。
1. 天貓國(guó)際主色調(diào)為紫色
2. 紫色是由溫暖的紅色和冷靜的藍(lán)色化合而成，是極佳的刺激色。所以刺激不就是促銷(xiāo)最需要的么。在中國(guó)傳統(tǒng)里，紫色是尊貴的顏色，如北京故宮又稱(chēng)為“紫禁城”，亦有所謂“紫氣東來(lái)”。其次、紫色高貴神秘的顏色。
3. 輔助圖形為漸變色、很醒目和時(shí)尚。相信大家在8月份的時(shí)候應(yīng)該會(huì)看到過(guò)類(lèi)似這樣一篇文章：
漸變配色的回歸正巧是在扁平化大行其道的今天，所以它不可避免地同大量扁平化的元素搭配到了一起，而其中最值得考慮的因素，就是色彩。某些用色最大膽、跨度范圍最大的漸變色設(shè)計(jì)干脆直接就從扁平化配色中“借用”色彩。
但是，只是把漸變色用在背景上面。所以在輔助圖形上面用上了漸變色，非常出彩。
要說(shuō)明的是，顏色用寫(xiě)輕佻一些的，別老是正那些近視色，搞得頁(yè)面標(biāo)題標(biāo)題不突出、商品商品不突出。
另外放2張be上面設(shè)計(jì)師的2張作品
四、標(biāo)題
天貓的頁(yè)面標(biāo)題沒(méi)有立體，沒(méi)有夸張的變形。夠直接、清爽、大方。
居中排版最穩(wěn)定、也是最容易的做法。上文、下圖，也是運(yùn)營(yíng)活動(dòng)主會(huì)場(chǎng)最常見(jiàn)的應(yīng)用方式，因?yàn)榻o人比較正式、重要的感受。你想想一個(gè)點(diǎn)如果在右邊、左邊是不是顯得不是那么重要，沒(méi)有主角光環(huán)。
再看電影海報(bào)，是不是主角都在中間。就是要告訴那么多頁(yè)面、那么多類(lèi)目我就是主會(huì)場(chǎng)。
五、輔助形
天貓雙11的logo爆出來(lái)的時(shí)候、就知道他的輔助形很多就是logo圍繞的那些橢圓射線(xiàn)、似舞臺(tái)感覺(jué)、又像人民大會(huì)堂不信你看。
哈哈，開(kāi)個(gè)玩笑、還是說(shuō)正經(jīng)的吧。
1. 輔助形橢圓形非常好的動(dòng)感圖形，又圓潤(rùn)。輔助圖形上面也是有一條視覺(jué)引導(dǎo)線(xiàn)。
把風(fēng)格和空間感結(jié)合起來(lái)，讓平靜的頁(yè)面圖案動(dòng)了起來(lái)的。同時(shí)它們之間都連接起來(lái)，不會(huì)造成視覺(jué)的散亂。
這樣可以給頁(yè)面帶來(lái)動(dòng)感和引導(dǎo)、動(dòng)詞打次動(dòng)詞打次。
2. 貓頭里面的圖案和應(yīng)用頁(yè)面背景的圓形圖案。
貓頭里面不管是并列的小圓點(diǎn)，還是發(fā)散性圓形圖形，都帶來(lái)了視覺(jué)上面的節(jié)奏感。也可以說(shuō)這種風(fēng)格是歐普風(fēng)（不了解的可以百度下）。
圖案總是給人一種精致的感覺(jué)、而平面構(gòu)成幾何圖形總會(huì)讓你的頁(yè)面更加很時(shí)尚、節(jié)奏感、動(dòng)感。從視覺(jué)心理上，平面構(gòu)成與圖案也就形成了在對(duì)藝術(shù)形式的審美感知及情感體驗(yàn)。
列如：
這些元素的組成結(jié)構(gòu)嚴(yán)謹(jǐn)，富有極強(qiáng)的抽象性和形式感。又具有多方面的實(shí)用特點(diǎn)和創(chuàng)造力的設(shè)計(jì)作品，與具象表現(xiàn)形式相比較，它更具有廣泛性。
六、貓頭
貓頭依然精彩，沿用性和易用性很強(qiáng)。所以前一久被那46個(gè)商家貓頭刷屏了朋友圈。選了幾張放上來(lái)。
第二、售賣(mài)頁(yè)分會(huì)場(chǎng)
先來(lái)幾張分會(huì)場(chǎng)頭圖
那么我們從以下幾個(gè)點(diǎn)分析下分會(huì)場(chǎng)，都具備有：
1. 背景橢圓圖案的復(fù)用、橢圓輔助形的貫穿整個(gè)活動(dòng)。
2. 顏色輕佻、對(duì)比強(qiáng)，促銷(xiāo)氛圍感強(qiáng)，加上了漸變色，同時(shí)也很新穎。
3. 排版右文左圖，分會(huì)場(chǎng)的最明顯的特征之一。，這樣做讓分會(huì)場(chǎng)的易用性非常高。
其次，輔助圖形部分用到了顏色的重復(fù)，視覺(jué)上面還挺有意思的嘛、同時(shí)帶來(lái)了也有節(jié)奏感、動(dòng)感：
順便放幾張前幾天收集到的幾張顏色重復(fù)的視覺(jué)圖、大家隨意感受下：
全程總結(jié)：
1. 漸變色更出彩、輕佻、時(shí)尚；
2. 幾何圖形讓頁(yè)面具有時(shí)尚氣息、抽象性和形式感；
3. 商品和輔助形之間需具有視覺(jué)上面的連接。
轉(zhuǎn)載請(qǐng)?jiān)谖恼麻_(kāi)頭和結(jié)尾顯眼處標(biāo)注：作者、出處和鏈接。不按規(guī)范轉(zhuǎn)載侵權(quán)必究。
未經(jīng)授權(quán)嚴(yán)禁轉(zhuǎn)載，授權(quán)事宜請(qǐng)聯(lián)系作者本人，侵權(quán)必究。
本文禁止轉(zhuǎn)載，侵權(quán)必究。
授權(quán)事宜請(qǐng)至數(shù)英微信公眾號(hào)(ID: digitaling) 后臺(tái)授權(quán)，侵權(quán)必究。
評(píng)論
評(píng)論
推薦評(píng)論
全部評(píng)論（2條）