大家好！在本教學中，我將解釋如何使用 Clip Studio Paint Ex 的一些特殊功能來幫助我們輕鬆創建等距藝術，重點在於遊戲場景設計和遊戲藝術，但這些技術也可以應用於設計或插畫。

●我不是這方面的專家，所以一直在實驗，我想與您分享我取得成果的方法和技巧。希望對您有所幫助。

 

■注意：我使用 Clip Studio Paint Ex。某些功能可能在其他版本中不可用。

 

這裡有一些我使用我們將要學習的技巧繪製的範例▼

 

1. 介紹 | 等距透視圖或投影

■ 讓我們觀察不同類型透視圖之間的差異：

 

• 兩點透視：如果我們觀察透視圖中的物體，我們會發現它們隨著向消失點遠離而變得越來越小。這是人眼感知的方式。

 

• 等距透視：與傳統透視不同，等距透視是一種軸測投影。我們始終看到 3 個側面，並且它們的測量比例相同。無論「相機」的位置如何，物體看起來都不會變小或變大。側面與垂直軸形成 30° 角。

這種投影的優點是即使是初學者也能輕鬆地在透視圖中進行構建，但需要注意的是，可能會出現難以感知物體深度和高度的問題。

 

• 2:1 透視：另一種在電玩遊戲和設計中廣泛使用的軸測投影。在這種情況下，兩個側面具有相同的約 26.6° 角。

如果將其與等距透視相比，物體從上方看起來不那麼明顯，因此對於眼睛來說，它們的感知方式更自然一些。

 

2:1 透視因其在電玩遊戲像素藝術中的使用而流行，與等距視圖相比，該角度可以產生清晰的直線。▼

 

■ 注意：最合適的投影取決於我們所追求的風格，對於策略遊戲和建築設計，等距透視非常有用；對於設計和像素藝術，我們可以使用 2:1。

我個人更喜歡 2:1 透視提供的視圖，但最好是根據每個項目的需求和個人喜好進行實驗以正確選擇，我們甚至可以探索其他角度以獲得不同的透視圖。

2. 第一種方法：變形

• 我們將使用 Clip Studio 中的變形工具來創建等距投影：

 

■ [1] 在此範例中，我使用一個正方形。首先，我們前往 [編輯] > [變形] > [縮放/旋轉] 或使用鍵盤快捷鍵 CTRL + T。

■[2] 使用控制手柄或在 [工具屬性] 面板中將圖層旋轉 45°，然後按「確定」或 Enter 鍵確認變形

■[3] 我們再次應用變形。

•[3.1] 我們確保停用 [保持長寬比]

•[3.2] 我們更改高度以實現透視。對於等距投影，通常使用 60，但我個人認為 58 效果更好，可以達到 30° 角。

按下「確定」或 Enter 鍵確認變形後，我們就有了一個可以作為基礎的圖塊。

▼ 如何從這個形狀創建體積？

 

■[4] 我們可以非常簡單地利用這個基礎來創建體積。首先，我們將使用移動工具（快捷鍵 V）並按住 ALT 複製圖層，再按住 SHIFT 垂直移動。將其稍微向上放置以定義物體的高度。

■注意：我們也可以使用快捷鍵 CTRL + J 或 [圖層] > [複製圖層] 下拉選單來複製圖層，這些方法我經常使用，所以我建議您使用鍵盤快捷鍵以提高效率 :D

 

■ [5] 使用我們最喜歡的線條工具，連接垂直軸上的點以創建體積。

•[5.1] 在形狀工具中，我使用 15° 的角度步進，這讓我可以同時創建垂直線和 30° 的側面。

■注意：在此範例中，我還連接了側面並將頂層設置為參考，以幫助我填充，此步驟是可選的。

■ [6] 我在底層使用油漆桶填充側面，然後使用快捷鍵 CTRL + E 合併圖層。

• 透過這些簡單的步驟，我們的物件基礎就準備好了。現在我們可以利用它來創建我們想像中的物件。

 

▼ 利用基礎創建不同材質

 

■ [7] 遵循基礎的幾何形狀，我們可以在等距透視中創建不同的材質。

如果需要，我們可以在同一圖層上工作，或創建新圖層。

 

這個過程取決於個人，我會勾勒一些細節，例如材質的紋理和裂縫。我會嘗試打破邊緣，讓物體看起來更自然。▼

最後，我們只需使用我們最喜歡的畫筆繪製材質。

考慮到光線的方向，並嘗試從透視基礎上產生有趣的形狀。

 

細節的程度取決於每個人的需求和風格。想像和實驗不同的材質非常有趣。

 

■我們從一個圖塊開始，給它體積，然後在等距透視中定義有機材質。

 

•希望這個簡單的範例能讓您了解這種方法的表現可能性。

2.1 | 自動動作

