女朋友想要专属桌宠？我用 AI 提示词，1 小时把照片变成 57 帧动画精灵

女朋友想要专属桌宠？我用 AI 提示词，1 小时把照片变成 57 帧动画精灵

她看了一眼我的 Codex 桌宠，说：“为什么你的桌宠是猫，我的却是默认的？”
于是我用一个周末研究出了这套方法——用提示词生成专属人像桌宠精灵。

一、这事到底怎么做？

先给你看最终效果——我把女朋友的照片喂给 AI，生成了这样一个 57 帧的横版精灵图（Sprite Sheet）：

这张图里包含 9 种动作、共 57 帧动画：

把这张精灵图塞进 Codex 桌宠的配置里，你的桌宠就变成了专属定制的她。

整个流程长这样：

#mermaid-svg-AS1HU1nW9geNtW43{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-AS1HU1nW9geNtW43 .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-AS1HU1nW9geNtW43 .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-AS1HU1nW9geNtW43 .error-icon{fill:#552222;}#mermaid-svg-AS1HU1nW9geNtW43 .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-AS1HU1nW9geNtW43 .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-AS1HU1nW9geNtW43 .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-AS1HU1nW9geNtW43 .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-AS1HU1nW9geNtW43 .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-AS1HU1nW9geNtW43 .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-AS1HU1nW9geNtW43 .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-AS1HU1nW9geNtW43 .marker{fill:#333333;stroke:#333333;}#mermaid-svg-AS1HU1nW9geNtW43 .marker.cross{stroke:#333333;}#mermaid-svg-AS1HU1nW9geNtW43 svg{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-AS1HU1nW9geNtW43 p{margin:0;}#mermaid-svg-AS1HU1nW9geNtW43 .label{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;color:#333;}#mermaid-svg-AS1HU1nW9geNtW43 .cluster-label text{fill:#333;}#mermaid-svg-AS1HU1nW9geNtW43 .cluster-label span{color:#333;}#mermaid-svg-AS1HU1nW9geNtW43 .cluster-label span p{background-color:transparent;}#mermaid-svg-AS1HU1nW9geNtW43 .label text,#mermaid-svg-AS1HU1nW9geNtW43 span{fill:#333;color:#333;}#mermaid-svg-AS1HU1nW9geNtW43 .node rect,#mermaid-svg-AS1HU1nW9geNtW43 .node circle,#mermaid-svg-AS1HU1nW9geNtW43 .node ellipse,#mermaid-svg-AS1HU1nW9geNtW43 .node polygon,#mermaid-svg-AS1HU1nW9geNtW43 .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-AS1HU1nW9geNtW43 .rough-node .label text,#mermaid-svg-AS1HU1nW9geNtW43 .node .label text,#mermaid-svg-AS1HU1nW9geNtW43 .image-shape .label,#mermaid-svg-AS1HU1nW9geNtW43 .icon-shape .label{text-anchor:middle;}#mermaid-svg-AS1HU1nW9geNtW43 .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-AS1HU1nW9geNtW43 .rough-node .label,#mermaid-svg-AS1HU1nW9geNtW43 .node .label,#mermaid-svg-AS1HU1nW9geNtW43 .image-shape .label,#mermaid-svg-AS1HU1nW9geNtW43 .icon-shape .label{text-align:center;}#mermaid-svg-AS1HU1nW9geNtW43 .node.clickable{cursor:pointer;}#mermaid-svg-AS1HU1nW9geNtW43 .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-AS1HU1nW9geNtW43 .arrowheadPath{fill:#333333;}#mermaid-svg-AS1HU1nW9geNtW43 .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-AS1HU1nW9geNtW43 .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-AS1HU1nW9geNtW43 .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-AS1HU1nW9geNtW43 .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-AS1HU1nW9geNtW43 .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-AS1HU1nW9geNtW43 .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-AS1HU1nW9geNtW43 .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-AS1HU1nW9geNtW43 .cluster text{fill:#333;}#mermaid-svg-AS1HU1nW9geNtW43 .cluster span{color:#333;}#mermaid-svg-AS1HU1nW9geNtW43 div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-AS1HU1nW9geNtW43 .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-AS1HU1nW9geNtW43 rect.text{fill:none;stroke-width:0;}#mermaid-svg-AS1HU1nW9geNtW43 .icon-shape,#mermaid-svg-AS1HU1nW9geNtW43 .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-AS1HU1nW9geNtW43 .icon-shape p,#mermaid-svg-AS1HU1nW9geNtW43 .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-AS1HU1nW9geNtW43 .icon-shape .label rect,#mermaid-svg-AS1HU1nW9geNtW43 .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-AS1HU1nW9geNtW43 .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-AS1HU1nW9geNtW43 .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-AS1HU1nW9geNtW43 :root{–mermaid-font-family:\”trebuchet ms\”,verdana,arial,sans-serif;}

