遊戲開發!視覺小說的美術前置

3,883

你好啊,我們是i-BOOM。

隨著時代的進步,個人遊戲製作變得比以前更容易了。
遊戲的有趣之處在於互動。對於有劇情的遊戲,每一個選擇都可能影響故事的發展,視覺小說就是一個非常好的例子。


以此,這次i-BOOM想以視覺小說形式講述的,是千年吸血鬼為自己撿拾靈魂碎片的流浪故事。

* 這份TIPS包含了三個主題:分享製作過程、使用檔案物件提升效率、照片的活用技巧;
記錄了i-BOOM製作一部視覺小說時的前置作業製作過程,以及當中用到的技巧。當中將會包含三條影片,有更詳細的解說可供比對參考。

【WIP】故事、文案與規劃

如果想製作出一部視覺小說可以用甚麼軟體呢?下面是i-BOOM的選擇:

第一個是Notion,用於 資料搜集、項目規劃、故事設計;
第二個是Clip Studio Paint,用於 概念藝術、角色立繪、CG背景;
第三個是Unity,把組成遊戲的元素組裝起來。

Notion對於資料搜集、項目規劃、故事設計,甚至協同作業非常好用。

它就像一本書的目錄,當中每一個按鈕按下去之後,都會連結到它們的獨立頁面。
它可以支援上傳各式圖片、文件、影片、音效等檔案。加上內建不同的資料整理用模組,可以將相關的詳細資訊統一在同個頁面內整理,使這次的前置工作變得非常有趣。

同時,配合Clip Studio Paint繪製草圖及手寫草稿也讓人非常快樂。

根據想要的遊戲畫面大小,或是隨意地打開一張畫布,依繪圖習慣隨意而行。但是如果習慣比較習慣精細的草圖的話,dpi設定在200dpi以上比較好。
將圖輸出之後,就可以以用加入圖片的形式上傳到Notion,讓共同製作的隊員討論。

現在暫時的規劃頁面是這樣的:

【WIP、檔案物件】繪製角色立繪

「立繪」就是一個站著的或是坐著的角色圖。
依據需求,除了一般常見的全身圖之外,也會有半身或是胸口以上的立繪。

無論想要的是哪一種立繪,在同樣規格的檔案中完成一整套的角色立繪十分重要。

如果遊戲畫面是1080x1920px,立繪的高度至少要有1080px,解析度300dpi或以上。闊度則依照需求設定,一般會是高度的一半左右。而如果立繪會用於印刷的話,畫布大小取所需大小的三倍比較好。
立繪需要以透明底色輸出,所以輸出時要選擇PNG,而如果包含動畫的話就輸出成APNG吧!
APNG同樣以低失真及透明底色輸出,但它支援動畫,輸出時不會像GIF有很大失真。

在此,i-BOOM完成了主要角色的立繪。

一般立繪會有一組動作[s]但是因為好玩所以他有四組動作[/s],同時因為好奇心而為立繪加入了動畫元素,所以他會眨眼說話時嘴巴會動。CSP可以支援動畫插圖,令動態表情製作變得更加方便。十分好玩值得一試。

立繪會配備不同的表情,要分開「身體圖層」和「表情圖層」處理,讓表情部件放在適當的資料夾中,例如「眉毛」、「眼」、「嘴」⋯⋯
有時候,角色不只有一組動作,頭的位置也不太一樣。但在不同的動作之中,臉的方向是類似的,就可以用檔案物件來節省把表情再畫一次的時間,而當需要修改時也只需要修改一次。

將想要重複使用的部件——它們可以是單一/複數圖層,也可以是資料夾(這裡以A簡稱)——進行複製,然後在圖層>檔案物件 中選擇「作為檔案物件貼上」(這裡以B簡稱)。
之後當A圖層或是資料夾更新後,B物件也會更新。

檔案物件也可以像素材物件般密鋪,當需要製作衣飾的花紋之類的時候可以多加利用。
但是要注意檔案物件的邊沿範圍是原檔案/圖層的畫布大小,即超出畫布範圍時,畫像是不會在檔案物件中出現的;又或者當原檔案的畫布比所需要的大,檔案物件的邊沿大小就很可能會超出預期。

當故事不只有一個角色時,就需要製作多於一個立繪了。hikaku-sitatter.com 這個網站可以提供身高比例的參照。如果電腦跑得比較慢,無法使用CSP內置的3D模型的話可以試試這個方法,用完之後記得關掉參照圖層。

