撕掉“醜”的標籤，體素是如何讓遊戲更有趣的？

大家好，又到了更新Monster Farm開發日誌的時候，這次是由我大狸主講。作為更文一定要又臭又長又囉嗦的強迫症，我已經看不下去前面延靜齋孫（Zed） Erenyx（下文可能會習慣成自然地稱他為萍萍）那兩隻寫的名為開發日誌實為撒嬌秀基情實況的東東了……這次我得貢獻一點有實質性的內容，不然搞基搞多了大家還以為我們做的不是Game而是Gayme呢……

步步推進遊戲美術風格的構建，將Voxel畫風的遊戲儘可能做得美型的心得吧。

鑑於可能還有朋友不太清楚Voxel的概念，這裡先科普一下：

Voxel，就是Volume-Pixel的縮寫，中文一般稱體素，也就是體積畫素。是一種把電腦中二維空間的最小單位——畫素，空間化3D化了以後的概念。畫素的最小單位可以看作是一個個小正方型，體素的最小單位也可以看作是一個個小正方體。用這種構成方式製作的模型就是體素模型，做成的遊戲就是體素遊戲。

舉例來說，我們最熟悉的馬里奧，最早的畫素風是這樣的：


轉換成體素後就是這樣的：


如果把馬里奧橫板過關遊戲做成體素風格的，它可能就是這樣的：


蠻酷的對不對？有一種很爽的Q萌感，用延靜齋孫的話說就是有濃烈的玩具感，是一種天然具有玩樂感覺的非常適合遊戲的風格。

所以一開始Erenyx找我做主美的時候，告訴我這是款voxel風格的遊戲，並給我看了MagicaVoxel這軟體自帶的一個小萌妹的時候，我就瞬間被迷住了。


欸這種短短的粗粗的方方的感覺，好像個萌萌的小玩具啊！多麼符合老阿姨我的胃口！於是一口答應下來。

然而沒多久，隨著初步嘗試了製作和進行了一點深入的瞭解，我發現了體素遊戲黑暗的一面……

體素=醜？不不不！

對於很多人來說，第一個走進他們視野的Voxel遊戲就是Minecraft了。這款遊戲絕對是我長這麼大來最心水的遊戲前Top3。最讓我欽佩的是，這款遊戲達成了一個遊戲美術夢寐以求的成就：玩法和美術風格無縫結合。構成遊戲畫面的基本元素——方塊，同時也是構成遊戲玩法的基本元素，緊密結合不分你我。不像絕大多數遊戲，玩法是玩法，畫風麼則隨了個便，導致你辛苦做了個好玩法，分分鐘就會被人拿去換皮九九八十一次冒充新遊戲，欲哭無淚啊有木有！Minecraft則完全做到了畫風和玩法繫結，換畫風基本就是換玩法，所以現在即使是有仿MC的遊戲，也多半根本改不掉MC那標誌性的塊塊畫風。敢抄玩法換皮？你會被人天天戳脊梁骨的：誒這不是MC嗎？

當然，渲染技術以後進步了MC也有可能被換皮，但至少……

換皮冒充新遊戲現在暫時是做不到了。


這是遊戲美術的浪漫！

然而，在非美術人員的眼裡可能就不是這樣了。我不止一次聽到人們對MC畫風評價為“吃藕醜”。當初我在玩MC時，我爸剛好撞進屋來，看到的場景是這個樣式的：


我爸第一句話就是：這什麼遊戲？Dos遊戲嗎？畫面怎麼這麼糙啊？你還玩這個？

我該怎麼跟他解釋我不是在開Dos遊戲懷舊，這是2011年的新遊戲……因為我得承認這配色、這粗糙的畫素塊、這鋸齒，確實跟這貨……


有異曲同工之效啊！（上為我小時候最喜歡的Dos遊戲《Prehistoric》）

甚至可以說……《Prehistoric》的畫面細節都比MC精細多了呢……

同樣，也有不少朋友是這種看法：


為什麼？明明是這麼萌的小方方小塊塊們，大家為何會覺得醜？