■ 為了讓這些重複的動作不那麼繁瑣，我準備了一組自動動作。

 

您可以從 Clip Studio Assets 下載它們，以及我為本教學準備的其他工具。▼

 

■ [1] 如果我們沒有看到自動動作面板，可以從 [視窗] > [自動動作] 選單中啟用它。

 

• [1.1] 然後從素材面板拖曳動作來載入它們。

■ [2] 這些動作分為兩部分。

• [2.1] 等距 30°（底座、正面、側面）

• [2.2] 二等距 2:1（我使用寬度 141 和高度 71 的比例）

■ [3] 我們可以使用等距 30° 的 3 個動作輕鬆地建造一個立方體。遺憾的是，我無法為 2:1 透視定義側面。▼

 

• 等距 2:1 動作可幫助我們創建 2:1 透視的基礎 ▼

■注意：由於變形選項中缺少小數點和傾斜度，形狀並不完美。無論如何，它們可以節省時間，之後我們可以對基礎進行細化。

■ [4] 提示：我們可以為自動動作分配鍵盤快捷鍵，這樣可以提高效率並優化工作流程。

 

前往 [檔案] [快捷鍵設定 (H)] 或使用快捷鍵 CTRL+ALT+SHIFT+K

•[4.1] 從下拉選單中選擇自動動作。

•[4.2] 選擇等距動作集，選擇要分配快捷鍵的動作，然後按下編輯快捷鍵。

•[4.3] 添加快捷鍵並確認。

 

 

•現在我們可以透過按下鍵盤快捷鍵來執行這些動作。非常有用且有效。:D

3. 第二種方法：特殊尺規

另一種幫助我們創建透視圖的方法是使用 CSP 的特殊尺規。

我將向您展示兩種不同的技術。

■ [1] 對於第一種技術，我們將使用 [平行線] 特殊尺規。

 

•[1.1] 將角度步進設定為 30，以定義 30° 等距透視圖，並啟用「在編輯圖層上建立」。

 

•[1.2] 按住 SHIFT 鍵，向右創建一個 30 度角的尺規。

•[1.3] 然後我們向左創建另一個來定義另一側。

 

•[1.4] 最後，我們創建一個垂直尺規。

•[1.5] 在圖層面板中，我們將尺規設定為在所有圖層中可見。

■ [2] 現在我們定義了尺規，我們可以繪製正確的角度。

 

•[2.1] 活動尺規是紫色的。我們可以使用命令欄上的按鈕或鍵盤快捷鍵 CTRL+4 在每個尺規之間切換。

 

•[2.2] 我們可以使用命令欄上的按鈕或鍵盤快捷鍵 CTRL+2 來啟用和停用尺規的使用。例如，停用尺規以添加有機細節。

■ [3] 提示：我們可以利用向量圖層來構建我們的物件。

•[3.1] 我們繪製線條，無需擔心它們會交叉。

•[3.2] 我們使用向量橡皮擦來消除多餘的線條。

■注意：此方法可能是創建 30° 等距圖最精確的方法，但我個人認為它不夠直觀和高效。

 

為了解決這個問題，我準備了一些透視尺規和網格，您可以在我分享到 Assets 的工具中找到它們▼

■ [4] 要使用尺規和網格，只需從素材面板拖曳到畫布上即可。

 

•[4.1] 使用物件 | 操作工具，將網格調整到我們喜歡的大小。

•[4.2] 利用透視尺規，我們以更直觀的方式繪製。

•[4.3] 就像之前一樣，我們可以使用快捷鍵 CTRL+2 來啟用/停用尺規的使用，這樣我們就可以在需要時不受角度限制地繪製。

•[4.4] 使用 2:1 尺規，我們可以像 30° 等距透視一樣創建該透視圖。

•希望這些尺規對您有所幫助。我們將它們與自動動作結合起來，以完成我們的設計。但首先，我們將討論電玩遊戲的地圖創建。▼

4. 圖塊集 | 圖塊地圖

在電玩遊戲中創建場景的一種非常通用且流行的技術是使用圖塊集（Tilesets）和圖塊地圖（Tilemaps）。

 

■ 什麼是圖塊集？

 

• 圖塊集是一組我們可以用来在網格中創建地圖的磚塊或「圖塊」，它們是創建地圖的有效方式，通常用於 Godot 或 Unity 等不同的遊戲引擎中。

 

• 它們通常以方形格式創建，並且通常彼此形成圖案，建立模組化系統。

▼我將向您展示如何配置我們的檔案以使用圖塊集，以及一些創建等距場景的有趣技術。

■ 準備檔案：

 

•[1] 我們前往 [檔案] > [新建] 來創建我們的基本畫布，命名為「Tileset」。

 

•[1.1] 大小可能會有所不同，但通常以方形格式工作更簡單。在我的情況下是 512x512px。