製作第二個立繪時,需要考慮的是兩個角色之間的差異:
例如兩名角色都是成年男性,但是依照他的性格、行為習慣等影響,他會怎樣站呢?他的職業是什麼,又是否擅長偽裝呢?
一邊考慮這些,甚至考慮得更長盡仔細的要點,一邊將角色的草圖速寫下來並加以修正,以能最好表達角色以及故事氛圍的上色方式,試著為角色上色,持續修正直至眼前的角色與腦海中的形象貼合。但記得凡事不要過度。

快樂地讓角色動起來吧!

【檔案物件、照片運用】根據背景為立繪加工(一)

完成角色立繪之後,為立繪依照場景狀態進行加工。

開新畫布並讀取想要用作背景圖片的圖片。
這次使用的是在香港拍攝的夕陽照片。

在不同的情景光線之下會呈現不同的環境色,加工可以令角色更融入他所身處的時間與環境。

檔案>讀取>建立檔案物件
將角色的立繪以檔案物件的形式被放到圖片上。

這樣就可以直接在立繪檔案(原檔案)中作出修改。原檔案更新後,在照片檔案(應用檔案)中的原物件(原檔案)亦會更新,就可以即時看到效果了。每次在原檔案作出變更之後記得要進行保存。

夕陽接近晚霞時份,日照量與光線的散射使物體看起來藍藍橘橘的。使用照片上的藍色作為陰影色看起來效果會很好。

但是如果直接在照片上吸色,當回到立繪檔案時,選取色就會變回去。

這個問題有三個解決方法:
使用色板記錄顏色、記下顏色碼、從照片吸色

這裡會講的是「從照片吸色」和「運用照片」的加工方法。

先將照片複製然後點陣圖層化,用圈選工具選取想要的顏色範圍,複製到立繪檔案中
這時候就可以用吸管選擇想要的顏色了。
在立繪資料夾上開新圖層,設定成「用下一圖層剪裁」並倒入顏色,在混合模式中找到適合的選項。這次用的是「柔光」。

側背光會使人物出現邊光,為圖層加上蒙版,記得選取蒙版再畫,不然會擦掉照片。
以 透明 根據立體用筆刷描繪邊光,想塗回去的時候就換回選取色。改用噴槍刷出光暈。

【檔案物件、照片運用】根據背景為立繪加工(二)

加上夕陽的顏色應該會更好,但是依照記憶來選取光線的顏色,效果不一定會好。
是出動照片的好時機了。

從照片中選取合適的部份,貼到立繪檔案中。這次會直接使用照片加工而非吸色。

使用變型工具將照片放大到可以將立繪覆蓋,降低透明度以調整位置。
照片圖層設定成「用下一圖層剪裁」,更改混合模式。

加工圖層的照片紋理有點太清晰了,加上模糊濾鏡使紋理變得柔和。

再次改變大小和位置調整到覺得「對了!」的位置。

【照片運用、檔案物件】將照片變成CG背景

這次想製作的是線條感的、簡單的,令人感覺是從現在回到回憶之中的背景。
線條感、退色感、現在與過去並存是相對主要想要得到的感覺。

有時候不一定會一次就能知道自己可以用什麼濾鏡組合出什麼樣的感覺。也許像畫腦圖般,單純地將一個個想法以一個個新色調補償圖層表現出單一氛圍,在不影響到原照片的情況下加工、組合,有時候會發現新景象。

為了使風格統一,首先以漸層對應為照片鋪上棕調營造老舊的感覺,再在蒙版上以軟邊橡皮擦將夕陽擦出來把照片帶回現實。
這個圖層將會被用於穩定風格顏色。

現在的黑白照片總會傳遞出「古老」的感覺。留意著黑白比例與得出的形狀,注意照片與人物的關係,將照片二值化。

將以上的新色調補償圖層以不同的混合模式疊放,試著重新組合它們的次序,直至得到理想的成果。之後,經過之前的測試,大概知道什麼樣的圖層可以做出想要的效果,就可以更輕鬆地製作出自己想要的效果了。

經過一輪測試之後,終於完成了想要的背景。想把風格直接套用在其他照片上的話,如果照片是用檔案物件來建立,只需要更新照片(原檔案)就可以了。

建立新資料夾,將原照片放進資料夾。勾選資料夾並按下「複製」,「以檔案物件貼上」,就會得到一張檔案物件照片。

用這張檔案物件照片,取代所有之前普通地複製貼上使用的照片。只需要勾選己製作出來的檔案物件照片複製貼上就可以,不需要每一次都「以檔案物件貼上」。