不過在做Voxel遊戲的時候，我們也確實發現了Voxel風格有很多處理不好，分分鐘就會讓顏值唰唰往下掉的陷阱。作為一個美術，當然是要和“醜”戰鬥到底的，我想我們首先得把這些會讓遊戲長殘的因素一條一條揪出來，再一條一條消滅掉，誓死捍衛遊戲的顏值！

一：光效和渲染

首先，Minecraft給人“醜”的感覺的原因，也許第一條就是“缺乏光效和渲染”。沒辦法MC動輒同屏百萬千萬級的方塊，再開實時渲染真的要狗帶的。然而很多渲染外掛都證明了假如有高大上的渲染，《我的世界》將是個多麼美麗的世界：



Minecraft製作的冰火君臨城和絕境長城，加了光影水反天氣渲染外掛。這和上面那張圖是一個遊戲嗎？！

這一點對於我們的遊戲來說則好辦得多。我們不需要玩家砌方塊，模型都是預置的，所以不用實時渲染千千萬萬的方塊，可以完全把方塊轉換成普通的模型，再去開渲染就好辦的多。

我們的技術美術萍萍在這方面能提供足夠的支援，通過自己寫Shader和尋找黑科技，順利把遊戲畫面加了宛如美圖秀秀濾鏡一般的特效……


以上來自去年12月的prealpha版本，我反正覺得這畫面是磨過皮的。

這是問題之一，託萍萍的福，應該不是什麼大問題。

二：狗牙問題

現在看我們的造型，不管是房子還是角色，都基本遵循了方方的風格，



但它最初不是這樣的。

大概是這樣的：



造型裡有很多的圓弧型和曲線，比如樹冠是圓形的，樹幹也是弧線型的，圍欄也是圓形的。我知道你想說這也不算太醜啊（嘿嘿這點自信還是有的），但是因為這圖的模型是縮小的，所以看著還好，如果是在遊戲裡的話，它實際看上去是這樣的：


放大了看，顆粒感十分明顯，我覺得這也挺萌的，但可能在外人眼裡，又是會覺得“很糙”的一種感覺。

最要命的在這裡：



這些地方的邊緣，因為畫素風的原因，參差不齊像狗牙一樣，Voxel風和Pixel一樣，如果畫素數不夠，在建立圓形和弧線結構的時候就會非常醜，全是狗牙。就連Photoshop看到這些都會受不了，哭著開啟Anti-alias軟化掉……。但在遊戲裡，如果我們堅持採用這種圓形和弧形很多的造型，就無法避免狗牙。

有人也許會說：加大畫素數不就好了。確實我們也想過這個方法，尤其是萍萍一開始是有點想要那種傳統畫素RPG風格biu~地一下就變成了立體的效果。我一開始也覺得這也可以的吧，因為體素不就是把畫素變立體嗎？


比如星露谷，不也是畫素風嗎？把這種畫素風Biu~地一下給做成立體的就行了吧？

後來才發現這個想法拿衣服了。體素風格是把傳統畫素風格的每個點都變成立方體，這就意味著同樣的單元數，單個體素所佔用的資源都是單個畫素的平方。這就導致了同樣的場景，體素能接納的畫素數要大大少於傳統畫素圖。

還是拿馬里奧舉個栗子：


