從一張角色圖到可操作的 2D 角色：待機、跑動和攻擊

按住方向鍵讓角色跑起來，放開停下，出一拳，再繼續移動。把動畫接到操作上之後，切換時的大小變化、腳底位置和收招時機就更容易看出來了。

上一期，我們從同一段影片拆出了橘色機器人的直拳和前踢。這次沿用同一張角色圖，補上格鬥待機與原地跑動，把四段透明動畫接進一個小場景，全部維持 24 FPS。

直接開啟瀏覽器操作示範：方向鍵或 A/D 移動，J 出拳，K 踢腿；手機上按住方向按鈕。頁面預設暫停，點擊開始或操作按鈕後播放。

四個動作共用一張角色圖

這次繼續使用橘色機器人原圖，保留相同的裝甲顏色、頭身比例和朝右視角。每個動作都從這張圖開始，減少重新繪製角色帶來的外觀變化。

構圖也沿用前篇設定：4:3 畫布，Expand Canvas 縮放 80%，位置 X 為 0.35、Y 為 0.5，給右側拳腳留出空間。如何為大動作安排留白，可以看 Expand Canvas 案例。

向左移動時，示範把整套圖片水平鏡像。這個機器人沒有文字或單側武器，用同一套素材轉身比較方便。如果角色拿著盾牌，或衣服上有字，就要檢查鏡像後是否符合設計。

分別產生安靜的待機和原地跑動

待機提示詞要求雙腳站定、拳頭維持準備姿勢，胸口和肩膀只有輕微起伏。這樣放開方向鍵後，角色能安靜地停下來，不會立刻踏步或做出另一個大動作。

跑動提示詞則要求朝右、在原地連續跑動，鏡頭與角色尺度保持固定。場景中的橫向位置交給程式控制，素材本身保留擺臂、抬腿和身體起伏。

兩次請求都使用 Seedance 2.0 Fast、4 秒、480p、4:3 和 Alpha Key。本次實際各扣 36 點數，共 72 點數；透明 PNG 序列與 ProRes 4444 匯出均為 0 點數。直拳和前踢重用前篇的 720p 素材，沒有再次產生。這是 2026-10-03 的實際費用紀錄，後續以產生前報價為準。

可以下載實際使用的待機提示詞、跑動提示詞，以及帶鍵色背景的待機原片、跑動原片。兩條原片實際都是 752 × 560、97 影格、24 FPS，約 4.04 秒；請求的解析度級別、回傳尺寸和執行時畫布分別對應不同環節。

待機和跑動選循環，攻擊保留完整起落

四秒原片足夠挑出一段呼吸或步態週期。我們先連續播放幾個週期，再檢查末尾接回開頭時的姿勢，保留以下連續影格。表內來源影格編號從 0 開始，包含首尾。

跑動保留完整步態，再從第 59 影格回到第 44 影格。沒有降成 12 FPS，也沒有額外產生過渡影格。循環檢查方式可參考行走循環文章；直拳與前踢的起手、收招來自上一期的兩個動作選段。

用統一畫布和原點對齊四段動畫

每段動畫都放進 512 × 384 的透明畫布，維持原始長寬比。新增待機與跑動先把整個影格等比縮放為 512 × 381，再放進畫布，避免把 752 × 560 硬拉成另一種比例。

比較站姿與落腳位置後，我們對待機整段固定平移 X −2、Y +3 像素，跑動整段固定平移 X −24、Y +3 像素。直拳與前踢沿用原位置。四段共用從左上角起算的原點 (224, 321)，在場景中以 0.85 倍顯示。

這些數值屬於本次機器人素材。換角色時，先比較各段的頭頂、腳底和軀幹位置，再決定如何對齊。整段固定偏移可以保留跑步的自然起伏；逐影格緊貼輪廓裁切，則可能讓角色在切換和播放時跳動。畫布與軸點文件說明了這兩種設定的差別。

攻擊播完後，再回應目前方向

小場景使用 idle、run、punch 和 kick 四個狀態。沒有攻擊時，有方向輸入就跑動，放開就待機；同時按住左右鍵則停下。

按 J 或 K 後，控制器鎖住橫向位置和朝向，讓攻擊完整播放一次，期間的新攻擊輸入直接忽略。動畫結束時重新讀取方向：仍按著就繼續跑，已放開就回到待機。長按攻擊鍵只觸發一次，下次需要放開再按。

Godot 範例透過 AnimatedSprite2D.animation_finished 處理收招。直拳與前踢關閉循環，待機與跑動開啟循環；循環動畫不會發出這個完成訊號。Godot 官方文件

func _attack_finished() -> void:
    if _attacking():
        completed[state] += 1
        _locomotion()

_locomotion() 會讀取目前方向，再選擇 run 或 idle。完整實作已放進下載專案，不必自己拼接這段函式。這個場景先處理移動與動畫切換，未加入敵人、命中偵測或傷害計算。

在 Godot 中試手感，移動速度分開調

下載 Godot 範例專案，解壓縮後在 Godot 4 匯入 project.godot，按 F5 執行。專案從 character.json 讀取四張透明精靈圖及影格區域，建立 SpriteFrames，無須安裝外掛。本次在 macOS 的 Godot 4.7.2、Compatibility 算繪器中執行並錄製了開頭的影片。

移動速度預設 280 px/s，動畫維持 24 FPS。這是可調整的示範速度；換角色或縮放比例後，還需要再觀察腳掌著地時的滑動。網頁速度滑桿的範圍為 60–600 px/s；Godot 專案可修改 assets/character.json 中的 defaultSpeed。保持播放影格率，再調位移速度，較容易判斷步態與移動是否合拍。

試著在跑動中出拳、攻擊期間按相反方向、收招前放開所有按鍵。角色應完整做完攻擊，再按目前輸入行動。網頁隱藏或視窗失焦時會清理按鍵並暫停，回來後不會繼續沿用先前按住的方向。

下載素材，換成自己的角色

透明精靈圖包包含四張 PNG、影格區域、播放影格率和選格與對齊配方。依 JSON 的影格數讀取，避免把圖集末尾的空格加入播放序列。網頁與 Godot 使用透明圖片，文內 MP4 為觀看方便合成了背景。

這套多動作控制器與下載包是以真實匯出素材製作的教學範例。自己製作時，可以先按Godot 匯入教學確認素材，再替換四個動作的精靈圖與影格資料。尺寸、雜湊、費用與匯出檢查保存在素材紀錄。

把停止、轉身和一次完整攻擊試順以後，再決定角色缺什麼動作。需要補充動畫時，回到 AnimGen 工作台，沿用確定好的角色圖、鏡頭和畫布留白。