大小可能會有所不同，但通常以方形格式工作更簡單。在我的情況下是 512x512px。

 

•[1.2] 重要：我們將啟用「創建動態插圖」並定義幀數。這一步對於我開發的系統很重要。

 

每個幀將代表一個圖塊或磚塊。12 是一個很好的開始數字，我們可以在需要時添加更多。▼

■ [2] 我們的檔案已經準備好一個包含 12 個單元格的動畫資料夾。

•[2.1] 要查看影格，請前往 [視窗] > [時間軸 (X)]。

•[2.2] 正如我們在之前的選單中設定的，我們節省了時間，並且每個影格都已分配了一個單元格 :D

 

■ [3] 為了能夠為每個圖塊或磚塊使用多個圖層，我們將點擊右鍵並選擇 [建立資料夾並插入圖層 (F)] 或使用快捷鍵 CTRL+G。

•[3.1] 我們為每個單元格定義一個資料夾。

■ [4] 從 [檢視] > [尺規/格線設定 (N)...] 選單中定義一個引導網格。

•[4.1] 尺規/格線原點：中心

•[4.2] 間隔與畫布大小相同，此處為 512px。4 個分割。

■ [5] 最後，我們將檔案儲存在一個容易存取的地方。

現在我們要繪製我們的圖塊。為了確保圖案正確重複，我們可以創建一個參考檔案。

■ [6] 首先，我們在第一個影格中繪製，以幫助我們設定檔案。

• [6.1] 我們創建一個新檔案，為了定義大小，我們將創建一個 9 個圖塊的網格，因此將基本檔案的大小乘以 3。在此情況下為 512 x 3 = 1536。

•[6.2] 從 [檔案] > [匯入] > [建立檔案物件] 選單匯入圖塊集檔案作為檔案物件。

•[6.3] 使用操作| 物件工具，從工具屬性子選單中設定圖案。

 

•[6.4] 我們配置視窗以便將其用作參考。對原始圖塊集檔案所做的任何更改，在儲存時都會反映在此圖層中。

■ [7] 為了示範，我創建了第一個圖塊的變體。我複製圖層並將其放置在對應於第二個影格或單元格的「2」資料夾中。

 

•[7.1] 我使用快捷鍵 CTRL+U 進行色相/飽和度/亮度校正，並更改色相以創建顏色變體。這是一種在電玩遊戲中廣泛使用的技術，以利用藝術作品並節省時間。

•[7.2] 現在是我準備的這個系統中最喜歡的部分：在工具屬性子選單中，我們可以選擇檔案物件中顯示的特定影格。

 

這樣一來，如果我們從 0 更改為 1，我們就從圖塊 1 變成了圖塊 2！

 

▼我們將使用此方法，利用在單一檔案中創建的圖塊來創建我們的地圖。我個人認為這是利用 Clip Studio Paint 這個功能非常有趣且有創意的方式 :D

4.1 提示 | 圖案或紋理

■我不是創建重複圖案或紋理的專家，但我想與您分享幾個我在繪製時覺得有用的方法。

■注意：2020 年 3 月，本月提示的主題之一是圖案和紋理。如果您願意，可以查看社區中其他作者創建的精彩教學。在這裡，我與您分享我最喜歡的幾個。▼

■[1] 我們將創建一個「熔岩」圖塊。第一步是繪製我們想要的紋理，暫時不擔心將其製作成圖案。▼

•使用您最喜歡的畫筆。

■注意：一個選項是先繪製紋理草圖，將其轉換為圖案，然後再進行細化，但在這種情況下，我決定直接以顏色繪製圖塊以節省時間。

■[2] 我們啟用之前準備好的 4 分割網格。

•[2.1] 我們確保啟用 [吸附到格線] (快捷鍵 CTRL+3)，並使用矩形選取工具 (快捷鍵 M) 從一個角落選取到中心。

•[2.2] 在選取活動時，使用 CTRL+C 和 CTRL+V 複製並貼上到新圖層。

•[2.3] 我們對其他 3 個角落重複此操作，現在「圖塊」已分為 4 個部分。

■[3] 使用移動圖層工具 (快捷鍵 V) 將每個四分之一移動到對角。您可以按住 SHIFT 鍵以保持對角線。將圖像放置在角落後，使用鍵盤箭頭檢查是否放置在正確的像素位置。

 

•[3.1] 我們對其他 3 個部分重複此操作。

•[3.2] 使用 CTRL+E 將圖層合併為一個。

之前和之後▼ 現在我們必須修正中心的接縫以完成紋理。

■[4] 我們開始繪製以修正中心的接縫。如果需要，我們可以在同一圖層上工作或創建新圖層。

 

•[4.1] 在參考檔案中，我們使用操作/物件工具和工具屬性面板設定對應於圖塊的影格。

•[4.2] 使用參考來檢查紋理，我們繼續繪製和精煉，直到對結果滿意為止。▼

