我跟往常一樣回到公司辦公座位上，右手手上拿著樓下麥當(dāng)勞6元購(gòu)買的超值早餐，左手瞬時(shí)按下了桌子下的主機(jī)電腦開(kāi)關(guān)，然后一邊吃著雙層包皮夾雜著火腿的漢堡，慢慢在等待電腦的啟動(dòng)。不到一會(huì)兒時(shí)間，開(kāi)啟的電腦桌面就響起噠噠噠的聲音，自啟動(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è)面。
一開(kāi)始看到這個(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ì)看下需求搞，然后再確定怎么跟需求方撕逼~嘀嘀嘀，雙擊打開(kāi)交互稿文件▼
需求稿里面有這次宣傳頁(yè)的所有交互圖示，整個(gè)活動(dòng)可以分為三個(gè)部分，第一部分頭圖，第二部分點(diǎn)擊購(gòu)買大禮包，第三部分搶購(gòu)Q幣充值。
眨眼一看，摸摸小下巴沉思幾秒鐘，好像又沒(méi)那么難，應(yīng)該是可以完成的！這時(shí)我再具體看看頭圖文案：搶十月終極大禮，1元解鎖30話！！充值最高返利70%哦~奧，嗯，嚇？我思考了數(shù)分鐘，這是一道看文字想畫(huà)面的創(chuàng)作題?。。?/p>
福爾摩師V：首先看到這兩段文字，我要先提煉出具有動(dòng)次打次感覺(jué)的畫(huà)面詞語(yǔ)！例如：搶字！還要再提煉出最具用戶吸引力的畫(huà)面詞語(yǔ)：大禮??！
由此我可以聯(lián)想出以下畫(huà)面！密密麻麻的人群，在擁擠的搶一個(gè)禮物的畫(huà)面既視感~
大概的畫(huà)面印象有了，那么怎么起草稿呢？這里又需要考慮分析畫(huà)面元素組成跟色調(diào)是什么?。?/p>
畫(huà)面豬腳不用多說(shuō)了，本身自有的品牌形象企鵝娘+小黑子！畫(huà)面色調(diào)選擇，這里的關(guān)鍵字是10月，10月會(huì)有延續(xù)國(guó)慶的feel傾向，所以這里我選擇用紅黃色為主?。ê冒善鋵?shí)是我瞎比比的，因?yàn)槲冶旧硐矚g這個(gè)顏色搭配，哈哈哈~）
分析到這里基本思路都比較明確了就可以開(kāi)始畫(huà)，頭圖的草稿了！如下圖▼
再畫(huà)草稿的時(shí)候要考慮下這個(gè)畫(huà)面的延展性跟具體用在什么地方，我這個(gè)圖除了要用在H5活動(dòng)（750-1334）設(shè)計(jì)里面，還要用在閃屏（ip6，ip7，7p，ip8，8p，ipx，安卓機(jī).....）各種banner位置等等，所以在草稿的時(shí)候就要考慮這些問(wèn)題，盡量用大的尺寸去畫(huà)，而且盡量分層??！到時(shí)縮小再用也完全OJBK（一般我都是新建畫(huà)布A4分辨率300去畫(huà)圖的，看個(gè)人習(xí)慣吧！沒(méi)有限制），不然到時(shí)做延展設(shè)計(jì)時(shí)，你就會(huì)發(fā)現(xiàn)各種問(wèn)題！簡(jiǎn)直崩潰的不要不要哦?。。∷郧杏浨杏洠?/p>
草稿差不多了，就要開(kāi)始把第二部分，第三部分的交互設(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í)間啊?。。〔灰f(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)畫(huà)面?。ó?huà)面跟文案對(duì)不上，會(huì)跟尷尬！沒(méi)有1+1>2的效果）
02.整個(gè)活動(dòng)思考邏輯要理順，不是盲目立即去找參考！
03.理解設(shè)計(jì)需求，有問(wèn)題馬上去跟需求方溝通?。ú⒉皇敲總€(gè)需求方的需求稿都是深思熟慮的！你懂得！所以有問(wèn)題盡量溝通解決，可以把坑，扼殺在開(kāi)始設(shè)計(jì)之前！）
04.一定要快速出草稿跟需求方確定，過(guò)了以后才繼續(xù)往下做?。。。〔蝗荒銜?huì)后悔的！
05.活動(dòng)按鈕彈窗等等，可以單獨(dú)做個(gè)UI kit 給重構(gòu)開(kāi)發(fā)人員，方便后續(xù)工作開(kāi)展 ！
從拿到需求后，經(jīng)過(guò)了24小時(shí)48秒之后的我，又繼續(xù)回到了設(shè)計(jì)尸工位，右手手上拿著樓下麥當(dāng)勞6元購(gòu)買的超值早餐，左手瞬時(shí)按下了桌子下的主機(jī)電腦開(kāi)關(guān)，然后一邊吃著雙層包皮夾雜著火腿的漢堡，慢慢在等待電腦的啟動(dòng)。誒？怎么畫(huà)面如此熟悉，仿佛發(fā)生過(guò)的場(chǎng)景一樣~我到底做了什么？我在哪里？我是誰(shuí)？
