解锁 infinite-canvas 的 Agent：如何让 AI 助手自动在无限画布上生成与编排 + Skill 编写指南-育师

人工智能
AI 应用
大模型
媒体生成
后端
前端

【免费下载链接】infinite-canvas

开源 AI 创作工作台，集成无限画布、Agent、导演台、全景图、AI 生图、图片编辑、视频生成、画布编排等，兼容 OpenAI 接口及多种 API 服务

项目地址：https://gitcode.com/gh_mirrors/infinite/infinite-canvas

infinite-canvas 是一款开源 AI 创作工作台，它的画布 Agent 可以让 AI 助手直接读懂你的无限画布：自动创建节点、建立连线、整理分组，并一键提交 AI 生图、视频与音频生成任务。配合可自定义的 Skill（技能）机制，你还能把"剧本拆解、宣传片制作"等套路沉淀成可复用的创作流程。本文带你快速上手画布 Agent，并给出一份面向新手的 Skill 编写指南。

一、画布 Agent 能做什么？

打开 infinite-canvas 的任意画布，右侧就有 AI 助手面板。它不只是"聊天机器人"，而是一个能动手操作画布的 Agent：

理解画布现状：读取画布摘要、选中节点、上下游连线、生成配置与任务进度；
自动编排：创建文本/图片/视频/音频节点、建立或断开连线、把一组节点放进分组、整理画布布局；
自动提交生成：调用generate_image、edit_image、generate_video、generate_audio等工具，把提示词和参考图按连线关系传给模型；
状态可控：生成任务是loading还是会失败，Agent 只按真实返回结果推进，不会"假装成功"。

全部工具定义集中在 canvas-agent-tools.ts/canvas/agent/canvas-agent-tools.ts)，公共执行规则（事实来源、连线与分组语义、编号规则、错误处理）写在 skills/core.ts/canvas/agent/skills/core.ts) 中，值得进阶阅读。

场景	你会对 Agent 说什么
文生图	"根据选中的文本节点，生成一张角色海报"
图生视频	"基于这张参考图生成 5 秒的运镜视频"
画布整理	"把角色相关的参考图归到一个分组里"
进度查询	"现在画布上哪些任务还在生成？"

💡 提示：Agent 会优先读取你当前选中的节点及其上游节点作为参考，养成"先选中、再下指令"的习惯，效果最稳定。

二、快速上手内置创作 Agent

打开画布项目（画布功能说明见 docs/overview/features.md）；
展开右侧 AI 助手面板，选中想要引用的节点（比如一段提示词文本节点）；
在输入框中描述你的创作目标，例如"把这段文案扩写成 3 个镜头的分镜描述，并为每个镜头生成一张关键帧图片"；
Agent 会自动创建文本节点 → 生成配置节点 → 图片节点，并按真实依赖关系连线。

面板输入框底部还有两项实用配置：

自动生成开关：默认关闭时，Agent 只创建并配置好媒体节点与连线，不直接烧积分；打开后会立即提交生成任务；
文本接口切换：可在 Chat 与 Responses 两种文本接口之间切换，模型能力不同时可据此适配。

三、进阶：接入 Codex，让外部 Agent 也操作画布

除了内置创作 Agent，infinite-canvas 还支持接入 OpenAI Codex 作为外部大脑。画布内 Agent 与 Codex 两种模式复用同一套输入框和历史管理，切换互不丢失上下文。

第一步：启动本地 Agent 服务（需 Node.js 22+，无需克隆仓库）：

npx -y @tigerowo/canvas-agent@latest

首次启动会生成连接 Token 并打印Local URL与Connect token，默认地址为http://127.0.0.1:3210。Token 保存在~/.infinite-canvas/codex-agent.json，之后启动自动复用。

第二步：登录 Codex（已有登录态可跳过）：

npx -y @openai/codex@0.159.2 login

第三步：在画布里连接。切到 Codex 模式后按页面提示连接，即可选择账号可用模型与推理强度，支持流式回复、停止任务、授权确认等完整交互；未连接时页面会直接展示连接教程。

外部终端直连：也可以不经过插件，直接把画布注册为 Codex 的 MCP 服务：