■注意：當您對紋理進行更改時，請記住儲存檔案 (快捷鍵 CTRL+S)，以更新參考畫布中的檔案物件。("Tileset Check")

■[5] 在 Clip Studio Assets 中，我們可以找到許多出色的圖案和紋理。要使用它們，只需從素材面板拖曳到畫布上即可。

 

•[5.1] 為確保其正確配置，我們使用物件工具，並在工具屬性面板中將位置調整設定為「畫布」。

這樣一來，圖案在我們畫布的邊緣就完美了。

 

■注意：理想情況下，我們使用素材作為基礎來幫助我們創建圖塊，然後用我們自己的風格繪製以生成一致的視覺系統。每個人都可以自由探索不同的技術以獲得良好的結果。

▼一些圖塊範例，每個都在其各自的影格中。

 

▼我在範例中使用的一些素材。

4.2 提示 | 使用圖塊集創建地圖

我將向您介紹一些技術，用於利用上一節中創建的圖塊集，並動態地創建地圖或場景。

■[1] 我們創建一個新的畫布，在本例中為 1920x1080px。

•[1.1] 我們將使用網格素材和 2:1 尺規來定義透視圖。

•[1.2] 從 [檔案] > [匯入] > [建立檔案物件] 選單匯入圖塊集作為檔案物件，並選擇「Tileset」檔案。

 

■[2] 我們使用「等距 2:1」自動動作來定義透視圖中的「圖塊」。

我們使用控制項來重新定位並賦予圖塊適當的比例▼

•[2.1] 在工具屬性面板中更改影格以選擇正確的圖塊。

•[2.2] 我們啟用「圖案」以將其轉換為重複圖案。這樣我們就定義了場景的地板。

•[2.3] 為了創建其他元素，我們複製檔案物件並通過更改影格來選擇另一個圖塊。

•[2.4] 在圖案選項中，我們可以選擇如何重複。如果我們選擇水平或垂直，我們將只在兩個方向之一創建一排圖塊。在此情況下，我們使用水圖塊定義了一種河流。

•[2.5] 我們再次複製，這次改變了圖案的方向。

然後通過修改影格來定義圖塊。

■[3] 我們的地圖看起來還是平坦的，我們來給它一些深度。

我們可以輕鬆地利用尺規和手繪來創造維度。

首先，我們在方塊下方創建一個圖層。

 

•[3.1] 啟用尺規並使用我們最喜歡的畫筆，繪製磚塊的側面。

•[3.2] 提示：如果我們創建圖塊的變體，可以使用圖層蒙版來創建有趣的融合和紋理。

首先，我們複製並更改影格。

 

•[3.3] 按住 ALT 鍵，按下按鈕創建一個圖層蒙版，這樣我們就隱藏了整個圖層。

•[3.4] 使用柔和的畫筆繪製，以在兩種變體之間創建過渡。顏色顯示，透明隱藏。

•[3.5] 最後，我們將所有圖層分組到一個資料夾中。

•[3.6] 我們將創建一個陰影來定義我們創建的元素的高度。

在組下方創建一個新圖層。

然後按住 CTRL 鍵點擊資料夾以創建選取範圍。

用深藍色填充選取範圍，然後將圖層向下移動，以在磚塊和地面之間創建距離。

•[3.7] 我們用畫筆補齊缺失的部分。

將圖層設置為乘法模式並降低不透明度。

•[3.8] 為了完成效果，我們前往 [濾鏡] > [模糊] > [高斯模糊]，並調整數值以柔化陰影邊緣。

■[4] 現在我們來給河流增加一些深度。

在水圖塊上方創建一個新圖層。

借助透視尺規繪製一個邊緣。

▼在這個例子中，我繪製時沒有擔心重疊在水中的部分。然後，我按住 CTRL 鍵點擊圖層縮圖，將水圖層作為選取範圍載入，並刪除多餘的部分以獲得乾淨的邊緣。

 

•[4.1] 我們可以停用尺規並手動繪製更具機性的邊緣和細節。

•[4.2] 要在水中創建陰影，我們首先再次將圖層載入為選取範圍，然後前往 [選擇] > [縮小選取範圍] 選單，並將其值設定為 10px。

•[4.3] 從 [選取] > [羽化邊緣] 選單中柔化選取範圍，並賦予其 40px 的值。

然後在新圖層中填充任何顏色，因為這只是為了以後用作選取範圍。

•[4.4] 我們複製水圖層並將其設置為乘法混合模式。

•[4.5] 最後，我們載入之前創建的選取範圍並將其用作圖層蒙版。

使用柔和的畫筆手動繪製以精煉蒙版。

▼如果我們比較，透過微妙的陰影，我們獲得了更多的體積。這類細節很容易製作，並且能豐富作品。

■[5] 我們繼續創建元素。在這個例子中，我使用木材圖塊來創建一座橋。

