介紹

你好！我的名字是 Hira Karmachela，這是我的第一篇文章。在這個場合，我將分享我使用 Clip Studio Paint 製作循環精靈動畫的經驗。我曾經為遊戲需求從事平面設計項目。通常，我從事的遊戲是 8 位風格或通常稱為像素遊戲。

 

我希望這篇文章對那些正在尋找使用 CSP 製作像素藝術的人來說是有趣的提示。更重要的是，我們將嘗試為循環精靈設置動畫。

什麼是循環精靈動畫？

在我們開始實踐之前，我將分享一點關於精靈動畫定義的見解。在平面設計或多媒體行業中，精靈一詞是指圖像形式的大場景的一小部分，包括靜態和動畫。對於動畫的需要，更具體地稱為精靈動畫。

 

實際上，在工業中，精靈動畫通常用於交互媒體需求，例如游戲或應用程序。 Sprite 動畫通常應用於遊戲角色，以便他們可以通過各種手勢移動或作為支持場景或用戶界面的視覺效果（例如：圖標和按鈕）。

 

從技術上講，精靈動畫是利用pose topose和直線前進的原則逐幀製作的。因此，它們的用途通常是循環，最終幀將連接到初始幀以進行無休止的運動。

 

通常在遊戲項目中，我使用精靈動畫來製作角色的各種動作。例如：空轉、行走、奔跑、攻擊、防禦、受傷、死亡。每個動作都是一個序列，將以一種稱為 sprite sheet 的格式打包。

為像素藝術準備文件

好的！我們從創建一個新文件開始。我們選擇“動畫”預設，以便根據我們的需要組織工作區以製作循環精靈。像素藝術不需要大的畫布尺寸，特別是對於精靈的需要，畫布只會填充單個對像或字符。所以，通常我只使用 32 像素的倍數作為尺寸。

 

在這個項目中，我製作了一個尺寸為 W = 192 px 和 H = 192 px 的畫布。即使有額外的頭部空間，這個尺寸也足以做出角色手勢。

 

您可以按照我所做的設置如下。

 

畫布製作完成後，接下來需要準備的重要的東西就是“網格”，它是一條假想的線，可以真正幫助我們排列像素，使它們形成圖像。

 

步驟是進入 View > Grid 的菜單。只有通過檢查，您才會在畫布上看到橫向和縱向的國際象棋圖案。

 

 

之後返回視圖 > 網格設置菜單。將出現網格設置窗口。在這裡更改 Gap = 1 px 和 Number of Divisions = 0。然後你會看到一個帶有更小、更緊密正方形的國際象棋圖案。

 

 

繪製像素

現在我們準備繪製或排列像素來製作精靈。在這個項目中，我將創建一個具有攻擊動作的妖精角色。在製作動畫之前，當然要先製作角色。

 

製作動畫角色最重要的是在分層系統中組織圖像。這是為了方便動畫過程，所以我們只需要重繪某些圖層來製作某些姿勢。請記住，精靈動畫非常依賴於姿勢到姿勢的原則。

 

這是我為每個姿勢製作的圖層。

 

我會讓這很容易。一開始我們只需要創建一個名為“pose_01”的圖層文件夾。稍後我們可以復制此文件夾以用於下一個姿勢。接下來，為第一個身體部位創建一個圖層。我們最好先從頭開始。

就像一般的繪畫技巧一樣，我們可以從製作線條藝術開始。幸運的是，CSP 有一個可以用來排列像素的工具。使用“Marker”類型的“Dot Pen”很容易每個筆劃都會用像素填充網格框。

然後通過排列像素形成你想要的角色頭部。在這個項目中，我製作了一個 3/4 視圖的地精角色。

 

通常我在線條藝術和著色之間製作不同的層次。但是，根據我製作像素藝術的經驗，將所有過程組合在一層上會更有效。根據角色的身體部位簡單地分離圖層取決於動畫需要。

 

因此，對於著色，只需根據圖層的需要從陰影到色調排列色調。

 

動畫圖層系統

接下來，創建具有單獨圖層的其他身體部位。我將這個妖精角色的身體從上到下依次分為以下幾部分：頭、左手、身體、武器、右手、左腿和右腿。

 

圖層系統旨在促進動畫過程。請記住，我們目前只有一個圖層文件夾來表示一個姿勢。接下來，我們將需要其他姿勢來做出一系列動作。通過圖層系統，我們不需要為不同的姿勢重新繪製角色，我們只需要重新繪製需要的圖層，並在不改變姿勢的情況下簡單地複制其他圖層。

 

 