codex mcp add infinite-canvas -- npx -y @tigerowo/canvas-agent@latest mcp

注册后在 Codex 对话里说"帮我打开并连接到 Infinite Canvas"即可。插件形态的自动连接与 Skill 加载细节见 canvas-agent/README.md，自动打开画布的行为规则见 open-canvas/SKILL.md。

四、Skill 编写指南

Skill 就是给 Agent 的"岗位说明书"：一段描述创作方式、提示词结构和输出格式的 Markdown 文本。选中 Skill 后，Agent 会严格按它的流程执行，不再套用内置的默认创作路由。

4.1 两类 Skill 与使用规则

系统 Skill（通用）：随项目内置，由管理员在后台维护，首次启动数据库时自动导入（导入逻辑见 agent_skill_defaults.go），支持携带目录和附属 Markdown/文本文件；
用户 Skill（我的）：自己导入或手写，未登录存在浏览器本地，登录后按账号隔离保存；单个 Skill 内容上限20000 字。

在输入框左侧点击扳手图标即可打开 Skill 选择器（组件见 canvas-agent-skill-popover.tsx/canvas/components/canvas-agent-skill-popover.tsx)），最多同时选择 5 个；重新选择会整体替换当前激活的 Skill 组。

项目自带了多个视频创作系统 Skill，是现成的"范文"，例如：

h3-brand-promo-video-generator.md：品牌宣传短片生成器，从素材核验、品牌事实表到故事脊柱、节拍规划；
h3-game-intro-generator/SKILL.md：合作游戏开场动画生成器，先出确认首图、用户批准后才生成视频；
其余还有产品广告、纸艺解说、MV 字幕等模板，可对照着写自己的版本。

4.2 一个 Skill 长什么样

用户 Skill 建议写成这样的结构（纯 Markdown，正文即"指令"）：

# 产品图变体生成 ## 目标 基于用户选中的产品图，生成 3 个角度一致的变体。 ## 步骤 1. 读取选中图片节点，确认主体是产品图。 2. 用 generate_image 生成 3 张变体：正面、45 度侧视、俯视。 3. 每张提示词都要引用"图片1"并保留产品外观细节。 4. 全部成功后，把 3 张结果放入一个分组节点。 ## 输出格式 完成后用一句话汇报：已生成 N 张变体并归组。

要点清单：

写清目标与适用/不适用场景，让 Agent 知道什么时候该用它；
步骤要可执行，引用画布已有工具名（generate_image、create_text_node等），不要要求画布不具备的能力（如剪辑、混音）；
明确输出格式，例如"完成后只汇报一句话"；
涉及参考图时说明编号语义：sourceNodeIds中第一张图片就是"图片1"，依次类推；
用户 Skill 为单文件导入：选择器"我的"页签点击"导入"，上传.md/.txt即可；系统 Skill 才能引用references/之类的附属文件（通过read_skill_file按相对路径读取）。

4.3 导入与管理

未登录：点击"我的"页签的导入按钮，选择本地 Markdown 文件，立即生效并存浏览器本地；
登录后：Skill 按账号保存，可在弹窗中编辑（名称、描述、封面、内容）或删除；
管理后台支持系统 Skill 的新增、编辑、启用、排序与附属文件管理。

五、实用技巧与常见问题

连线即依赖：Agent 建立连线时遵循真实生产关系（剧本 → 镜头 → 分镜 → 视频），不会为了"归属"把所有节点串成链；分组只表达集合关系。
并行与串行：互不依赖的多张图/多条视频可在同一轮并行提交；依赖前一个结果的步骤会严格串行等待。
删除必须明说：只有你明确要求时，Agent 才会删除节点或连线。
失败不硬闯：model_not_configured提示你去全局配置模型；unsupported_duration时它会按模型支持的秒数让你重选，不会无限重试。
刷新可恢复：Agent 用set_agent_state保存创作阶段与已确认方案，刷新页面后会从真实节点和任务状态恢复，不会重复提交同一任务。
额度保护：关闭"自动生成"开关时，Agent 只搭好节点与连线，由你手动触发生成，适合先审方案再烧积分。