我跟往常一樣回到公司辦公座位上，右手手上拿著樓下麥當勞6元購買的超值早餐，左手瞬時按下了桌子下的主機電腦開關(guān)，然后一邊吃著雙層包皮夾雜著火腿的漢堡，慢慢在等待電腦的啟動。不到一會兒時間，開啟的電腦桌面就響起噠噠噠的聲音，自啟動的郵箱接收了最近收到的郵件，此時我還沉醉在超值早餐的吞咽過程中，還沒回過神來。伴隨著一口熱辣辣的豆?jié){入口，我緩緩的把視線移動到了收到的工作郵件當中。噔~一個活動設(shè)計H5需求彈出，這2天我需要設(shè)計一個《搶十月終極大禮》的宣傳頁面。
一開始看到這個活動需求的截止時間，其實我是拒絕的，2天時間設(shè)計一個炫酷吊炸天的活動頁面，感覺時間是不足夠的，不過作為一個有專業(yè)精神的設(shè)計尸，我覺得我還是應(yīng)該細細看下需求搞，然后再確定怎么跟需求方撕逼~嘀嘀嘀，雙擊打開交互稿文件▼
需求稿里面有這次宣傳頁的所有交互圖示，整個活動可以分為三個部分，第一部分頭圖，第二部分點擊購買大禮包，第三部分搶購Q幣充值。
眨眼一看，摸摸小下巴沉思幾秒鐘，好像又沒那么難，應(yīng)該是可以完成的！這時我再具體看看頭圖文案：搶十月終極大禮，1元解鎖30話??！充值最高返利70%哦~奧，嗯，嚇？我思考了數(shù)分鐘，這是一道看文字想畫面的創(chuàng)作題?。。?/p>
福爾摩師V：首先看到這兩段文字，我要先提煉出具有動次打次感覺的畫面詞語！例如：搶字！還要再提煉出最具用戶吸引力的畫面詞語：大禮！！
由此我可以聯(lián)想出以下畫面！密密麻麻的人群，在擁擠的搶一個禮物的畫面既視感~
大概的畫面印象有了，那么怎么起草稿呢？這里又需要考慮分析畫面元素組成跟色調(diào)是什么??？
畫面豬腳不用多說了，本身自有的品牌形象企鵝娘+小黑子！畫面色調(diào)選擇，這里的關(guān)鍵字是10月，10月會有延續(xù)國慶的feel傾向，所以這里我選擇用紅黃色為主?。ê冒善鋵嵤俏蚁贡缺鹊模驗槲冶旧硐矚g這個顏色搭配，哈哈哈~）
分析到這里基本思路都比較明確了就可以開始畫，頭圖的草稿了！如下圖▼
再畫草稿的時候要考慮下這個畫面的延展性跟具體用在什么地方，我這個圖除了要用在H5活動（750-1334）設(shè)計里面，還要用在閃屏（ip6，ip7，7p，ip8，8p，ipx，安卓機.....）各種banner位置等等，所以在草稿的時候就要考慮這些問題，盡量用大的尺寸去畫，而且盡量分層??！到時縮小再用也完全OJBK（一般我都是新建畫布A4分辨率300去畫圖的，看個人習慣吧！沒有限制），不然到時做延展設(shè)計時，你就會發(fā)現(xiàn)各種問題！簡直崩潰的不要不要哦?。?！所以切記切記！
草稿差不多了，就要開始把第二部分，第三部分的交互設(shè)計稿去補充做完了~具體如下圖▼
到了這一步大概花費了小半天時間（快速出草稿這一部分，越快越好，試錯時間越短，你留給后面做設(shè)計細節(jié)的時間就越多?。?，基本的設(shè)計原型已經(jīng)出來了，這時候不要盲目的往下做哦！要去跟需求方溝通確認下，這個草稿設(shè)計有沒問題，有沒達到需求方的需求目的，不然你做到了一大半才去溝通，錯了，重做！可是真的浪費時間?。。。〔灰f了！都是淚~
此時我經(jīng)過了和需求方的反復(fù)溝通~她說：完全ojbk！沒問題（很完美的即視感），這時我又默默的回到設(shè)計尸的工位，翹起了二郎腿，視線仰望45度角，嘴角向揚露出微微一笑，心想（我真是個天才?。?，呃？滴答滴答滴答~時間不多了，趕緊細化設(shè)計！
設(shè)計過程展示▼
完整設(shè)計展示▼
總結(jié)活動設(shè)計的一些核心點▼
01.分析理解文案想出對應(yīng)畫面?。ó嬅娓陌笇Σ簧?，會跟尷尬！沒有1+1>2的效果）
02.整個活動思考邏輯要理順，不是盲目立即去找參考！
03.理解設(shè)計需求，有問題馬上去跟需求方溝通！（并不是每個需求方的需求稿都是深思熟慮的！你懂得！所以有問題盡量溝通解決，可以把坑，扼殺在開始設(shè)計之前?。?/p>
04.一定要快速出草稿跟需求方確定，過了以后才繼續(xù)往下做！?。?！不然你會后悔的！
05.活動按鈕彈窗等等，可以單獨做個UI kit 給重構(gòu)開發(fā)人員，方便后續(xù)工作開展 ！
從拿到需求后，經(jīng)過了24小時48秒之后的我，又繼續(xù)回到了設(shè)計尸工位，右手手上拿著樓下麥當勞6元購買的超值早餐，左手瞬時按下了桌子下的主機電腦開關(guān)，然后一邊吃著雙層包皮夾雜著火腿的漢堡，慢慢在等待電腦的啟動。誒？怎么畫面如此熟悉，仿佛發(fā)生過的場景一樣~我到底做了什么？我在哪里？我是誰？
