--------------------譯者寫在前邊----------------------------
一個良好的習(xí)慣和流程，能事半功倍，高效，方向感明確。
設(shè)計師初入行最忌諱不思考的行動。
不管是創(chuàng)意還是溝通。
這篇文章很好的明確了職場中設(shè)計師要用勁的地方。
1，明確需求點。2，分步驟，從發(fā)散到最后收緊、細化的設(shè)計思路。
如果我初入職場時早點有人點播我這些。
也不至于那時候像個傻子一樣熬夜也干不對點子！
大家好，我是Dwango的設(shè)計師砂肝（昵稱，因為愛吃。砂肝=雞胗）
我平時的工作主要是負(fù)責(zé)niconico綜合頁面和排行榜頁面的設(shè)計。
也會設(shè)計一些logo和矢量插畫，總之比較雜。
去年10月25日“二コナレ”這個網(wǎng)站更新了卡通形象。
以這個設(shè)計為例，向大家呈現(xiàn)一下整套“服務(wù)類網(wǎng)站卡通形象設(shè)計”的全過程。
很多準(zhǔn)備從事插畫設(shè)計的設(shè)計師，應(yīng)該很想了解在實際的工作中，
究竟是怎樣的制作流程以及設(shè)計過程中應(yīng)該注意什么。
本文主要介紹的就是實際工作中，插畫形象設(shè)計的制作流程和需要注意點，應(yīng)該對新老手都有些幫助。
首先了解下， 為什么服務(wù)行業(yè)類的網(wǎng)站也需要設(shè)計卡通插畫形象呢
在介紹具體的制作流程前，先給大家介紹下服務(wù)網(wǎng)站設(shè)計卡通形象的初衷。
在nikoniko動畫網(wǎng)站里有當(dāng)家卡通形象“小電視”和“立體人設(shè)小妞”
·······························譯者注······································
看到這應(yīng)該有人注意到了。
這個NICONICO網(wǎng)站就是中國鼎鼎有名的B站的濕~父~。
NICONICO網(wǎng)站誕生于2006年。彈幕發(fā)源地。
作者為之設(shè)計的"NICONARE"是NIKO旗下的一個PPT制作分享應(yīng)用，有網(wǎng)站和APP客戶端。
這個應(yīng)用可以制作PPT,可以給PPT錄制解說，可以彈幕評論等等功能。
············································································
為服務(wù)類網(wǎng)站設(shè)計卡通形象好處多多：
·用戶通過卡通形象，更容易記住網(wǎng)站曾經(jīng)提供給自己的服務(wù)
·通過賦予卡通形象豐富內(nèi)容，更生動的傳遞網(wǎng)站的服務(wù)宗旨
·上傳等待、加載中的畫面中有卡通形象的加入，也有益于用戶體驗。
如果僅用圓形、方形或者簡單人形構(gòu)造等造型進行設(shè)計的話，
想要傳達上述的點，控制起來會比較困難。
因此，這個卡通形象本身應(yīng)該豐富多變，這樣可以自如控制向用戶傳達的內(nèi)容。
了解設(shè)計制作本身的初衷和源起是很重要的，
這個理念應(yīng)該自始至終貫穿整個制作過程，作為指導(dǎo)方向。
所以在介紹流程前，大家應(yīng)該先明確這一點。
制作流程的介紹
根據(jù)不同情況會有些出入，但基本上就是這么個流程。
1.明確卡通形象的設(shè)計需求
2.制作草案
3.根據(jù)草案定方向
4.正式設(shè)計制作
5.正式版本確定·完成
一、明確設(shè)計需求
···························這是本次的需求內(nèi)容·····································
● 為了配合niconare的上線，需要制作攻略介紹海報和404頁面等
● 希望有一個專屬的卡通形象（能傳遞知識的，比如貓頭鷹的形象等等）
● 網(wǎng)站和APP的產(chǎn)品設(shè)計基本完成，需要定一個主題色。
····························································································
如果對需求有任何不明白的地方，應(yīng)該和需求人不斷溝通直至明白。
防止“雖然完成了卻根本不是我想要的！重做！”這種杯具的發(fā)生。
首先，設(shè)計一下卡通專屬形象。
二、繪制草圖
根據(jù)需求，先腦洞大開多畫一些草案。
這里就是自由發(fā)揮的時刻啦，多多益善（稍稍玩過火些也沒關(guān)系?。?/p>
● 多多和需求人溝通各類草案方向，只要是個方向即可討論。
所有的草案都是在和設(shè)計成員包括需求人一起，不停討論決定方向。
如果草案未被通過，需要反復(fù)多次進行制作討論，這個過程不要糾結(jié)細節(jié)，優(yōu)先速度。
···多設(shè)計幾個可以用來溝通討論的草案方向
···最基本的用色和形狀要成型，否則也不好討論決定
···要說出創(chuàng)意的思路
···不必糾結(jié)設(shè)計細節(jié)，速度第一。
● 要明白需求人的真正訴求點
比如說，需求內(nèi)容中提到“希望有一個貓頭鷹的形象”，
但其實真正的訴求點是“有一個智慧象征的形象”
考慮到這個訴求點，即使不是貓頭鷹，也可以嘗試其他的動物形象了。
• 以下是按照貓頭鷹的思路設(shè)計的草案
• 從智慧這個思路的聯(lián)想
• 智慧之果·蘋果
如果沒有抓住真正的訴求點，要直接與需求人對話，重新收集情報。
● 也可以通過其他角度聯(lián)想，出出點子。
根據(jù)網(wǎng)站服務(wù)內(nèi)容，名字的叫法上延伸出來的創(chuàng)意。
• 根據(jù)服務(wù)內(nèi)容聯(lián)想出的：
• 發(fā)布會（發(fā)表、參觀、新品發(fā)布會？……）
• 名字發(fā)音的延伸創(chuàng)意（nare人 nare人類 幻~）
• 用戶可能喜歡的（對應(yīng)女性客戶群）
三、討論草案定方向
把所有草案給需求人看，從中選出可以進一步設(shè)計的方案。
如果沒有一個相中，就要再重新構(gòu)思畫草圖。
這次的草案中，紅色勾出的是被選中的方案
接下來進一步設(shè)計這些方案，并開始軟件設(shè)計
這次提案的“透特智慧之神”反響不錯，接下來以這個為例開始軟件設(shè)計
四、用設(shè)計軟件進一步設(shè)計
4-1根據(jù)網(wǎng)站和APP的風(fēng)格，決定一下卡通形象的繪畫風(fēng)格和繪制工具。
這次的情況：
1.網(wǎng)站整體是扁平風(fēng)
2.目標(biāo)客戶群沒有性別傾向
3.需要適用多種使用環(huán)境
基于以上理由，決定了以下的風(fēng)格配色和繪制工具：
·減少渲染和立體效果，采用盡量扁平化的設(shè)計
·配合服務(wù)網(wǎng)站的基調(diào)，使用中性配色
·為了配合多種環(huán)境使用，在illustrator里進行矢量設(shè)計
4-2 設(shè)計
①掃描草圖，放入軟件
·草圖的線不用畫的特別準(zhǔn)確。
如果用很細的線畫出準(zhǔn)確路徑，在用鋼筆工具重新勾勒時，一旦沒有對實，
細節(jié)部分會看起來很奇怪，增加勾勒的壓力
·具體問題具體分析，就本次來說，能夠指導(dǎo)勾勒的方向路徑即可。
②根據(jù)草圖進行鋼筆勾勒
運用Illustrator的鋼筆工具重新勾勒草圖，制作矢量圖形
為了今后方便動作設(shè)計 把身體分割成多個組成部分
頭 身體 腿和腳 臉的內(nèi)容等等
③上色
根據(jù)草圖的配色定主題色。
檢查是否符合服務(wù)類網(wǎng)站的用色，要時常保持這種意識。
④ 調(diào)整全體
4-3 附贈：名字和一些簡單的說明
4-4 其他幾個草案也按照同樣的過程依次制作出來
五、最終確定方案
從中意的草案進一步軟件設(shè)計成的幾個方案里 決定最終方案
這次很開心，NARE神被采用為主視覺卡通，其他方案可以靈活運用在其他地方。
很欣慰~！
Illustrator的卡通形象就算完成了?。?/p>
六、制作矢量海報圖
把設(shè)計好的卡通形象進行組合布局，設(shè)計海報
這里的過程和卡通形象設(shè)計過程一樣，先畫草圖，再制作。
盡量采用比較簡單可以多場合使用的設(shè)計元素，會非常便利！
● 導(dǎo)航教程圖
● 404頁面
● 其他……
總結(jié)
這就是全部制作過程了。
希望能給今后從事插畫設(shè)計的設(shè)計師有所幫助
制作過程中需要特別注意的點：
● 如果想給出自己有價值的提案，首先要好好理解需求。
● 決定運用哪個卡通形象時，多從各個角度來考慮下。
● 最開始不要太細化，或糾結(jié)細節(jié)，和需求人多討論共享，方向ok后再細化。
● 最好能設(shè)計可以支持多種設(shè)計環(huán)境使用的設(shè)計源文件。
就到這兒吧 謝謝大家 下期再見！
作者介紹
砂肝
Designer
擅長logo、插畫和平面類設(shè)計
喜歡的食物當(dāng)然是砂肝（雞胗子）。