不满意

满意

准备参考照片

写提示词 Prompts

AI 生成精灵图（豆包/ Midjourney）

效果满意？

裁剪 & 检查

配置 Codex 桌宠

桌面运行 ✓

二、你需要准备什么

工具清单不多，三样就够了：

核心难点就一个——提示词怎么写。下面我把提示词逐段拆给你看。

三、核心提示词拆解：AI 是怎么听懂你的需求的

这份提示词是我和豆包来回沟通了 5 轮 才调出来的。我把它拆成 5 个模块，每个模块都有它的用意。

3.1 角色定义——让 AI 知道"画谁"

Generate a horizontal sprite sheet for a Codex desktop pet, in chibi anime style.

Character:

– Cute Q‑version (chibi) of the person in the reference image
– Maintain all key features: same hairstyle and hair color, face expression style,
clothing style, accessories, and overall vibe
– The character must be exactly the same person across all frames

这里的门道：

• Q-version (chibi) 是关键词，告诉 AI 画 Q 版不是写实
• same hairstyle / hair color / clothing style 是保底条款——防止 AI 在不同帧里画出不同的角色
• 最后一句话 exactly the same person across all frames 是最关键的，没有这句，AI 会在不同动作帧里改角色长相

3.2 动作设计——9 种桌宠日常

桌宠之所以可爱，是因为它有"活着"的感觉。我设定了 9 种动作，覆盖了日常使用场景：

1. Idle blink (6 frames): standing naturally, gently blinking,
occasionally tilting head slightly, relaxed and cute expression.

2. Coding (6 frames): sitting or kneeling, holding a small keyboard
or mini computer, typing rapidly, with a few code symbols floating nearby
like @, </>, ;, :, etc.

3. Bug fixing (6 frames): holding a small wrench, seriously repairing a red bug icon,
with slight motion lines, final frame shows a satisfied smile.

…（后续动作省略，文末有完整版）

设计思路：

• 待机 + 敲代码 + 修 Bug + 报错 + 加载 + 庆祝 = 程序员日常叙事线
• 偷看 + 睡觉 + 监工 = 互动感动作，让桌宠不只是"在那待着"
• 每个动作的帧数不是随便写的——眨眼 6 帧刚好 1 秒循环，敲代码 6 帧能看出节奏感

3.3 布局控制——让 57 帧不打架

Layout:

– All frames arranged in one single horizontal strip
– Each frame shows the same character performing the action with only minor variations
– No crop on hair, head, hands, feet, props, or body
– Enough spacing between frames so they do not overlap

最容易踩坑的地方：

• minor variations——告诉 AI 每帧是微动不是重画
• No crop——防止 AI 切到头发或手脚，Codex 桌宠需要完整的角色轮廓
• Enough spacing——不加这句，AI 会把所有帧挤在一起，裁切时会很痛苦

3.4 画风控制——Q 版的灵魂

Art style:

– Chibi Q‑version anime style, clear thick outlines, flat cel‑shading,
cute and clear expressions, well‑defined body contours
– High character consistency across all frames

关键参数解释：

3.5 绿幕背景——省去抠图的麻烦

Background:

– Solid green screen color: #00ff00 (pure green)
– Entire background must be this solid green only
– No shadows, no gradients, no floor, no textures, no glow, no reflections
– Do NOT use #00ff00 anywhere in the character or props