首先，我像之前一樣複製檔案物件，並選擇與木材圖塊相對應的影格。

•[5.1] 按住 ALT 鍵創建一個圖層蒙版，隱藏整個圖層。

然後只繪製水周圍的區域以創建木橋。

手動繪製以精煉圖層蒙版，以獲得有趣的形狀。

•[5.2] 我們複製下方的圖層。接下來的步驟是點陣化並應用圖層蒙版。

然後向下稍微移動以創建橋的體積。

(CTRL+U) 色相/飽和度/亮度以使圖層變暗並能夠看到輪廓。

•[5.3] 沿著輪廓的形狀，我們手動繪製橋的邊緣以賦予其體積。我們嘗試定義照明。（不必完美）

•[5.4] 最後，我們在橋下方創建一個新圖層，設置為乘法模式，並在地板和水面上繪製一個陰影，以將物件融入場景。

▼橋就這樣完成了。

▼結合這些技術，我們可以創建各種物件並定義我們的場景或地圖。

■[6] 這個範例中的一些最後細節：

在一個強光模式的圖層中，我用柔和的噴槍繪製了一些光效，以改善氛圍。

•[6.1] 我再次複製「tileset」物件並選擇圖塊，但這次停用「圖案」，以便只保留一個磚塊。

•[6.2] 在磚塊下方的新圖層中，我借助尺規繪製其中一個側面以定義體積。

•[6.3] 我複製側面並使用快捷鍵 CTRL+T 進行自由變形。然後右鍵點擊並選擇 [水平翻轉]。

最後，我定位副本以獲得立方體的另一側面，並將圖層分組到一個資料夾中。

■提示：我們可以鎖定透明像素，並繪製照明/紋理，而無需擔心失去形狀。

•[6.4] 我創建群組的副本並更改其圖塊以獲得顏色變體。

•[6.5] CTRL+T 進行自由變形。我縮小物體並定義其位置。

•[6.6] 最後，為了將它們融入場景，我在物件下方創建了一個乘法模式的圖層，並手動繪製了一個投影陰影。

▼我決定更改綠色磚塊圖層蒙版中的紋理，以便在過渡中產生更有趣的紋理。

▼這是我的範例最終結果。希望您能了解這個系統的可能性。結合手繪技術和圖塊集，我們可以創造無限的場景，既有創意又高效。

(解釋這些步驟比繪製這個範例花費了更多的時間)

■注意：如果我們沒有點陣化檔案物件，我們仍然可以在圖塊集上進行更改，並且這些更改將反映在最終的等距構圖中。這使我們能夠對作品有很大的控制權，在我看來，這是一個非常強大的創意工具。

▼ 例如，將「水」圖塊更改為「熔岩」圖塊，其餘調整幾乎都是透過色相/飽和度/亮度 (CTRL+U) 進行的，5 分鐘內我就有了場景的環境變體。

5. 繪製等距 2:1 場景

結合所介紹的技術，我們將繪製一個更複雜的場景作為電玩遊戲概念。

■[1] 這個範例中的畫布是 4k (3840x2160px)。

 

•[1.1] 我再次選擇了 2:1 透視圖。

 

•[1.2] 這是我準備的圖塊集，用於提供一個可供使用的圖塊調色盤。如果您注意到，我有一些「岩石」圖塊的變體，以便產生多樣性。

•[1.3] 為了打破空白畫布，我繪製了一個基礎環境，沒有太多細節，因為我將覆蓋大部分區域。這一步是可選的，但在我看來，它有助於從一開始就整合場景。

•[1.4] 我使用尺規創建了場景草圖。這是一場與蜘蛛頭目的戰鬥。我試圖定義不同的平面和元素，讓我們的角色可以在遊戲中與之互動。

■[2] 我開始定義元素。首先，我將圖塊集作為檔案物件匯入。

[檔案] > [匯入] > [建立檔案物件]

•[2.1] 我選擇其中一個「岩石」磚塊，並選擇正確的影格。

•[2.2] 藉助自動動作，我將圖塊轉換為 2:1 投影，就像之前在範例中一樣。

•[2.3] 我以網格和草圖為參考，將圖塊縮小到適當的比例。

•[2.4] 在圖塊下方的新的圖層中，我以網格為參考來定義方塊的高度。在此情況下，方塊的高度為 1，寬度為 4。

然後我將這些圖層分組到一個資料夾中，命名為「岩石圖塊 1」，並給它一個顏色以方便整理

•[2.5] 我鎖定側面圖層中的透明像素，然後開始繪製細節，按住 Alt 鍵從圖塊中選取顏色。由於這是岩石紋理，我沿著輪廓繪製以賦予其更逼真的體積。透視圖不一定完美，只要能創造出材質的錯覺就足夠了。

