Agent製作遊戲教程（三）：獨狼的美術自救指南——AI製作美術資產的三種流派
本文依然基於我自己的獨立遊戲《碼農物語》開發時遇到的問題以及踩坑總結，乾貨較多，面向有一定AI和Agent使用基礎、但美術基礎約等於零、或者根本沒預算請外包美術的獨狼開發者。
但是需要你們有錢買哈機密、gpt會員、豆包和minimax的會員或者api
2D美術死穴與幀間一致性
上一期我們講了模組化開發和如何用文件防止AI拉出一坨屎山程式碼。按照前兩期的步驟，很多玩家手裡的PoC應該已經跑通了——比如我遊戲裡的農田能劃格子了、機器人能按寫好的指令碼去播種澆水了。
但這時候，只要你點開遊戲畫面，一股濃烈的廉價感就會撲面而來：全屏都是灰撲撲的div方塊、網上隨便扒來的風格互斥的圖示、還有刺眼的白底紅字。
這時候肯定有玩家要問了：現在AI繪圖不是都進化到能以假亂真了嗎？我直接讓AI給我畫一套遊戲角色的跑動動作圖不就行了？
很可惜的是，人工智障還沒有進化到那一步。AI畫單張桌布確實強，但遊戲動畫要的是“連續幀”。AI一旦開始畫第二幀，反手就會給你整出新花樣：第1幀長髮飄飄，第2幀頭髮突然變短；第3幀衣服顏色從藍色變綠色；第4幀甚至可能憑空多長出兩根手指。這東西放進遊戲裡一播放，角色不是在走路，是在原地發病變異
這就是AI做遊戲美術最大的死穴：缺乏幀間一致性。說白了，AI畫第二幀的時候，根本不記得第一幀到底畫成了什麼樣。
為了解決這個問題，目前行得通的方案主要有三種：窮哥們法、美術大佬法、影片法。豐儉由人，大家根據自己的錢包和肝臟健康程度自選。
窮哥們法：讓AI手搓SVG程式碼
所謂窮哥們法，省流：一分錢不花，全靠你手裡的程式設計Agent純手搓SVG。
很多不怎麼懂前端的玩家可能不知道SVG是什麼。這玩意兒本質上不是由一個個彩色畫素拼起來的點陣圖（不是png也不是jpg），它其實就是純文字格式的XML程式碼。矩形就是
既然是寫程式碼，那這正好撞在各大LLM（Deepseek、千問、Claude等）的槍口上了，這可是它們的傳統強項。
窮哥們法有極其離譜的優點：
第一是真的一毛錢不用掏。不需要你買MJ會員，不需要你有4090跑SD，甚至連畫圖軟體都不用開，你平常用哪個AI搞VibeCoding，就讓它順手寫SVG。
第二是向量圖無限縮放不模糊。不管你遊戲視窗怎麼拉伸、在高分屏上怎麼放大，它都是絕對銳利的。這東西天生極度適合做UI圖示、技能按鈕、農作物各生長階段外觀、機械零件、掉落物以及扁平科技風的小物件。
但這裡注意注意注意！Ai畫的SVG只能說勉強能用，只適合圖示和一些輕量小遊戲的美術資產製作。
千萬不要試圖讓AI用SVG給你畫二次元老婆立繪或者厚塗寫實怪物。複雜的貝塞爾曲線AI寫出來極容易變成抽象派畢加索，而且程式碼量上萬行後會讓瀏覽器渲染直接卡死。
提示詞模板如下，直接複製給你的Agent：
“你現在是資深2D遊戲向量UI與圖示設計師。請用純SVG程式碼幫我繪製一個【主題，比如：2D扁平風格的農田自動巡檢機器人，包含履帶底座、方塊機身和掃描探頭】。
要求：
1. 必須使用標準的
美術大佬法：3D姿態截圖 + 深度圖 + 逐幀跑圖 + 人工修圖
如果你的遊戲是橫版卷軸、動作或者RPG，主角必須得有跑動、揮劍、施法這套正兒八經的連續動作序列幀，那窮哥們法的向量圖就搞不定了，你必須得用點陣圖。
因為這套方案需要用到3D軟體，而且最後必須有人工修圖把關。Ai直出的圖屬於能看但存在各種各樣的問題。
這套方法的核心邏輯非常樸素：AI之所以每幀亂變，是因為它腦子裡沒有物理空間的概念。那我們就用現成的3D骨骼動作給AI作為參考圖。
具體怎麼幹？分四步：
第一步：去白嫖現成的3D動作。零美術基礎千萬別想著自己去Blender裡建模捏人綁骨骼，那是職業模型師乾的事。直接去Adobe旗下的Mixamo網站（完全免費的動捕動作庫，註冊個賬號就能下）或者去開源模型站下個人體木偶。選好你想要的動作，比如“Walk Forward”或者“Slash”。把3D視角的攝像機鎖死在你遊戲需要的角度（比如標準的2D側視，或者45度斜俯視），然後把這個動作按幀匯出一組截圖。
這一步也可以ai代勞，只需要安裝blender和blenderMCP，就可以讓ai輸出參考圖，提示詞如下
“如果當前沒有安裝blender的mcp，則安裝，並完成以下任務：
將指定模型在blender中輸出深度圖、骨骼圖、剪影圖和姿勢參考截圖到指定目錄。”
姿勢示意圖，給ControlNet的OpenPose識別動作姿態；另一個是深度圖（Depth map，就是距離鏡頭近處偏白、遠處偏黑的灰度圖）。深度圖極其關鍵！它把角色的胖瘦、肢體前後遮擋關係徹底焊死了，AI拿到深度圖就再也沒法隨便給角色胡亂加粗手臂或者長出第三隻手。
gemini的agent反重力裡，只能上傳3張圖片給繪畫模型，多餘的會被拋掉。所以我建議只上傳骨骼示意圖、深度圖和角色對應視角的設定圖。
有需要參考圖的請留言或者私信聯絡我，我會免費提供。
第二步：把角色設定圖和深度圖、姿勢示意圖傳給ai
第三步：人肉修圖（最關鍵的一步！）。AI生成的這十幾張PNG，大體動作肯定是對齊的，但細看必定會有穿幫：第3幀胸口有紐扣，第4幀紐扣突然沒了；第5幀劍刃突然變粗了；第7幀靴子邊緣多了幾塊髒斑點。這時候你必須把這組圖扔進Photoshop、Aseprite或者Krita裡，按播放快捷鍵來回輪播，像挑刺一樣把穿幫的畫素點手動塗改抹平。這一步省不掉，不修的話放到遊戲裡角色就會瘋狂閃爍抽搐。
不人肉修圖的代價如下：
第四步：合成精靈圖。把修好的PNG按規律命名（比如hero_run_00.png到07.png），用TexturePacker或者直接讓Agent寫個幾行Python指令碼，一鍵拼成整張精靈圖（Sprite Sheet）並匯出帶有每幀座標資訊的JSON檔案。
讓Agent寫拼圖指令碼的提示詞很簡單：
“寫一個本地Python指令碼，用Pillow庫：讀取指定目錄下所有有序命名的PNG圖片，檢測並裁掉每張圖四周的透明空白，按角色底部腳底對齊，將它們無縫拼成一張單行（或4x4網格）的sprite_sheet.png，並輸出對應的atlas.json記錄每張小圖的位置和寬高。”
富哥法：AI生成影片 + 抽幀 + 智慧摳圖
如果你覺得搞3D太麻煩，學不會Blender也懶得在Mixamo裡調動作，而且你自認手殘修不來圖，但你兜裡有預算（或者本地顯示卡有4090/各大影片模型平臺點數充足），那就可以直接走富哥路線。
富哥法的底層邏輯是降維打擊：利用現在的影片生成大模型（可靈Kling、Runway Gen-3、Luma等）。影片模型在預訓練的時候學的就是現實世界連續運動的規律，它天生就解決了“幀與幀之間連線不自然”的毛病。
具體操作：
第一步：圖生影片跑綠幕動作。把你事先設計好的角色正面立繪作為參考圖餵給影片模型。提示詞裡必須嚴防死守兩個東西：背景和機位！比如提示詞必須寫明：“純綠色背景（green screen #00FF00）、地面無陰影、固定機位視角攝像機、2D遊戲角色迴圈奔跑動畫”。千千萬萬不能讓AI運鏡，鏡頭要是拉近推遠一下，這組素材當場就廢了。
第二步：影片轉圖片。給agent下指令：
“把影片轉換為幀序列”
第三步：批次摳圖去綠邊。從影片裡抽出來的圖底色是綠的，而且由於影片壓縮，角色邊緣往往會有很嚴重的綠幕反光和溢色（Green Spill）。如果用傳統畫圖軟體的顏色魔棒去點，邊緣會留下一圈極其噁心的綠色毛邊。要麼手動摳圖要麼讓ai進行摳圖。只需要對agent說：
“摳圖、保持畫風不變、去除背景”
ai摳圖建議使用gpt和gemini。豆包不知道怎麼回事，經常輸出不出透明背景的圖
第四步：腳底中心對齊。影片模型生成的動作通常會有輕微的全域性位移漂移（角色一邊走一邊往前滑）。如果你直接把抽出來的圖拼在一起，角色在遊戲裡迴圈播放時就會左右亂抖。讓Agent寫個輕量的OpenCV指令碼，計算每一幀角色身體畫素的“最底部中心點”，把所有幀的腳底座標釘死在畫布相同的位置，再拼成精靈圖。
影片法雖然爽，但坑也很明顯：
首尾幀迴圈閉環難搞。影片模型很難做到完美的無縫迴圈（Seamless loop），通常需要你人工在抽出來的幾十幀裡，手動挑選出剛好跨完一步的完整週期（比如剛好從左腳落地到下一次左腳落地的第4幀到第12幀）拿來用。
一般來講，精靈圖都是4幀4向（上下左右）的。這裡我為了演示影片轉幀序列由ai摳圖後的gif的效果多好，採用的是24幀/s的圖，實際遊戲中只需要抬腿邁腿落地等關鍵幀組成的4-8幀。不過很可惜的是我口袋裡分文不剩，只能給你們看不精修和抽卡時長啥樣了。如圖：
下期預告：美術資產3D篇：