这一招是从视频抠图里学来的——#00ff00 纯绿背景。Codex 桌宠支持透明背景，用纯绿底图方便后期一键去背。最后一句话是防呆设计，防止 AI 把绿色画到角色身上。

四、豆包出图：5 轮拉扯才拿到满意的精灵图

写提示词最大的错觉是——一次就能出图。实际上我前后沟通了 5 轮才拿到满意的结果。

整个过程大致是这样：

豆包 AI豆包 AI#mermaid-svg-QgAUGXkp9RpEzrTI{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-QgAUGXkp9RpEzrTI .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-QgAUGXkp9RpEzrTI .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-QgAUGXkp9RpEzrTI .error-icon{fill:#552222;}#mermaid-svg-QgAUGXkp9RpEzrTI .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-QgAUGXkp9RpEzrTI .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-QgAUGXkp9RpEzrTI .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-QgAUGXkp9RpEzrTI .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-QgAUGXkp9RpEzrTI .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-QgAUGXkp9RpEzrTI .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-QgAUGXkp9RpEzrTI .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-QgAUGXkp9RpEzrTI .marker{fill:#333333;stroke:#333333;}#mermaid-svg-QgAUGXkp9RpEzrTI .marker.cross{stroke:#333333;}#mermaid-svg-QgAUGXkp9RpEzrTI svg{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-QgAUGXkp9RpEzrTI p{margin:0;}#mermaid-svg-QgAUGXkp9RpEzrTI .actor{stroke:hsl(259.6261682243, 59.7765363128%, 87.9019607843%);fill:#ECECFF;}#mermaid-svg-QgAUGXkp9RpEzrTI text.actor>tspan{fill:black;stroke:none;}#mermaid-svg-QgAUGXkp9RpEzrTI .actor-line{stroke:hsl(259.6261682243, 59.7765363128%, 87.9019607843%);}#mermaid-svg-QgAUGXkp9RpEzrTI .innerArc{stroke-width:1.5;stroke-dasharray:none;}#mermaid-svg-QgAUGXkp9RpEzrTI .messageLine0{stroke-width:1.5;stroke-dasharray:none;stroke:#333;}#mermaid-svg-QgAUGXkp9RpEzrTI .messageLine1{stroke-width:1.5;stroke-dasharray:2,2;stroke:#333;}#mermaid-svg-QgAUGXkp9RpEzrTI #arrowhead path{fill:#333;stroke:#333;}#mermaid-svg-QgAUGXkp9RpEzrTI .sequenceNumber{fill:white;}#mermaid-svg-QgAUGXkp9RpEzrTI #sequencenumber{fill:#333;}#mermaid-svg-QgAUGXkp9RpEzrTI #crosshead path{fill:#333;stroke:#333;}#mermaid-svg-QgAUGXkp9RpEzrTI .messageText{fill:#333;stroke:none;}#mermaid-svg-QgAUGXkp9RpEzrTI .labelBox{stroke:hsl(259.6261682243, 59.7765363128%, 87.9019607843%);fill:#ECECFF;}#mermaid-svg-QgAUGXkp9RpEzrTI .labelText,#mermaid-svg-QgAUGXkp9RpEzrTI .labelText>tspan{fill:black;stroke:none;}#mermaid-svg-QgAUGXkp9RpEzrTI .loopText,#mermaid-svg-QgAUGXkp9RpEzrTI .loopText>tspan{fill:black;stroke:none;}#mermaid-svg-QgAUGXkp9RpEzrTI .loopLine{stroke-width:2px;stroke-dasharray:2,2;stroke:hsl(259.6261682243, 59.7765363128%, 87.9019607843%);fill:hsl(259.6261682243, 59.7765363128%, 87.9019607843%);}#mermaid-svg-QgAUGXkp9RpEzrTI .note{stroke:#aaaa33;fill:#fff5ad;}#mermaid-svg-QgAUGXkp9RpEzrTI .noteText,#mermaid-svg-QgAUGXkp9RpEzrTI .noteText>tspan{fill:black;stroke:none;}#mermaid-svg-QgAUGXkp9RpEzrTI .activation0{fill:#f4f4f4;stroke:#666;}#mermaid-svg-QgAUGXkp9RpEzrTI .activation1{fill:#f4f4f4;stroke:#666;}#mermaid-svg-QgAUGXkp9RpEzrTI .activation2{fill:#f4f4f4;stroke:#666;}#mermaid-svg-QgAUGXkp9RpEzrTI .actorPopupMenu{position:absolute;}#mermaid-svg-QgAUGXkp9RpEzrTI .actorPopupMenuPanel{position:absolute;fill:#ECECFF;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2);filter:drop-shadow(3px 5px 2px rgb(0 0 0 / 0.4));}#mermaid-svg-QgAUGXkp9RpEzrTI .actor-man line{stroke:hsl(259.6261682243, 59.7765363128%, 87.9019607843%);fill:#ECECFF;}#mermaid-svg-QgAUGXkp9RpEzrTI .actor-man circle,#mermaid-svg-QgAUGXkp9RpEzrTI line{stroke:hsl(259.6261682243, 59.7765363128%, 87.9019607843%);fill:#ECECFF;stroke-width:2px;}#mermaid-svg-QgAUGXkp9RpEzrTI :root{–mermaid-font-family:\”trebuchet ms\”,verdana,arial,sans-serif;}角色不像、帧间距太小动作僵硬，缺少细节画风对了，但背景不绿基本满意，表情略显呆搞定！57帧完美精灵图我第1轮：发需求 + 参考照片生成结果 ❌第2轮：调整角色一致性描述生成结果 ❌第3轮：细化动作描述 + 帧数调整生成结果 ⚠️第4轮：强调绿幕 + 无阴影约束生成结果 ✅第5轮：微调表情描述终版 ✅我