•[2.6] 為了強調照明，我複製圖層，將其設置為乘法模式並降低不透明度，然後刪除不需要的部分。

•[2.7] 我將圖塊載入為選取範圍，並在新的圖層中以濾色模式繪製，以增加方塊頂部的亮度。

•[2.8] 我創建資料夾的副本，並移動它以查看方塊如何重疊。連接感覺有點生硬，因此我創建一個新圖層並在邊緣繪製體積，以改善方塊之間的過渡。即使我們稍微偏離網格也沒關係，因為這是有機紋理。

•[2.9] 了解方塊如何重疊很重要。為了達到正確的效果，在圖層面板中，位於畫布右側的方塊必須在圖層上方。同時，從下到上的「行」必須按順序排列。

■注意：當我創建「岩石」圖塊的變體時，我確保只修改中心部分，因此只需透過影格更改圖塊，我們就有 3 個「岩石」方塊可以使用。

 

我們將複製我們創建的方塊以輕鬆定義地形。

■[3] 我們繼續定義元素。

重複相同的步驟，我們創建了帶有其他「圖塊」的方塊。

在這個例子中，我修改了色調以創建方塊的變體。

•[3.1] 在資料夾中使用 CTRL+T，我們透過修改方塊的比例來輕鬆定義場景中其他元素的基礎。

•[3.2] 在尺規的幫助下，我將圖塊的紋理延伸到側面。

•[3.3] 我創建一個副本並將它們放置，用 2 個方塊形成一個台階。

•[3.4] 我將 2 個方塊分組到一個資料夾中，然後再創建 3 個副本。透過修改垂直位置，我為台階定義了不同的高度，無需太多努力就獲得了更有趣的結構。

•[3.5] 為了改善重疊方式，我們在乘法模式的新圖層中繪製陰影。為了避免超出邊緣，我們只需將方塊載入為選取範圍 (CTRL+SHIFT+點擊圖層縮圖) 並創建一個圖層蒙版。然後刪除我們不需要的部分。

•[3.6] 我們在其他方塊上重複這些步驟。在濾色模式的圖層中使用相同的蒙版，我們可以在最高台階上繪製一些光線。

最後，我們將所有台階合併到一個資料夾中。

•[3.7] 我們繼續創建「岩石」方塊的副本來定義地圖。如果調整位置可以獲得更好的視覺結構，則不需要完美地貼合網格。

•[3.8] 為了改善極端方塊的邊緣，我們創建了一個圖層蒙版，並沿著岩石的形狀刪除了部分結構。

•[3.9] 我定義第二行，然後將所有方塊分組到一個資料夾中，這樣我就可以輕鬆複製行並完成地面。

•[3.10] 我使用 3 個高塊，使蜘蛛的地板位於較高的平面上。

•[3.11] 我完成地面，並隨機調整圖塊，使其不那麼重複。

•[3.12] 只需垂直向上或向下移動一些方塊，我們就可以打破網格並為場景增加更多體積。

這類細節雖然微妙，但能為場景注入生命，而且製作起來不會花費太多時間。

它們還可以幫助我們講述故事或解釋遊戲概念的機制。也許有些方塊會在角色踩到時掉落或觸發陷阱。

■ 我們完成了這個場景的地板。我們可以重複利用這些元素，透過網格和方塊系統創建無限的場景。

■[4] 為了將樓梯與岩石方塊整合，我在群組中創建了一個圖層蒙版，並使用透明顏色繪製以擦除部分邊緣，使其看起來不那麼完美。

•[4.1] 沿著草圖並藉助網格，我們定位了之前創建的磚塊以創建浮動表面。

•[4.2] 在乘法模式的圖層中，我們繪製了一個陰影，其中第一個方塊與石地板接觸。這樣我們就將其整合到場景中。

•[4.3] 我們將圖塊的形狀載入為選取範圍，並用陰影的深色填充它。

利用網格，我們確保陰影位於正確的位置，以免破壞透視的錯覺。

我們修改圖層的不透明度以調整陰影的強度。

•[4.4] 我們複製圖層並將其放置在下一個方塊下方。

對於構成結構的 4 個方塊的陰影，我們將每個圖塊載入為選取範圍並在同一圖層中填充它。然後我們沿著網格將陰影放置在地板上。

•[4.5] 我們對每個陰影應用 [濾鏡] > [模糊] > [高斯模糊] 以柔化邊緣。最後，我們將所有圖層分組並應用圖層蒙版以精煉最終結果。

▼ 這種透視的主要問題之一是難以感知物體的高度。利用陰影，我們創造了深度的錯覺，無需非常寫實。

■[5] 我們繼續創建草圖中的元素。下一步是熔岩河。

步驟仍然非常相似。首先我複製圖塊集。

選擇熔岩圖塊並將其放置在岩石方塊後方的正確位置。

這次我啟用「圖案」以創建一條線。