準備時間表

如果身體各部分都齊全，試著檢查每個部分，這樣才能正確地串在一起，形成一個比例的身體整體。接下來，我們通過使用“pose_01”以及創建的圖層系統來製作其他姿勢。

 

在此之前，我們提前為動畫過程準備時間軸。步驟是進入菜單 Window > Timeline。然後時間軸面板將出現在底部屏幕上。

 

接下來，通過轉到菜單“圖層”>“複製圖層”來複製圖層文件夾“pose_01”。

 

然後通過轉到菜單“圖層”>“轉換圖層”將圖層文件夾的副本轉換為圖層（普通）。將出現一個對話框來更改圖層的名稱。更改為“animating_pose_01”。現在我們有 1 個要設置動畫的單元格。

將“animating_pose_01”圖層移動到 Animation 文件夾（在創建具有動畫預設的新文件時自動創建的圖層文件夾 - 此文件夾中指定的每個圖層都將被視為一個動畫 cel）。

 

在 Animation 文件夾中，我們會發現一個已經存在的空層。選擇圖層，然後將其刪除。

 

現在我們必須將“animating_pose_01”層指定為動畫 cel。簡單來說，我們可以使用 Timeline 面板中的支持圖標。在時間軸中選擇第 1 幀，然後單擊“指定 cels”圖標，如下所示。將出現一個對話框進行確認，選擇“animation_pose_01”然後單擊確定。

擺姿勢

現在，我們的動畫中有初始關鍵幀。接下來我們必須製作第二個姿勢，依此類推。步驟是再次復製圖層文件夾“pose_01”，然後雙擊圖層名稱將其重命名為“pose_02”。

選擇圖層文件夾“pose_01”，然後將不透明度更改為 50% 以使其透明。因此，我們可以在圖層文件夾“pose_02”中更改姿勢。

 

簡單地說，我所做的就是根據預期的運動在某些層上移動幾個像素，從而創建一個與之前的姿勢可持續的新姿勢。同時，我沒有像“頭”層那樣改變其他層的像素結構，只是改變了它的位置以跟隨新的姿勢。

 

如果第二個姿勢完成，下一步是將圖層文件夾“pose_02”轉換為圖層（普通：animating_pose_02）。然後保存到 Animation 文件夾並指定為動畫 cel。對於 cel 規範過程，我將 animating_pose_02 保存在第 4 幀中。也就是說，我為第一個關鍵幀 (animating_pose_01) 提供大約 0.1 秒的持續時間或等於三幀。

 

執行上述步驟以製作姿勢，直到最後一個姿勢。在這個項目中，我為地精角色製作了 7 個姿勢來進行攻擊動作。需要注意的是最後一個姿勢，即pose_07必須繼續到初始姿勢，即pose_01。所以它會做一個無休止的運動或循環動畫。

 

動畫

實際上這個過程將非常簡單，因為我們已經有了代表我們需要成為一系列動作的關鍵幀的姿勢。在確保動畫在時間軸中運行良好之前。將所有圖層文件夾設置為隱藏狀態。

 

然後，確保所有單元格都在時間軸中各自的幀中。 CSP 時間線中一個有趣的功能是“洋蔥皮”。此功能允許我們查看我們正在查看的姿勢之前和之後的姿勢。

 

您可以通過按時間軸中的播放圖標來測試動畫。如果動畫沒有停止並且時間軸指針繼續運行，即使我們只填充單元格直到第 23 幀，也不要擔心。發生這種情況是因為在文件創建開始時，我們沒有正確設置播放時間。這可以很容易地向右滾動並在右側找到藍色的時間軸指針，然後將其拖動並保存在我們需要的幀上。

 

出版

在確信我們動畫上的動作之後感覺很好。然後是發布它的時候了。通常我會根據客戶的需要將精靈動畫打包成精靈表。 Sprite 表是在透明背景 PNG 中創建的，以使遊戲開發人員更容易編寫。然後精靈將通過編碼進行動畫處理。

 

但是，作為客戶提交或批准過程，我通常將精靈動畫導出為循環動畫 GIF。步驟是轉到菜單文件 > 導出動畫 > 動畫 GIF。然後會出現幾個框，我們只需要根據需要進行確認。

 

好的！我只能分享這些。希望它是有用的，請支持我通過以下方式提出更多提示：

 

關注我的 Instagram：

 

訂閱我的 YouTube 頻道：

閱讀我的其他帖子：

謝謝 ：）