每一轮遇到的具体问题：

最难调的是第 3 轮——AI 似乎天生喜欢给背景加光影，我明确说了"纯绿"、“无阴影”，它还是偷偷给角色脚下画了投影。最后把 no floor 加上才彻底解决。

[!NOTE] 经验
跟 AI 沟通提示词，和跟人沟通需求是一样的——越精确的边界条件，越少出意外。 不要指望 AI “理解你的意图”，而是要把每个约束写成"不能做什么"。

五、Codex 配置：精灵图拿到后怎么塞进桌宠

图生成好了，但怎么让它变成桌宠？这一步我在 Codex（Trae IDE）里问到的。

5.1 核心问题

拿到精灵图后，我遇到两个问题：

5.2 Codex 的回答

把精灵图和截图发给 Codex，它告诉我：

精灵图要求：

• 所有帧排列在一张横向长图上（已经满足了）
• 每帧尺寸保持一致（我用 PS 做了统一裁剪）
• 背景透明或纯绿（选绿幕生成，后期去背）

配置方式：

• Codex 桌宠的精灵图通过 sprite 配置项指定
• 需要告诉 Codex：精灵图路径、每帧宽高、总帧数、动作分组
• 配置格式一般是 JSON 或 YAML，定义每个动作对应哪些帧序号

举个例子，配置大致长这样：

{
"sprite": "path/to/your-sprite.png",
"frameWidth": 128,
"frameHeight": 128,
"totalFrames": 57,
"animations": {
"idle": { "frames": [0,1,2,3,4,5], "loop": true },
"coding": { "frames": [6,7,8,9,10,11], "loop": true },
"bugfix": { "frames": [12,13,14,15,16,17], "loop": true },
"error": { "frames": [18,19,20,21,22,23,24,25], "loop": false },
"loading": { "frames": [26,27,28,29,30,31], "loop": true },
"celebrate": { "frames": [32,33,34,35,36], "loop": false },
"peek": { "frames": [37,38,39,40,41,42,43,44], "loop": true },
"sleep": { "frames": [45,46,47,48], "loop": true },
"supervise": { "frames": [49,50,51,52,53,54,55,56], "loop": true }
}
}

5.3 实际操作流程

从图到桌宠，完整链条是这样的：

