我是谁 & 遇到什么问题
我是独立开发者，做了一款 macOS 灵动岛工具 TRAE FLOW 参加了创造力大赛，自带桌面宠物功能。痛点：想让用户（包括我自己）能一键生成专属宠物到桌面，并且宠物还能按照TRAE任务状态跟我互动。
我用了 TraeWork 解决了这件事
模式：
Design Code
用了 TraeWork 的 Design 模式（WebP 精灵表生成） + 长上下文（一次性理解 9 行动画映射 + 精灵表尺寸约束 + JSON manifest 结构） + 本地文件写入能力。
在 TRAE FLOW 设置页内置了一个「用 TRAE Work Design 生成宠物」卡片（[MascotSettingsView.swift](file:///Users/telking/web/ccc/trae-flow/TraeFlow/UI/Views/MascotSettingsView.swift#L197)），流程是：
-
点「去 TRAE Work Design 生成」按钮 → 一键激活 TRAE Work CN
-
点「复制提示词」拿到一段写好规格的模板，粘到 Design 对话里
-
上传宠物图片后把模板里的
[宠物ID]/[中文名]/[类型描述]三个占位符换成自己的（比如my-cat/我的小猫/一只橘色像素猫咪，圆脸大眼，尾巴翘起） -
Design 模式按规格生成 1536×1872 的 sprite sheet WebP，自动
mkdir -p并写入~/.traeflow/pets/<id>/spritesheet.webp，同时生成pet.json -
回到 TRAE FLOW，
MascotThemeWatcher（DispatchSource）监听到目录变化，新宠物立刻出现在主题包列表，选中即用
我做出了什么
一条零绘画门槛的自定义宠物工作流——填 3 个字段，2 分钟从想法到一只会在灵动岛上 idle / 跑动 / 招手 / 跳跃 / 沮丧 / 等待 / 工作 / 审视 9 种状态的桌面宠物。
效果展示
提示词参考：
我要创建一个自定义宠物。请按以下要求直接生成并保存文件。
【宠物信息】
宠物名称[在此填写，如 my-cat]
宠物类型描述：按照我发给你的图片生成
背景：透明
【任务 1：生成宠物表图像并保存到文件】
直接生成一张 WebP 格式的宠物表（sprite sheet），并写入到以下路径：
~/.traeflow/pets/[宠物名称]/spritesheet.webp
如果目录不存在，先用 mkdir -p 创建。
精灵表规格（严格遵循）：
- 整图尺寸：1536 × 1872 像素，恰好 8 列 × 9 行
- 每帧大小：192 × 208 像素
- 每行 8 帧，是同一个动画状态的逐帧循环（帧与帧之间有细微差异以形成动画）
- 像素风格，背景透明或纯色填充
9 行状态映射（从上到下，第 0 行为最顶部）：
第 0 行 idle — 宠物原地站立，轻微呼吸起伏（8帧循环）
第 1 行 runRight — 宠物向右跑动的侧面姿态（8帧循环）
第 2 行 runLeft — 宠物向左跑动的侧面姿态，镜像 runRight（8帧循环）
第 3 行 waving — 宠物面向前方打招呼（8帧循环）
第 4 行 jumping — 宠物原地跳跃（8帧循环）
第 5 行 failed — 宠物表现失败/沮丧（8帧循环）
第 6 行 waiting — 宠物表现等待/思考（8帧循环）
第 7 行 running — 宠物工作状态的动态姿态（8帧循环）
第 8 行 review — 宠物凑近屏幕/审视（8帧循环）
【任务 2：创建 pet.json 并保存到文件】
将以下 JSON 写入到文件 ~/.traeflow/pets/[宠物ID]/pet.json，将 [宠物ID]、[中文名]、[描述] 替换为实际值：
{
"id": "[宠物ID]",
"displayName": "[中文名]",
"description": "[描述]",
"kind": "animal",
"frameWidth": 192,
"frameHeight": 208,
"fps": 8,
"animations": {
"idle": { "row": 0, "frames": 8 },
"runRight": { "row": 1, "frames": 8 },
"runLeft": { "row": 2, "frames": 8 },
"waving": { "row": 3, "frames": 8 },
"jumping": { "row": 4, "frames": 8 },
"failed": { "row": 5, "frames": 8 },
"waiting": { "row": 6, "frames": 8 },
"running": { "row": 7, "frames": 8 },
"review": { "row": 8, "frames": 8 }
}
}
完成后告诉我文件已生成，让我去 TraeFlow 刷新选择。