這幾代馬里奧裡，前5個都是畫素風，但畫素和畫素仍然是不一樣的，第一個畫素馬里奧的畫素數可能也就是第五個馬里奧的五分之一（圖上前兩個馬里奧都拉大了，本來應該是極小的）。而上面星露谷的這張圖的畫素數(尤其是場景的畫素數）保守估計又比第五代畫素馬里奧大了五倍。它已經精細到快要脫離”畫素畫“的範疇了。

前面我們看過的馬里奧體素模型。


可以看到即使只是第二代馬里奧的畫素數，轉換成體素後的體素數量也已經讓人犯密恐了。事實就是即使是很小的畫素圖轉換成體素模型後都是蠻大的，這都將給製作過程帶來很大壓力（主要是我們的破電腦都帶不動太大的體素模型）。

所以這也是為什麼我們經常見到的體素模型都只有很低的解析度。


星露谷那個精度的體素模型，真的是不太現實。

傳統模型和體素模型的區別，簡單來說如下圖所示


前者是一個外殼，就像超市促銷時外面掛的氣球人偶，內裡是空心的，而後者則是由一個個小盒子堆成的，就像超市促銷時用商品盒子堆積起來的貨品堆。所以Voxel模型的特點就是在你看不見的內部，也含有大量的冗餘面，這也是為什麼Minecraft預設畫面那麼低質量，卻要消耗比3A大作還要多的資源的原因。

當然，前面說過了，其實我們最後是會把體素模型的顆粒轉換成面，變成傳統模型的，也就是把貨品堆變成充氣模型，所以我們的體素模型在Unity裡的模型只是“偽體素模型”，它們其實內裡也是空心的，最終遊戲的體積倒是不用過多擔心。但問題是，建模階段我們確確實實是要用體素建模的方式來做得，也就是實打實地一粒一粒地堆出模型。所以至少在建模階段，我們要和MC一樣面臨體素模型所帶來的大量冗餘面的問題。

而現有的體素軟體……我不是針對誰，我是說在座所有的……都是渣渣……

MagicaVoxel根本就不支援128*128*128以上大小的體素模型，這還能提高個毛解析度啊！（摔！）所以我們只好放棄了這款軟體。最後選擇了Qubicle，雖然它的優化也是渣渣，似乎壓根就不能發動顯示卡的優化功能，任你的電腦配置再高它也是不動如山……模型稍微大一些就連建個選區都要卡上幾分鐘，並且筆刷不能調、油漆桶只能單用不能配合選區，擠出工具基本是廢的，還動不動就崩潰……但好歹它支援無限大的模型。

現有的體素軟體都太不成熟了，畢竟是個小眾的風格。

有的用就不錯了，要啥自行車啊！

通過這個軟體，我們確實可以一定程度上提高模型的精度（只要適當地容忍做模型時的卡頓就行了……），但這個提高是有限的，仍然不足以高到抗鋸齒。要徹底解決狗牙問題還得另想辦法。

低解析度的體素模型碰到弧線和斜線全是狗牙，看來只能通過在設定美術風格的時候儘量少地使用斜線和弧線來解決問題。體素風格的特長還是在立方體，你看Crossy Road不就是麼，雖然解析度很低，但整體卻不顯得Low，還很Q很玩具。因為他們幾乎完全摒棄了斜線和弧線，全用的立方體。


這樣我們只要全用立方體去構成不就行了，一個點的立方體和100個點的立方體看上去沒差，媽媽再也不用擔心我們有狗牙。嘿嘿計劃通！


只要堅持立方體原則，它畫素多了少了不都是個方嗎？不怕的。

三、風格化VS代入感

古往今來，有很多采用立方體構成萬物的美美的藝術品。

比如：




比如紀念碑谷


再比如FEZ


方不是問題，學藝術的都知道一句話：寧方勿圓。只要君子愛方，方之有道，一樣能非常漂亮。現在幾何化、扁平化、抽象化的畫面也是潮流，用方，不落伍！

然而隨後我們又發現，方還是有問題的（……）。因為把任何事物都抽象成方的，基本上也就等於我們的藝術風格將會高度抽象化，風格化。

你也許會問，這有什麼問題呢？好多遊戲不都是這樣嗎？

問題就在於，高度的抽象感、符號化、形式化、玩具化的畫風，確實能非常好地去匹配那些帶給人“純粹的玩樂感”的，玩具一樣的遊戲。往往被應用於一些以玩法為核心，不涉及太多的代入感和感情要素的遊戲。

但假如是一個帶有敘事元素，和一定感情要素的遊戲，就不一定了。


比如這兩個房子，左面的房子比較風格化，抽象，右面的則極盡寫實。

那麼現在我們有一個關於家國大義愛恨情仇的史詩級故事要選擇舞臺，你會選擇哪個房子作為它的發生地呢？

很顯然，右邊的場景更寫實、更有滄桑感，更適合人們代入這個故事。而左邊的房子，作為童話故事的舞臺還可以，過於現實主義的故事放在這裡，說實話不太合適，你將無法面對著一個Q萌的場景去沉浸入一個恩怨情仇的史詩大片。當然你確實可以挑戰用童話的畫風講一個特現實特悲慘的故事，營造這種”反差萌“的間離感。比如Happy Tree Friends，可愛明亮的畫風講得全是血腥的故事。但你得承認，這個動畫雖然獵奇，卻沒那麼多讓人不忍直視的感覺，用可愛的畫風削弱故事的不適感並營造“反差萌”正是他們想要的。

但如果你想要老老實實地營造沉浸感，去讓這個故事帶給人他本來該有的印象，而不是利用反差製造間離感，故事和視覺風格是一定要匹配的。

換用到我們的遊戲中來，我們本來一開始也決定了用很抽象，很風格化，一切皆方的畫風，一是為了解決狗牙問題，二也是為了讓我們的遊戲畫風更突出，更酷更有風格。

但這時我們回頭看了看我們的大綱，想起了我們的故事。

這是一個帶有一定的戀愛養成要素，而且一定程度上有一定諷刺性的故事。（具體內容到下一次日誌會講）

戀愛養成要素？

我知道你要是對著這樣的角色，找到一點戀愛般的感覺應該還是不難的：


但如果是這樣的角色……


雖說也很有風格很可愛吧，但如果你不是miku廚，甚至事先不知道這個角色，要說戀愛的感覺實在是有點強人所難……

我知道有些Miku廚即使給他們一坨藍綠色的橡皮泥他們也能墜入愛河的，但這是因為這些廚腦子裡本身就有Miku醬完整的形象……所以我們也會考慮給體素角色加上立繪造型，方便大家把它們腦補成小美女小帥哥。但即使這樣，假如立繪畫的是很唯美，但遊戲畫面本身卻過於抽象，這兩者的畫風就差得太多了，撮合不到一塊兒去。所以遊戲場景本身的抽象度還是不能過高。

所以，舉這個栗子想說的就是：過於抽象的畫風不匹配我們的世界背景和故事。也就是搞藝術的人很愛講的一句話：形式和內容應該高度統一。我們的遊戲不是隻要投入腦細胞玩解謎玩動作就行了，而是希望玩家和遊戲世界有一定的感情共鳴和代入感。紀念碑谷，Fez這些遊戲以玩法為導向的特點很鮮明，敘事上致力於渲染一些小清新小朦朧的情愫，所以採用高度風格化的畫風很合適。

而且我們卻並不想挑戰和印表機/胖次/昆蟲/學園Handsome談戀愛的那種遊戲，只想老老實實做一款正常的帶有一點戀愛要素的怪物養成和農場遊戲。所以我們無法寄希望於玩家看著一堆不成人形的方塊角色和極簡單的方塊建築對這個世界產生認同感。

過於抽象，抽象到讓人無法沉浸和代入感情的畫風恐怕也是不行的。

好了，以上就是關於我們遊戲的美術風格該走什麼路線的一個漫長而艱難的思考過程。瞭解了這些種種的限制，接下來就該著手設計可用的概念了。

既然過於精細的畫風技術上實現不了，過於抽象的畫風又不扣題，我們是真的有了前門拒狼後門進虎的感覺……

此時我腦海中又浮現出了《遊戲發展途上國》中的景象………………


“Lea Liu請求挑戰遊戲美術方面的提升”，成功了當然皆大歡喜，失敗了就要背上一頭Bug哦……

那個時候，我們的其實已經有了第一版prototype了。萍萍表示對原來的風格挺滿意的，聽說我要Boost非常傷感……那幾天我隔著十米都能感覺到他怨念的氣場射向我……。

然而我和Zed討論了以上存在的問題，要改風格決心已定了。

究竟要怎麼畫出既保留了Voxel以立方體為主的造型特點，又能讓畫面適度地豐富，有一定的寫實感和代入感，不至於過於抽象呢？

當然首先想到的還是先把造型風格都改方，還是用主角的家的這間樹屋舉例：


無論是樹幹房屋還是樹冠，一律都放棄了圓弧和斜線，改用方形，甚至連屋頂都改為了平頂房。

但是真是有種莫名的不爽感，這樣的房子太醜，實在是不符合我的美學……


於是還是適當地請回了斜線元素，屋頂仍然是斜坡。屋頂本身就有瓦片形成的階梯狀，看上去不會馬上讓人聯想到狗牙，問題不大。


這樣房子的基本型定下來了，又在房子到底該有多少細節上糾結了一陣，最終還是搞出來了。只要不過多的使用圓弧和斜線，有一點點的話是可以容忍的。


之前的樹冠還是太像Fez了，找了一堆參考摸索了一陣，終於改為了給樹冠貼花紋，細節量和裝飾感都上去了，顏色也調整到更雅緻鮮明。基礎型從絕對的方改為了圓角方，在大部分地方對方形進行軟化。感覺終於在風格化和代入感上達成了比較滿意的平衡。

這樣，這張圖包含了建築的風格、樹、植物的風格，基本奠定了遊戲後來整體的風格。拿去問了一圈，大家基本還是喜歡這個新版的。

不過有了這張平面圖還沒完，拿到遊戲裡能不能有好的效果又是另外一回事，於是艾薇李頂著Qubicle的卡頓把這個模型趕緊擼了出來，然後用PS模擬了一下最終的遊戲效果，加了點虛擬的UI和渲染，看看3D化後的世界是怎樣的。


看樣子是可以達到不錯的效果的。萍萍看到這裡，好像怨念終於沒那麼大了……呼，鬆一口氣，腦內浮現了這個畫面：


挑戰成功！

貼幾張製作進行到現在的畫面表現，雖然還沒完全實現概念圖上的全部效果，但大體基調已經奠定得不錯了。







以上，基本就是Monster Farm的遊戲美術風格是如何建立起來的全過程。經歷了第一版概念--->prototype——>發現問題——>第二版概念的過程。雖然看似走了些彎路，但其實仔細想想也是遊戲製作中的必經之路。畢竟初版概念的時候只是把自己腦中對這個遊戲的想象具象化，而在技術上、遊戲題材上對美術有什麼要求和限制這個時候還不能完全搞清楚。隨著製作的推進，肯定會遇到各種各樣的問題，馬上就會發現第一次的概念不足的地方。

我們在確定修改美術概念的時候，主要考慮了以下幾個方面：

1.引擎、技術能否支援這個概念的表現

2.概念實現的時候是否會有明顯的瑕疵

3.畫面與我們想表達的世界觀、故事背景是否匹配

4.遊戲的風格是否有特點、突出，能成為遊戲顯著的標誌之一

遊戲美術這個工作和純粹的畫畫不一樣的地方在於，遊戲美術很多時候都都要“戴著鐐銬跳舞”，需要考慮到機能限制、題材限制，要用美術去支援玩法，要考慮人機互動，操作體驗。統統考慮這些之後，還要做出鮮明醒目的風格來給遊戲打上獨特的標識，不過我個人反而覺得這正是幹這個工作有趣的地方，彷彿也有一種遊戲般心態：毫無限制和規則的創作和繪畫，比不上這樣在有限制和規則的情況下，運用個人學識和智慧儘可能地達成目標更有趣，這不正是玩遊戲的精神嗎？

最後感謝TeamHiMoe全組成員，Erenyx-知乎的技術美術支援，延靜齋孫關於大方向上的思考和支援，艾薇李夜以繼日地頂著卡頓做模型……美術這件事從來也不是主美一個人的成就。

就這樣。


作者：Lea Liu
專欄地址：https://zhuanlan.zhihu.com/p/25195200