Metlivi 部落格

如何保持大地圖與戰鬥精靈圖的縮放比例一致

若要讓角色在大地圖和戰鬥場景中看起來大小一致,請比對美術圖案在螢幕上實際渲染的高度,而非僅看原始影像的尺寸。為角色設定一個通用的像素高度目標,確立一致的世界比例與像素密度,然後在相同的攝影機縮放比例下比對兩個場景。將角色的雙腳對齊到同一條基準線,並在遊戲預期的顯示尺寸下檢查效果。如果其中一個場景刻意採用了不同的攝影機角度或構圖,請記錄該特殊情況,而不是私下直接更改精靈圖的縮放比例。

2026年10月15日閱讀時間 8 分鐘作者:Metlivi Editorial Team
第 1 節

確定「相同比例」對您的遊戲而言意味著什麼

首先從定義一個可衡量的目標開始。例如,您可以規定角色在兩個場景的基準攝影機視角下,從腳底到頭頂都應佔據 32 個螢幕像素。這只是一個說明性的目標,並非建議的通用尺寸:請選擇適合您遊戲解析度及美術細節程度的尺寸。

請測量可見的角色本體,而不是包含透明區域的影像矩形。大地圖精靈圖可能包含陰影、武器、天線或多餘的留白,而戰鬥精靈圖則可能有不同的姿勢。請確定您的目標是要測量從頭到腳的身體輪廓,還是包含所有配件的完整可見畫面,並在兩個場景中採用相同的規則。準備一份簡短的參考資料表,記錄目標高度、基準解析度、預定的地面線,以及任何刻意設計的場景專屬差異。

這個定義至關重要,因為較大的原始畫布並不直接等於螢幕上會呈現較大的角色。畫布尺寸描述的是影像區域;而引擎的匯入設定、物件縮放以及攝影機,才決定了該區域會佔據多少個顯示像素。Aseprite 嚴格區分了更改畫布大小與調整精靈圖內容大小,因此在修改美術圖案之前,請確認您需要的是哪種操作。Aseprite:精靈圖大小 (Sprite Size)

第 2 節

比對每個畫布中的實際美術圖案

以原始像素比例開啟大地圖和戰鬥影像,並計算所選測量範圍內的像素數量。記錄角色的可見高度以及腳底與畫布邊緣之間的距離。如果戰鬥角色的可見高度為 48 像素,而大地圖角色為 32 像素,那麼在引擎套用任何場景縮放之前,它們的美術圖案比例差異就已經是 1.5:1。

在其他比例均相同的情況下,簡單的初步計算公式為:期望的渲染高度 ÷ 目前的渲染高度 = 調整係數。如果精靈圖目前渲染的高度為 24 像素,而期望渲染的高度為 32 像素,則調整係數為 32 ÷ 24 = 1.33。可將此數值作為診斷評估的依據,接著再檢查美術資源與場景設定。這只是一個說明性的計算;前提是攝影機、裁切或變形(Transform)沒有其他差異。

切勿只是為了讓影像檔案具有相同的寬度與高度而調整尺寸。某些姿勢可能會比較寬,或者戰鬥動畫可能包含舉手的動作。請保留預期的形狀,並比對相同的身體標記點。如果精靈圖在結構或透視上有明顯差異,單純匹配像素高度可能仍然無法讓它們看起來一致;此時應調整設計,或確立一個場景特有的例外規則。

第 3 節

設定通用的像素密度與世界比例

在 Unity 中,將大地圖和戰鬥精靈圖設定為相同的每單位像素量 (Pixels Per Unit, PPU),並將 Pixel Perfect Camera 的 Asset Pixels Per Unit 設定調整為相同數值。Unity 將 PPU 定義為構成一個場景單位的像素數量,其 Pixel Perfect Camera 指南建議場景中的所有精靈圖採用相同數值。Unity:2D Pixel Perfect 例如,如果專案使用 16 PPU,那麼在進行物件縮放之前,一個 32 像素高的精靈圖將佔據 2 個世界單位。

同時也要檢查每個角色物件的變形縮放 (Transform Scale)。如果一個場景中的物件縮放比例為 0.8,而另一個為 1.0,那麼統一 PPU 也無法彌補這種差異。建議盡量採用一致的匯入與變形設定,只有在構圖需要時,才調整美術圖案或套用記錄明確的場景專屬縮放。

在其他引擎中,請找到對應的控制項:多少原始像素對應一個世界單位、節點或物件的縮放比例,以及攝影機的視口 (Viewport) 或縮放值 (Zoom)。Godot 的 2D 渲染路徑包含畫布與視口變形,包括在調整螢幕大小時使用的拉伸變形 (Stretch Transform);因此,單憑原始影像的尺寸無法決定其最終的螢幕大小。Godot:視口與畫布變形 (Viewport and canvas transforms)

第 4 節

透過明確的軸心對齊雙腳