#mermaid-svg-nemmBjzPKBXtM0ND{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-nemmBjzPKBXtM0ND .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-nemmBjzPKBXtM0ND .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-nemmBjzPKBXtM0ND .error-icon{fill:#552222;}#mermaid-svg-nemmBjzPKBXtM0ND .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-nemmBjzPKBXtM0ND .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-nemmBjzPKBXtM0ND .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-nemmBjzPKBXtM0ND .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-nemmBjzPKBXtM0ND .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-nemmBjzPKBXtM0ND .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-nemmBjzPKBXtM0ND .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-nemmBjzPKBXtM0ND .marker{fill:#333333;stroke:#333333;}#mermaid-svg-nemmBjzPKBXtM0ND .marker.cross{stroke:#333333;}#mermaid-svg-nemmBjzPKBXtM0ND svg{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-nemmBjzPKBXtM0ND p{margin:0;}#mermaid-svg-nemmBjzPKBXtM0ND .label{font-family:\”trebuchet ms\”,verdana,arial,sans-serif;color:#333;}#mermaid-svg-nemmBjzPKBXtM0ND .cluster-label text{fill:#333;}#mermaid-svg-nemmBjzPKBXtM0ND .cluster-label span{color:#333;}#mermaid-svg-nemmBjzPKBXtM0ND .cluster-label span p{background-color:transparent;}#mermaid-svg-nemmBjzPKBXtM0ND .label text,#mermaid-svg-nemmBjzPKBXtM0ND span{fill:#333;color:#333;}#mermaid-svg-nemmBjzPKBXtM0ND .node rect,#mermaid-svg-nemmBjzPKBXtM0ND .node circle,#mermaid-svg-nemmBjzPKBXtM0ND .node ellipse,#mermaid-svg-nemmBjzPKBXtM0ND .node polygon,#mermaid-svg-nemmBjzPKBXtM0ND .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-nemmBjzPKBXtM0ND .rough-node .label text,#mermaid-svg-nemmBjzPKBXtM0ND .node .label text,#mermaid-svg-nemmBjzPKBXtM0ND .image-shape .label,#mermaid-svg-nemmBjzPKBXtM0ND .icon-shape .label{text-anchor:middle;}#mermaid-svg-nemmBjzPKBXtM0ND .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-nemmBjzPKBXtM0ND .rough-node .label,#mermaid-svg-nemmBjzPKBXtM0ND .node .label,#mermaid-svg-nemmBjzPKBXtM0ND .image-shape .label,#mermaid-svg-nemmBjzPKBXtM0ND .icon-shape .label{text-align:center;}#mermaid-svg-nemmBjzPKBXtM0ND .node.clickable{cursor:pointer;}#mermaid-svg-nemmBjzPKBXtM0ND .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-nemmBjzPKBXtM0ND .arrowheadPath{fill:#333333;}#mermaid-svg-nemmBjzPKBXtM0ND .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-nemmBjzPKBXtM0ND .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-nemmBjzPKBXtM0ND .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-nemmBjzPKBXtM0ND .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-nemmBjzPKBXtM0ND .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-nemmBjzPKBXtM0ND .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-nemmBjzPKBXtM0ND .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-nemmBjzPKBXtM0ND .cluster text{fill:#333;}#mermaid-svg-nemmBjzPKBXtM0ND .cluster span{color:#333;}#mermaid-svg-nemmBjzPKBXtM0ND div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:\”trebuchet ms\”,verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-nemmBjzPKBXtM0ND .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-nemmBjzPKBXtM0ND rect.text{fill:none;stroke-width:0;}#mermaid-svg-nemmBjzPKBXtM0ND .icon-shape,#mermaid-svg-nemmBjzPKBXtM0ND .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-nemmBjzPKBXtM0ND .icon-shape p,#mermaid-svg-nemmBjzPKBXtM0ND .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-nemmBjzPKBXtM0ND .icon-shape .label rect,#mermaid-svg-nemmBjzPKBXtM0ND .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-nemmBjzPKBXtM0ND .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-nemmBjzPKBXtM0ND .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-nemmBjzPKBXtM0ND :root{–mermaid-font-family:\”trebuchet ms\”,verdana,arial,sans-serif;}

