兩套風(fēng)格各有優(yōu)劣，“三維風(fēng)格”細(xì)節(jié)豐富，但如果把控不好，容易使視覺顯得“過重”，因而對(duì)視覺掌控力的要求較高。而“矢量風(fēng)格”視覺較輕量，不容易對(duì)內(nèi)容產(chǎn)生干擾，無(wú)論是繪制難度還是使用場(chǎng)景對(duì)設(shè)計(jì)師的要求都相對(duì)較低，因而泛用性更高。
決定使用何種風(fēng)格，往往和團(tuán)隊(duì)成員配置相掛鉤。比如在以前的公司，視覺部分的設(shè)計(jì)由外包團(tuán)隊(duì)負(fù)責(zé)，那么就會(huì)面臨設(shè)計(jì)質(zhì)量不好把控的風(fēng)險(xiǎn)。在這樣的環(huán)境下，三魚選擇以“矢量風(fēng)格”為主，并制定了一套視覺設(shè)計(jì)規(guī)范：
首先我沉淀了一批泛用性較高的素材，方便團(tuán)隊(duì)成員快速取用。
接下來(lái)，面向團(tuán)隊(duì)中一些更為“高階”的設(shè)計(jì)玩家，三魚制定了一套易于上手的創(chuàng)作規(guī)則，方便讓他們加入進(jìn)來(lái)一起創(chuàng)作，從而豐富素材庫(kù)。于是我把矢量插圖拆解為“模型”、“貼圖”、“傳輸介質(zhì)”，各沉淀出常見的基礎(chǔ)物料(如下圖)。
最終輸出給團(tuán)隊(duì)一套包含了各種基礎(chǔ)模型的psd、一套包含了貼圖和介質(zhì)的透明底逐幀動(dòng)畫。
最后，我只需要通過一段使用教程，就能夠教會(huì)團(tuán)隊(duì)上手這套素材模板。它實(shí)在是太簡(jiǎn)單了，只需要以下兩步：
1. 在PS中用“基礎(chǔ)模型”繪制出靜態(tài)的效果；
2. 在AE中將“貼紙”“介質(zhì)”利用“邊角定位”功能貼到圖形上，即可完成動(dòng)畫的制作。
（當(dāng)然，如果不需要做動(dòng)畫，步驟二里面的操作也完全可以放到PS中完成）
通過這套規(guī)范與教程，三魚把矢量繪制的難度大幅度降低，其他設(shè)計(jì)同學(xué)也能順利地在此基礎(chǔ)上展開創(chuàng)作，設(shè)計(jì)效果遍地開花，設(shè)計(jì)師和業(yè)務(wù)方都很開心。
不知道大家有沒有發(fā)現(xiàn)，雖然這套風(fēng)格被稱為“矢量”，但三魚在其中虛虛實(shí)實(shí)地穿插了很多三維渲染。下圖是以前的作品，二者靈活搭配在我的作品中很常見。
https://www.zcool.com.cn/work/ZMjkzMzUzOTY=.html
后來(lái)我還嘗試加入人物規(guī)范。可惜哪怕我把規(guī)范做到了頭、手、腳可以自由拼接組合，大家還是只愿意用我提供的那幾個(gè)“范例素材”。這時(shí)“矢量風(fēng)格”的缺點(diǎn)漸漸暴露出來(lái)：素材使用的靈活性較低，三魚已經(jīng)無(wú)法通過完善素材庫(kù)來(lái)提升大家的工作效率了。
于是我嘗試制作3D素材。3D素材有個(gè)特點(diǎn)：即制作過程雖然很繁瑣，但制作完成后，素材使用起來(lái)很輕松。比如人體模型，雖然建模的過程很繁瑣，但大家只需要拿到成品去擺Pose就成了。
果然，模型建好以后，擺Pose的難度就很低了，于是順利產(chǎn)出了一系列B端常用的動(dòng)畫循環(huán)。(想玩玩的可以找我要人模源文件，你會(huì)發(fā)現(xiàn)模型一旦做出來(lái)，后續(xù)的創(chuàng)意空間是源源不斷的)。
我們把這些小動(dòng)畫應(yīng)用于業(yè)務(wù)場(chǎng)景中，順利投入工作。
后續(xù)的創(chuàng)作成本已經(jīng)變得可控，甚至還可以自由地切換質(zhì)感，根據(jù)需要來(lái)決定它是“矢量”還是“三維”。(暴露了沒有仔細(xì)觀察生活，姿勢(shì)不太自然，見笑了…)
咳咳… 越聊越遠(yuǎn)了。不過大家也發(fā)現(xiàn)了，不管是我還是我的團(tuán)隊(duì)，隨著我們對(duì)質(zhì)量與效率的進(jìn)一步追求，視覺風(fēng)格中融入“三維”的一環(huán)是遲早的事了。相比于PS繪制，“三維風(fēng)格”需要在立體的空間內(nèi)設(shè)定構(gòu)圖，然后是建模+材質(zhì)+布光，制作的成本明顯高了很多。
雖然制作成本較高，但模型的細(xì)節(jié)度也是PS繪制所達(dá)不到的，而且一旦建模完成，后續(xù)的擴(kuò)展自由度會(huì)非常高。比如自由地變換角度/顏色。
3D更大的優(yōu)勢(shì)還在于豐富的動(dòng)畫演繹空間。
但就像前面說的，“三維風(fēng)格”對(duì)設(shè)計(jì)師的要求明顯高了很多，而三魚面對(duì)的依然是一個(gè)沒有3D基礎(chǔ)的設(shè)計(jì)團(tuán)隊(duì)。但這一次三魚選擇了另一種方式——面向團(tuán)隊(duì)成員開展3D軟件培訓(xùn)，而且是一場(chǎng)有別于常規(guī)課程的培訓(xùn)。
很久以前，在三魚還是個(gè)美術(shù)老師的時(shí)候，在每屆學(xué)生的第一堂課上，我都會(huì)講這么一段話：“這節(jié)課我所講的內(nèi)容，就是你們學(xué)畫畫所需要掌握的所有理論知識(shí)。接下來(lái)的時(shí)間里，我會(huì)不斷重復(fù)它們，并和你們一起反復(fù)練習(xí)，直到你們熟能生巧！”這就是三魚對(duì)掌握一個(gè)視覺技能的經(jīng)驗(yàn)：唯手熟爾。只有反復(fù)且高質(zhì)量的練習(xí)才是掌握視覺技能的關(guān)鍵。
因此我對(duì)團(tuán)隊(duì)的培訓(xùn)方式很特別，開課的第一天我就坦言：“三魚掌握的C4D功能不超過10個(gè)，所以各位不要有壓力，我只教10個(gè)功能，傻子都能學(xué)會(huì)。而且三魚能把這10個(gè)功能用到天花板，只要你們徹底掌握這10個(gè)功能，那么三魚過往的99%的作品你們就都會(huì)做了。所以你們也看到了，三魚并非一個(gè)“百科全書”式的老師，倘若你們對(duì)這10個(gè)以外的功能感興趣，去網(wǎng)上搜教程會(huì)比問我效果更好… 當(dāng)然，雖然我只教這不到10個(gè)功能，但我會(huì)用無(wú)數(shù)個(gè)高質(zhì)量的案例來(lái)反復(fù)教這10個(gè)功能，直到你們徹底掌握它…”
這種培訓(xùn)方式效果還不錯(cuò)。課程進(jìn)行沒多久，已經(jīng)有同學(xué)能將技能應(yīng)用到業(yè)務(wù)中了。而且隨著可復(fù)用的場(chǎng)景、材質(zhì)、模型資源越來(lái)越豐富，如今我們團(tuán)隊(duì)的3D制作效率已遠(yuǎn)超PS繪制，當(dāng)設(shè)計(jì)師可以靈活選擇視覺表現(xiàn)形式時(shí)，手上功夫便不再是制約創(chuàng)意的瓶頸。
其實(shí)我團(tuán)隊(duì)有一位設(shè)計(jì)師之前曾學(xué)過3D，但因?yàn)椤皼]有應(yīng)用場(chǎng)景”，學(xué)會(huì)以后又漸漸忘光了。
誒？…這哪是說他啊，分明也是在說你對(duì)吧？哈哈哈哈！
在第一堂課前，三魚臨時(shí)讓大家做了個(gè)小測(cè)試，內(nèi)容很簡(jiǎn)單：“鋼筆工具”人人都會(huì)吧？那好，我現(xiàn)在在網(wǎng)上隨便搜一張“魚”的圖片，給大家5分鐘的時(shí)間，用鋼筆工具把它的外輪廓描下來(lái)。
你們猜測(cè)試結(jié)果怎么樣？居然沒人能在5分鐘內(nèi)熟練地把外輪廓描下來(lái)，可“鋼筆工具”不應(yīng)該是每個(gè)設(shè)計(jì)師都必須掌握的基本技能嗎？其實(shí)這就是問題點(diǎn)：“會(huì)”和“掌握”是兩碼事，大部分設(shè)計(jì)師所謂的“會(huì)”，可能僅僅只是了解“兩個(gè)卯點(diǎn)控制一段曲線”而已，很少有人思考過如何以最少的卯點(diǎn)繪制出想要的效果吧。熟練使用鋼筆工具的人，往往可以很準(zhǔn)確地放置卯點(diǎn)，不熟練的人，則需要反復(fù)試錯(cuò)，耗費(fèi)了很多精力和時(shí)間成本。
講到這里你可能已經(jīng)意識(shí)到了：不同熟練度的人使用“鋼筆工具”耗費(fèi)的成本是不同的，熟練度越低，成本越不可控，而當(dāng)我們面對(duì)有限的項(xiàng)目排期時(shí)，我們就更傾向于使用成本可控的自己熟悉的手法來(lái)解決問題，于是這個(gè)方案每次都被繞開，被其它解決方案替代，其熟練度永遠(yuǎn)練不上來(lái)。
明白三魚要說什么了嗎？不是沒有應(yīng)用場(chǎng)景，而是以你目前的熟練度，根本無(wú)法控制成本。這就是為什么我只教10個(gè)功能，卻要求大家反復(fù)練習(xí)反復(fù)刷題的原因，熟練度才是最重要的。
噢對(duì)了，那套人模我后來(lái)又試著用來(lái)詮釋音視頻場(chǎng)景，比如直播(Live Brodcast)、視頻會(huì)議(Video Conference)、連麥(Real-Time Communication)、主播PK(Anchor Player Killing)、視頻發(fā)布(Video Posted)中。還挺有意思的的，大家可以拿去試著結(jié)合自己的場(chǎng)景玩玩。
今天就聊到這吧，來(lái)看看我都講了啥：
一開始我分享了兩套B段反饋?lái)?yè)的風(fēng)格，并分享了源文件，算是比較正經(jīng)的設(shè)計(jì)技法交流；
接下來(lái)我站在管理者的角度，講了講我在把控團(tuán)隊(duì)視覺風(fēng)格的經(jīng)驗(yàn)，以及我做事方式的轉(zhuǎn)變過程，穿插分享了人模的設(shè)計(jì)技法交流(感興趣的可以問我要源文件)；
再后來(lái)，隨著做事方式的轉(zhuǎn)變，我也從一名管理者變成了一名人民教師… emm
看來(lái)管理的盡頭，竟然是當(dāng)老師… 也不知道今天三魚講的這些對(duì)大家有沒有幫助。
原文地址：站酷
作者：三魚先生
轉(zhuǎn)載請(qǐng)注明：學(xué)UI網(wǎng)》干貨雖然遲到了，但三魚還有私貨
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、
UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司