角色的高度即使正確,但如果他在場景之間出現懸浮、下沉或位置偏移,看起來的比例依然會不協調。請將軸心 (Pivot) 設定在有具體意義的錨點上,通常是雙腳之間的地面接觸點,然後在兩個場景中將該錨點對齊到相同的地面基準線。對於在動畫過程中腳部會移動的精靈圖,請一致地錨定根節點或軸心,並仔細檢查著地幀 (Contact Frames)。

避免直接認定每張圖片的中心就是合適的錨點。畫布周圍可能包含不同程度的透明留白,使用中心軸心可能會導致美術圖案在垂直位置上出現偏差。Unity 的像素完美工作流程支援以像素為單位的自訂軸心,並建議為多精靈圖紋理中的各個精靈圖分別設定軸心。Unity:2D Pixel Perfect 在 Godot 中,Sprite2D 預設採用居中對齊;其說明文件指出,居中放置的像素美術在處於像素與像素之間時可能會變形,並建議可以停用居中或啟用像素貼齊 (Pixel Snapping) 來解決。Godot:Sprite2D

第 5 節

檢查過濾方式、貼齊與攝影機縮放

請使用鄰近 (Nearest) 或點 (Point) 過濾來維持像素美術的銳利度,並確認紋理壓縮沒有改變其外觀。Unity 的指南特別建議對搭配 Pixel Perfect Camera 使用的精靈圖採用 Point 過濾且不使用壓縮。Unity:2D Pixel Perfect 這些設定是為了保持邊緣的清晰度,並不能讓兩個縮放比例不同的精靈圖自動變得大小一致。

接下來,將兩個場景的攝影機設定為相同的基準視角,或使用一個臨時共用的測試攝影機來進行比對。戰鬥場景通常會放大鏡頭以達到強調效果。如果攝影機放大一倍,即使精靈圖的世界比例沒有改變,角色佔據的螢幕像素也會增加一倍。請明確專案的要求究竟是「相同的世界大小」還是「相同的螢幕佔比」:這兩者是不同的目標。如果戰鬥畫面的構圖是刻意將角色放大,請將這種縮放記錄為視覺呈現手法,切勿以此視角來評判精靈圖底層的縮放比例。

對於像素美術,除了檢視靜態畫面外,也要仔細檢查動態過程。次像素位置或不一致的貼齊設定,可能導致角色移動時邊緣出現閃爍或不平整。Unity 的 Pixel Perfect Camera 提供了與資產 PPU 綁定的網格貼齊;Godot 則為 2D 頂點與變形提供了像素貼齊設定。Unity:2D Pixel Perfect Godot:Sprite2D 請務必使用專案實際的攝影機設定進行測試,因為貼齊和縮放的表現完全取決於渲染設定。

第 6 節

修改資產前先進行簡短的比對檢查

若情況允許,請使用相同的角色姿勢進行並排比對。請依序進行以下檢查:

  1. 使用相同的標記點和像素計算規則,比對身體的可見高度。
  2. 比對雙腳的基準線,以及精靈圖的軸心或根節點位置。
  3. 驗證 PPU 或對應的匯入密度、物件縮放以及任何父層縮放。
  4. 統一攝影機縮放、基準解析度、視口縮放與顯示尺寸。
  5. 在原始尺寸及動態移動中進行檢查,以發現模糊、像素排列不均或破圖裁切等問題。
  6. 重新檢查數個動畫幀,特別是高度最低和最高的姿勢。

如果美術測量結果相符,但角色在戰鬥中看起來仍然較大,請在修改精靈圖之前先調查攝影機取景和周圍物件。如果攝影機和變形皆一致,但輪廓高度有差異,請調整美術圖案或套用受控的場景專屬縮放。如果高度相符但雙腳位置偏移,請修正軸心、留白或錨點。遵循這個順序有助於找出問題根源,避免用一個錯誤去掩蓋另一個錯誤。

第 7 節

為後續的精靈圖保留簡短的比例參考

請將通用的目標高度、PPU(或等效設定)、基準解析度、軸心規範以及預期的攝影機設定,與精靈圖資產一併記錄下來。Aseprite 的畫布工具可以裁剪透明邊框,但裁剪會改變畫布邊界,因此隨後請檢查軸心、九宮格切片 (Slices) 或引擎端的錨點是否依然對齊。Aseprite:畫布大小 (Canvas Size) 請將裁剪視為一項資產變更,並進行快速的場景檢查。

最可靠的標準是:角色符合約定的可見高度目標、共用地面錨點,並在預期的攝影機和過濾設定下渲染一致。將攝影機強調所造成的刻意差異保留為明確的視覺呈現手法。記錄好這些檢查項目後,日後製作的大地圖姿勢與戰鬥動畫都可以參照同一個實用的基準進行比對。

第 8 節

參考來源

相關閱讀

繼續探索這個主題