取代完成之後,回到用來放照片的資料夾,讀取並置入新的照片,調整新照片的大小與位置之後更新所有檔案物件⋯⋯

新照片就依照第一張照片的加工方法加工完成了!

【WIP】I-BOOM的創作開發手記

在創作的過程中,將自己的創作過程、想法、技巧記錄下來,有時候會變得非常重要。
特別是在平台期、低潮期時,回首看到自己過往的努力與初心,力量就好像一點一點地回來,可以繼續向前邁進了。

與身邊的人們分享自己的創作,也是讓人感到非常快樂的事。而在SNS上看別人的創作時,很多時候都會有所收穫。

說到分享製作過程,首先會想到的是什麼樣的方式呢?方法不外乎以下幾種:

(一)拍攝照片、螢幕截圖
(二)螢幕錄製、縮時攝影
(三)直播

以「分享目的」的角度來看這幾種分享方法,也許會有另一種看法。

① 在過程中,單純與他人分享自己的製作、保持互動率:
以這個目的分享,最重要是速度,即使作品未被完成也可以大量進行分享,所以「拍攝照片、螢幕截圖」會是最便捷的方法。
拍攝照片、螢幕截圖是最傳統也是最簡單的分享方式。一張張的截圖也可以組合成單幀動畫的GIF或是APNG,讓變化更為豐富。

② 在完成作品之後,單純與他人分享自己的製作:
以這個目的分享,速度也許會是其中一個重點,但對於慢工出細貨的人而言,更大的重點是「整個製作過程」。所以「螢幕錄製、縮時攝影」會是相對有利的選擇。
螢幕錄製、縮時攝影看起來好像是相似的東西,但是以兩種形式錄製得出的結果非常不一樣:
「縮時攝影」得出的結果非常利落,因為它不會包括工作區域,以及可能因休息時間而出現的停頓;

「螢幕錄製」得出的結果包含工作區域,可以看到軟件使用者使用軟件的方法,卻需要額外的軟件工具,及因為實時錄製而檔案非常大。
當中各有利弊。例如在製作這次的TIPS時,使用螢幕錄製影片的時候會更多;卻同時可以用縮時攝影將想要快速顯示結果的位置補足。同時,如果SNS上有上傳影片的長度限制,縮時攝影就會有所優勢。

③分享完整的製作過程為目的,具備教學或是大比例的互動:
以這個目的分享,「說明」會顯得更重要。通常以這個目的製作的影片都會是經過剪輯並配以大量照片及螢幕截圖的螢幕錄製影片,又或是以直播形式進行,所以以此為目的的分享會分成兩類:影片製作、即時直播。
影片製作講求的是事前準備,有字幕的關係對於怕說話的人來說會比舒服,互動形式通常是「留言>留言」或者「留言>下一條影片」;
即時直播與朋友粉絲之間的互動比較大,講求即時反應,大多都會配合語音輸入所以喜歡說話的人可以暢所欲言!

在記錄創作開發過程上,i-BOOM選擇了自己架設的網站作為基地,輔以其他平台進行二次推廣,也為自己打開了贊助投幣口。

有試過在SNS上四處跑時,看到非常讚的作品——無論是交字、繪畫、音樂或是其他形式的創作——卻苦於無法找到該作品作者的贊助投幣孔嗎?這件事令人感到非常痛苦,所以為了免卻他人的痛苦,還是幫自己開個投幣孔吧!

如果是比較隨意的創作者,可以選擇小額贊助到訂閱支持如歐美地區的Ko-Fi、香港的Likecoin,等;
如果有信心可以定期產出作品的創作者,可以選擇訂閱支持如歐美地區的Patreon、日本的FanBox,等;
如果是有一個專案想發展的創作者,可以選擇集資如美國的Kickstarter、台灣的嘖嘖⋯⋯

無論是哪一種分享目的與方法,最重要的還是自己的心與快樂。
雖然分享時會想很快就得到讀者的關注,但是別忘了「與他人分享」只佔了創作過程的一小部份,不要被得到關注或是金錢而來的抗奮沖昏頭腦而忘卻了自己開始創作的初心。

找一個自己喜歡的、對於自己的創作種類上傳友好的平台,分享自己的作品吧!

即使是比較大的製作,例如遊戲製作,在一個固定的平台上持續地發佈自己的作品與創作經歷,互動間會得到的許不只有新的好點子與交流的夥伴,還有贊助他人與被讚助的可能性。

留言

最新

最新官方