《搶十月終極大禮》宣傳頁(yè)面設(shè)計(jì)

2018-12-17 1734 13


 

我跟往常一樣回到公司辦公座位上,右手手上拿著樓下麥當(dāng)勞6元購(gòu)買的超值早餐,左手瞬時(shí)按下了桌子下的主機(jī)電腦開關(guān),然后一邊吃著雙層包皮夾雜著火腿的漢堡,慢慢在等待電腦的啟動(dòng)。不到一會(huì)兒時(shí)間,開啟的電腦桌面就響起噠噠噠的聲音,自啟動(dòng)的郵箱接收了最近收到的郵件,此時(shí)我還沉醉在超值早餐的吞咽過(guò)程中,還沒(méi)回過(guò)神來(lái)。伴隨著一口熱辣辣的豆?jié){入口,我緩緩的把視線移動(dòng)到了收到的工作郵件當(dāng)中。噔~一個(gè)活動(dòng)設(shè)計(jì)H5需求彈出,這2天我需要設(shè)計(jì)一個(gè)《搶十月終極大禮》的宣傳頁(yè)面。
 


 

一開始看到這個(gè)活動(dòng)需求的截止時(shí)間,其實(shí)我是拒絕的,2天時(shí)間設(shè)計(jì)一個(gè)炫酷吊炸天的活動(dòng)頁(yè)面,感覺(jué)時(shí)間是不足夠的,不過(guò)作為一個(gè)有專業(yè)精神的設(shè)計(jì)尸,我覺(jué)得我還是應(yīng)該細(xì)細(xì)看下需求搞,然后再確定怎么跟需求方撕逼~嘀嘀嘀,雙擊打開交互稿文件▼


 


 

需求稿里面有這次宣傳頁(yè)的所有交互圖示,整個(gè)活動(dòng)可以分為三個(gè)部分,第一部分頭圖,第二部分點(diǎn)擊購(gòu)買大禮包,第三部分搶購(gòu)Q幣充值。


 


 


 

眨眼一看,摸摸小下巴沉思幾秒鐘,好像又沒(méi)那么難,應(yīng)該是可以完成的!這時(shí)我再具體看看頭圖文案:搶十月終極大禮,1元解鎖30話?。〕渲底罡叻道?0%哦~奧,嗯,嚇?我思考了數(shù)分鐘,這是一道看文字想畫面的創(chuàng)作題?。?!


 


 

福爾摩師V:首先看到這兩段文字,我要先提煉出具有動(dòng)次打次感覺(jué)的畫面詞語(yǔ)!例如:搶字!還要再提煉出最具用戶吸引力的畫面詞語(yǔ):大禮??!


 

由此我可以聯(lián)想出以下畫面!密密麻麻的人群,在擁擠的搶一個(gè)禮物的畫面既視感~


 

大概的畫面印象有了,那么怎么起草稿呢?這里又需要考慮分析畫面元素組成跟色調(diào)是什么???


 

畫面豬腳不用多說(shuō)了,本身自有的品牌形象企鵝娘+小黑子!畫面色調(diào)選擇,這里的關(guān)鍵字是10月,10月會(huì)有延續(xù)國(guó)慶的feel傾向,所以這里我選擇用紅黃色為主!(好吧其實(shí)是我瞎比比的,因?yàn)槲冶旧硐矚g這個(gè)顏色搭配,哈哈哈~)


 


 

分析到這里基本思路都比較明確了就可以開始畫,頭圖的草稿了!如下圖▼


 


 

再畫草稿的時(shí)候要考慮下這個(gè)畫面的延展性跟具體用在什么地方,我這個(gè)圖除了要用在H5活動(dòng)(750-1334)設(shè)計(jì)里面,還要用在閃屏(ip6,ip7,7p,ip8,8p,ipx,安卓機(jī).....)各種banner位置等等,所以在草稿的時(shí)候就要考慮這些問(wèn)題,盡量用大的尺寸去畫,而且盡量分層??!到時(shí)縮小再用也完全OJBK(一般我都是新建畫布A4分辨率300去畫圖的,看個(gè)人習(xí)慣吧!沒(méi)有限制),不然到時(shí)做延展設(shè)計(jì)時(shí),你就會(huì)發(fā)現(xiàn)各種問(wèn)題!簡(jiǎn)直崩潰的不要不要哦?。?!所以切記切記!


 

草稿差不多了,就要開始把第二部分,第三部分的交互設(shè)計(jì)稿去補(bǔ)充做完了~具體如下圖▼


 


 


 

到了這一步大概花費(fèi)了小半天時(shí)間(快速出草稿這一部分,越快越好,試錯(cuò)時(shí)間越短,你留給后面做設(shè)計(jì)細(xì)節(jié)的時(shí)間就越多!),基本的設(shè)計(jì)原型已經(jīng)出來(lái)了,這時(shí)候不要盲目的往下做哦!要去跟需求方溝通確認(rèn)下,這個(gè)草稿設(shè)計(jì)有沒(méi)問(wèn)題,有沒(méi)達(dá)到需求方的需求目的,不然你做到了一大半才去溝通,錯(cuò)了,重做!可是真的浪費(fèi)時(shí)間?。。?!不要說(shuō)了!都是淚~


 

此時(shí)我經(jīng)過(guò)了和需求方的反復(fù)溝通~她說(shuō):完全ojbk!沒(méi)問(wèn)題(很完美的即視感),這時(shí)我又默默的回到設(shè)計(jì)尸的工位,翹起了二郎腿,視線仰望45度角,嘴角向揚(yáng)露出微微一笑,心想(我真是個(gè)天才!),呃?滴答滴答滴答~時(shí)間不多了,趕緊細(xì)化設(shè)計(jì)!


 

設(shè)計(jì)過(guò)程展示▼


 


 

完整設(shè)計(jì)展示▼


 


 


 

總結(jié)活動(dòng)設(shè)計(jì)的一些核心點(diǎn)▼


 

01.分析理解文案想出對(duì)應(yīng)畫面!(畫面跟文案對(duì)不上,會(huì)跟尷尬!沒(méi)有1+1>2的效果)


 

02.整個(gè)活動(dòng)思考邏輯要理順,不是盲目立即去找參考!


 

03.理解設(shè)計(jì)需求,有問(wèn)題馬上去跟需求方溝通?。ú⒉皇敲總€(gè)需求方的需求稿都是深思熟慮的!你懂得!所以有問(wèn)題盡量溝通解決,可以把坑,扼殺在開始設(shè)計(jì)之前?。?/p>


 

04.一定要快速出草稿跟需求方確定,過(guò)了以后才繼續(xù)往下做?。。?!不然你會(huì)后悔的!


 

05.活動(dòng)按鈕彈窗等等,可以單獨(dú)做個(gè)UI kit 給重構(gòu)開發(fā)人員,方便后續(xù)工作開展 !


 

從拿到需求后,經(jīng)過(guò)了24小時(shí)48秒之后的我,又繼續(xù)回到了設(shè)計(jì)尸工位,右手手上拿著樓下麥當(dāng)勞6元購(gòu)買的超值早餐,左手瞬時(shí)按下了桌子下的主機(jī)電腦開關(guān),然后一邊吃著雙層包皮夾雜著火腿的漢堡,慢慢在等待電腦的啟動(dòng)。誒?怎么畫面如此熟悉,仿佛發(fā)生過(guò)的場(chǎng)景一樣~我到底做了什么?我在哪里?我是誰(shuí)?


 


 


 


 


20
評(píng)論區(qū)(0)
正在加載評(píng)論...