豆包生成精灵图57帧横版 + 绿幕背景

去背处理绿幕 → 透明 PNG

测量每帧尺寸等分裁剪

编写配置 JSON帧序号 → 动作映射

放到 Codex 配置目录

重启桌宠 ✓

具体步骤：

[!TIP] 提示
如果你不确定配置文件的存放路径，直接在 Codex（Trae IDE）里问 AI——把精灵图发给它，说"帮我配成桌宠"，它会告诉你具体怎么放。

六、完整提示词模板分享（可直接用）

下面是我的完整提示词，把 [参考照片] 换成你的照片，直接把这段复制给豆包/Midjourney 就行。

Generate a horizontal sprite sheet for a Codex desktop pet, in chibi anime style.

Character:

– Cute Q‑version (chibi) of the person in the reference image
– Maintain all key features: same hairstyle and hair color, face expression style,
clothing style, accessories, and overall vibe
– The character must be exactly the same person across all frames

Actions (each on the same horizontal strip, evenly spaced,
no grid lines, no frame numbers, no borders):

1. Idle blink (6 frames): standing naturally, gently blinking,
occasionally tilting head slightly, relaxed and cute expression.

2. Coding (6 frames): sitting or kneeling, holding a small keyboard
or mini computer, typing rapidly, with a few code symbols floating nearby
like @, </>, ;, :, etc.

3. Bug fixing (6 frames): holding a small wrench, seriously repairing a red bug icon,
with slight motion lines, final frame shows a satisfied smile.

4. Error display (8 frames): holding a small sign that says "ERROR",
expression helpless or awkward, slight arm movements,
one frame has eyes closed looking frustrated.

5. Loading wait (6 frames): sitting while holding a horizontal progress bar
that gradually fills up, patient waiting expression, occasional blinks.

6. Celebration complete (5 frames): jumping happily with both arms raised,
colorful confetti around, holding or next to a progress bar showing 100%,
finally landing back on the ground.

7. Peeking at screen (8 frames): peeking half‑body from behind
the edge of a vertical window, curious expression,
slight lean‑in and lean‑out motion, one frame with a blink.

8. Sleepy rest (4 frames): lying on a small white pillow, eyes closed,
slight breathing motion, with "ZZZ" floating nearby.

9. Supervising work (8 frames): standing at the edge of the desktop,
hands on hips, serious but cute expression,
one frame pointing forward, one frame blinking.

Layout:

– All frames arranged in one single horizontal strip
– Each frame shows the same character performing the action with only minor variations
– No crop on hair, head, hands, feet, props, or body
– Enough spacing between frames so they do not overlap

Art style:

– Chibi Q‑version anime style, clear thick outlines, flat cel‑shading,
cute and clear expressions, well‑defined body contours,
suitable for scaling down as a desktop pet
– High character consistency across all frames

Background:

– Solid green screen color: #00ff00 (pure green)
– Entire background must be this solid green only
– No shadows, no gradients, no floor, no textures, no glow, no reflections
– Do NOT use #00ff00 anywhere in the character or props

使用说明：

七、写在最后：把女朋友做成桌宠是什么体验？

说两个真实感受：

第一，她看到后的反应。 我第一次把桌宠跑起来的时候，女朋友在旁边看着，说"诶，这真的是我？"然后她就盯着屏幕看了 5 分钟，看着自己的 Q 版小人敲代码、修 Bug、偷看屏幕……那 5 分钟里我没敢告诉她，其实我也就调了 5 轮提示词。

第二，这件事让我发现一件事—— AI 生成已经不是"能不能"的问题，而是**“怎么精确控制”**的问题。同样一个需求，提示词写得好不好，结果天差地别。我踩过的这 5 个坑，你看了这篇文章就能避开。

工具的价值，不在于它有多强，而在于它能帮上多少忙。

项目本身不涉及代码，整个流程全靠提示词驱动。如果你也想要一个专属桌宠，把提示词复制走，换张照片就行。

八、部分动作展示：

我是 magicCzc，一个把 AI 当玩具、把女朋友宠上天的运维开发工程师。
GitHub：https://github.com/magicCzc