使用圖層蒙版和透明顏色隱藏我不需要的部分。

•[5.1] 「高」方塊的側面因重複部分而顯得有些奇怪。我們將在新圖層中手動繪製，使其看起來更自然。

•[5.2] 我們將方塊分組，並遮罩部分底座以將其與熔岩整合。

•[5.3] 我們在強光模式下創建一個新圖層，並將其剪貼蒙版應用於方塊。然後繪製橙色光澤以強化熔岩效果。

•[5.4] 對於熔岩河上方的方塊，我們可以輕鬆創建一個特殊變體。首先，我們複製「圖塊」圖層並將其更改為熔岩圖塊。

然後按住 ALT 鍵創建一個圖層蒙版，隱藏所有內容。

繪製以揭示並在方塊表面創建熔岩細節。

•[5.5] 在新圖層中繪製陰影以定義裂縫的體積。

我們還使用「添加光澤」圖層添加了光效。

•[5.6] 我複製方塊並稍微修改了熔岩裂縫。為了整合它們，我再次遮罩部分底座，然後添加柔和的光澤。

最後，在新圖層中手動繪製熔岩表面的細節。

▼這是熔岩河的結果以及它如何與方塊整合。

■[6] 我們一步步詳細描繪場景。接下來我要準備的元素是圍繞河流的岩石。我以其中一個方塊為基礎，但使用 CTRL+T 增加了它的大小。

對於這種類型的元素，我沒有太多要解釋的，我們盡量保持透視，但不需要完美。我用各種畫筆手動繪製。

▼我再次使用光澤和蒙版來整合元素。

儘管有些元素看起來很複雜，但我們只需將其分成幾個部分，然後重複相同的步驟，耐心地達到所需的細節程度。

只要有可能，我都會嘗試重複利用元素以節省時間。

•[6.1] 有些元素在正面視圖中更容易處理。我們可以先草繪，然後應用透視圖，或者像我們對圖塊集所做的那樣，我們可以繪製一個彩色基礎。

在這個案例中，我使用對稱尺規來加速過程並設計地牢入口的拱門。

•[6.2] CTRL+T 進行變形，按住 CTRL 將中心操縱器向下移動，以網格為參考將拱門變形為透視圖。

一旦定義了角度，我複製圖層並移動它以賦予拱門體積。

在尺規的幫助下，我完成側面以定義基本形狀。

•[6.3] 利用基本結構，我繪製細節並定義不同的平面，同時考慮材質和照明。

首先使用尺規和網格定義基礎的過程有助於創建複雜物件。然後就是根據我們想要的風格和細節來打磨作品。

•[6.4] 最後，我創建一個強光模式的圖層並使用剪貼蒙版。在這個圖層中，我添加了紋理和照明調整。

在乘法模式的圖層中，我像之前看到的元素一樣創建陰影。

•[6.5] 沿著相同的手動過程，我繪製了岩石方塊，它將作為噴泉和一個作為「存檔點」或儲存點的水晶的基礎。

有些元素我沒有一步一步詳細解釋，因為我重複了相同的技術。無論如何，我希望大家都能理解。

•[6.6] 另一個選項是在正面視圖中創建參考線，然後使用我分享的自動動作將它們放置在透視圖中。在這個例子中，我將創建一個噴泉，因此我繪製了 2 個圓圈和一些分割線。

我將參考線放置在透視圖中（使用單獨的圖層以便進行選取），然後使用自由變形在石塊上定義正確的比例和位置。

•[6.7] 我複製圖層並垂直移動它以定義噴泉的高度。這些上層圖層用於創建選取範圍。

在下層圖層中，我借助選取範圍繪製體積。

•[6.8] 我繪製內部陰影，並沿著參考線將結構分成幾個部分。

為了獲得顏色，我在一個強光模式的圖層中填充了內部圓圈，將其垂直向下移動，並通過反轉選取範圍來消除重疊的部分。

•[6.9] 在一個新圖層中，我手動繪製單個岩石，重點放在邊緣和紋理上。

•[6.10] 我使用從 Assets 下載的畫筆繪製水紋理。然後使用自動動作將其設置為透視圖。利用內部邊緣的選取範圍，擦除多餘的部分。

•[6.11] 最後，我使用乘法模式的陰影並調整顏色。

結合我們之前看到的技術並藉助參考線，繪製等距圓形物件並不複雜。

■[7] 正如我一直在解釋的，對於有機物件，我更喜歡直接繪製，只需參考網格和透視圖。此外，有些部分不需要太多細節。

 

對於場景背景，我只是手動使用等距尺規繪製結構。然後我停用它們，並用不同的畫筆添加細節。

•[7.1] 我繪製了幾個蜘蛛怪獸蛋。我先繪製第一個，然後複製它，更改了比例並修改了一些細節。

儘管它們不完全符合透視圖，但地板上的陰影將它們融入了場景。

