跳至正文
所有教學

AI 揮劍動畫

把 4 秒 AI 揮劍動畫,剪成一次利落的遊戲攻擊

用首頁女劍士實測:去掉首尾待機、抽掉中間停頓影格,把 4 秒 AI 揮劍動畫剪成 28 影格、1.17 秒的攻擊,保持 24 FPS,並提供點擊示範。

AnimGen更新於 8 分鐘閱讀
精修後的像素女劍士攻擊:準備、舉劍、揮砍和收招四個畫面
本文目錄

AnimGen 首頁女劍士的揮劍預覽有 4 秒。動作完整,但前後都有待機,中間還會壓低身體停一下、舉劍停一下、揮完再停一下。直接把整段影片接到攻擊按鈕上,玩家按下去後要等一會兒,動作也顯得分成了幾段。

這次把首尾等待剪掉,再抽掉中間拖慢節奏的影格,從 96 影格中留下 28 影格。下面是處理後的版本:仍以 24 FPS 播放,時長約 1.17 秒。也可以開啟單次攻擊示範,用按鈕試試出招和回到準備姿勢的節奏。

精修後 · 28 影格 · 24 FPS · 約 1.17 秒。已去掉首尾待機,並壓縮起手與收招的停頓。

示範使用首頁帶灰底的 448 × 192 預覽,保持原尺寸,沒有插影格或重新產生。透明遊戲資產仍需從對應的原始素材匯出。

只裁掉首尾,動作還是會停頓

下面保留 4 秒原片作對照。可以留意:角色什麼時候真正開始動,舉劍後停了多久,劍落下後什麼時候才開始回身。

修改前 · 首頁原片 · 96 影格 · 24 FPS · 4 秒。僅用於對照首尾等待和動作中的停頓。

這次選段從原片第 17 影格開始,到第 78 影格結束,影格號從 0 算起。首影格保留起手前的姿勢,末影格保留回身完成的姿勢;它們前後連續等待的影格都去掉。

只做這一步,還有 62 影格,約 2.58 秒。因為舉劍前、舉劍後和揮完後的停頓仍然在,攻擊依舊偏慢,需要繼續處理片段內部。

版本 影格數 24 FPS 下的時長
首頁原片 96 4.00 秒
僅去掉首尾待機 62 約 2.58 秒
再抽掉中間停頓與部分過渡影格 28 約 1.17 秒

縮短停頓,留下揮砍的連續動作

起手和收招需要保留到什麼程度,可以沿著劍和身體的位置判斷。這份素材的抽影格分成三段:

  • 起手,第 17–42 影格:從 26 影格縮到 9 影格。保留壓低身體、抬劍、舉過頭頂的姿勢,縮短幾個姿勢之間的停留。
  • 揮砍,第 43–51 影格:連續保留這 9 影格,讓劍光劃過、落劍和特效消散連在一起。
  • 收招,第 52–78 影格:從 27 影格縮到 10 影格。壓縮揮完後俯身持劍的停頓,留下起身、收劍、回到準備姿勢的過程。

精修後動畫在第 0、8、11、25 影格的準備、舉劍、揮砍和收招畫面,按兩行排列

上圖來自精修後的動畫,依次是 0.000、0.333、0.458 和 1.042 秒。姿勢仍然能看清,姿勢之間的等待已經縮短。抽影格時不要只留下這幾張截圖:抬劍、落劍和起身的中間過程還要連起來播放檢查。

完整選影格順序如下,數字是原片中從 0 開始的影格號。28 影格按這個順序,以 24 FPS 播放:

text
17, 18, 20, 30, 32, 33, 35, 37, 42,
43, 44, 45, 46, 47, 48, 49, 50, 51,
52, 67, 68, 69, 71, 73, 74, 75, 77, 78

本次網頁影片按這份選影格清單在本地重新編碼。原片另行保留,方便對照。

在高階編輯器裡調整自己的攻擊節奏

在 AnimGen 開啟產生結果或匯入影片,通過選段與匯出確定動作範圍,再進入高階編輯器處理內部影格。

  1. 從來源影片影格選出起手到收招的範圍,加入動畫序列。
  2. 在輸出序列中選中多餘的待機、停頓影格並刪除。先處理變化很小的片段,每刪一小組就播放一次。
  3. 起手和收招仍然拖沓時,再抽掉部分過渡影格。劍揮出的連續區間先保留,觀察整體節奏後再決定是否繼續修改。
  4. 輸出保持 24 FPS,檢查從準備姿勢進入攻擊,以及最後幾影格回到準備姿勢的銜接。確認儲存後再匯出。

24 FPS 下,刪掉一影格會減少約 41.7 毫秒。把整個動畫調快,會同時加快劍光和回身;按片段抽影格,可以分別處理起手等待與收招停頓。

如果某個地方刪過頭了,角色突然跳到另一個姿勢,就把附近的過渡影格加回來。這裡的 28 影格是這段女劍士素材的選法,自己的角色要沿著動作重新選。

點擊一次,播放一次,結束後回到準備姿勢

開啟點擊揮劍示範,試著點擊攻擊,再等它播放完。示範使用“準備”和“攻擊中”兩個主要狀態,影片尚未開始時會顯示載入提示:

  1. 頁面開啟時顯示準備姿勢。
  2. 點擊攻擊按鈕,從選段第一影格開始播放。
  3. 播放期間再次點擊,先忽略這次輸入,避免動作不斷被重置到開頭。
  4. 動作播放完畢,返回準備姿勢,並允許下一次攻擊。

示範預設使用精修後的 28 影格版本。準備姿勢取自精修片段第一影格,在等待點擊時靜態顯示,不再把一段 idle 放進攻擊播放時間。完成一次播放後,計數加一,畫面回到這張圖。重置按鈕可以隨時取消播放,並清空計數。

text
準備 → 點擊攻擊 → 從頭播放一次 → 播放結束 → 準備
播放期間再次點擊:不重啟動作
點擊重置:取消播放,計數歸零

網頁在影片實際播放結束時返回準備狀態,時間讀數也使用精修影片自身的時長。示範沒有開啟迴圈,播放倍率保持 1 倍。

連續點擊也要實際試。一個始終能被重新啟動的播放器,很容易在反覆點擊時只播放起手,劍還沒有揮出去,動畫就又回到第一影格。

如果後續希望玩家提前按鍵、目前攻擊結束後接下一招,可以增加輸入緩衝。目前示範沒有儲存播放期間的攻擊輸入;連擊、閃避打斷等規則可以等專案確實需要時再加。

劍光出現的時刻,還需要配合命中規則

示範負責播放和狀態切換,沒有碰撞或傷害判定。接入遊戲時,還需要確定攻擊何時能夠命中。可以逐影格觀察劍經過目標方向的區間,再在引擎裡設定相應的有效視窗。

抽影格後也要重新核對時間。原片第 43–51 影格在新序列中是第 9–17 影格,佔約 0.375–0.750 秒的播放區間。沿用原片的秒數,會讓判定和揮劍錯開。具體哪些影格允許命中,還要結合敵人位置與攻擊範圍檢查。

攻擊觸發後是否允許移動、何時能接下一招、受到攻擊時是否中斷,都是遊戲控制邏輯要處理的事情。先把動畫放進一個簡單場景,用實際輸入檢查,再決定這些規則。

匯出時保留動作空間和統一的畫布

揮劍會用到站立姿勢之外的橫向與上方空間。匯出前檢查劍尖、手臂和特效最伸展的畫面,不要只按準備姿勢裁出一個很緊的邊界。如果產生時就容易超出畫面,可以提前用Expand Canvas 留出動作空間。

準備姿勢和攻擊序列使用一致的畫布與擺放方式,進入和退出攻擊時更容易保持位置連貫。引擎裡的原點也應使用一致約定;具體設定見畫布與 pivot。

需要逐影格處理時可以匯出 PNG 序列;已經確定動作後,可以使用精靈圖或對應的引擎資產包。兩種格式的取捨見精靈圖與 PNG 序列對比。

用自己的角色測試時,先把“進入攻擊、完整播放、返回準備姿勢”接順,再加入敵人和命中反饋。反覆按幾次攻擊鍵,往往比持續迴圈播放更容易發現銜接和輸入處理的問題。

查看圖片細節