•[7.2] 為了完成這些有機細節，我繪製了一些蜘蛛網和光效，沒有太多細節。只要暗示出紋理就足以營造氣氛。我總是回來並進一步完善小細節。

■[8] 等距透視圖的優點之一是我們可以重複利用元素來構建其他元素。

在這個例子中，我疊加了 3 個不同大小的方塊，以定義一個柱子。

我複製群組並沿垂直軸向下移動它。

然後，我使用尺規連接邊緣，最後繪製紋理和照明。

•[8.1] 我再次複製上方方塊並縮小尺寸。重複上述步驟以定義小柱子。

•[8.2] 為了輕鬆創建一個寶珠，我首先填充一個圓形選區。我使用翡翠材質進行剪貼蒙版以獲得一些細節。

最後，我合併圖層並繪製照明細節。

•[8.3] 複製相同的方塊，我們可以生成其餘的結構。我首先定義頂部，然後繪製側面。

•[8.4] 我用相同的方塊建造了一些樓梯。我試圖用陰影來產生維度。

▼地圖的基本元素已經建構完成。我們只需要角色和一些細節。

5.1 3D 元素

Clip Studio Paint 中我非常喜歡的一個功能是 3D 圖層。對於漫畫、概念藝術和以複雜角度繪製物體作為參考非常有用。

 

■不幸的是，我們無法在 3D 圖層的攝影機中簡單地選擇等距視圖。為了解決這個問題，我準備了幾個空白的 3D 圖層，其攝影機盡可能接近我能獲得的等距視圖。這個素材我也分享在 Assets 中。

■[1] 我們放置相應的 3D 圖層，在本例中為 2:1。

這會創建一個群組，其中包含一個空白的 3D 圖層和一個參考區域。

•[1.1] 選取 3D 圖層後，我們將 3D 物件拖曳到畫布上。該物件會以我預先設定的攝影機放置。（請勿修改）

 

•[1.2] 使用 3D 圖層控制項，我們修改物件的旋轉、縮放和位置。

■注意：物件必須定位在參考區域上方，以確保盡可能精確的透視圖。

•[1.3] 當我們對物件滿意時，我們複製 3D 圖層並將其點陣化。

如果需要，使用 CTRL+T 修改比例和位置。

•[1.4] 我們從 3D 圖層中刪除物件，並對其他感興趣的模型重複這些步驟。

▼有了各種物件，場景就已經完成了。我們只需要以 3D 物件為基礎或參考來繪製。

▼這是我的物件。

https://assets.clip-studio.com/en-us/detail?id=1726790

■[2] 我會逐一繪製每個元素，所有這些都使用畫筆完成，有些圖層則採用不同的混合模式。如果需要，您可以查閱我的混合模式教學。

我首先繪製了「存檔點」的水晶。我試圖稍微打破 3D 模型結構，並透過光澤和顏色賦予它魔法般的外觀。

•[2.1] 第二個物件是水桶，非常簡單。我首先使用漸變映射修改顏色，然後手動繪製。與其他物件一樣，重要的是繪製與地面接觸的陰影，這樣物件就能融入場景。

•[2.2] 我決定讓彩色水晶幾乎保持不變，只模糊了一些邊緣並修改了部分照明。最後，我複製了圖層，應用了高斯模糊，並將其設置為濾色模式。

•[2.3] 儘管看起來更複雜，「擬態」寶箱遵循相同的過程。我利用 3D 物件的幾何形狀，不斷繪製直到定義出我腦海中的圖像。

我改變了它的「嘴巴」，為它添加了一種眼睛和蜘蛛腿。一旦我添加了投影陰影，它就更好地融入了場景。

•[2.4] 為了繪製角色，我只是將不同的元素分層，並像其他元素一樣手動繪製。

•[2.5] 最後，我們繪製蜘蛛。我通過在 3D 模型上方繪製來定義形狀和紋理。

我將身體分為 3 部分，並在強光模式的圖層中處理顏色。

所有元素的過程都相似，只需耐心繪製，直到達到所需的細節程度即可。查看參考總是個好主意。

■[3] 最後，我繪製了一些發光和魔法效果。您可以在我的魔法效果教學中找到我使用的方法。

我通常使用「添加（發光）」模式的圖層，但這取決於您想要的結果。

■ 等距藝術的有趣之處在於我們可以移動元素並創建新場景。

結論

非常感謝您觀看我的教學。

探索專注於電玩遊戲的等距藝術非常有趣。

我感覺有些部分沒有詳細解釋，因為我重複了與之前步驟相同的技術。如果有點長，請見諒。

 

■ 我希望我分享的素材對您有所幫助。您可以將它們應用於插畫和設計，而不僅僅是電玩遊戲藝術。

 

如果您有任何問題，請隨時給我留言。

保重並探索您的創造力。