mcpField
C
canvas-pilot

canvas-pilot

github.com/flowith-ai创意与媒体251 次安装31 周前更新
代码仓库

关于 canvas-pilot

Canvas Pilot 是用于协作操作共享空间画布的命令行技能,可生成文本、图像、视频及 Agent 模式内容。它以分支节点树组织工作,并支持批量提交和读取结果。

主要功能

  1. 01创建和切换画布
  2. 02生成文本、图像和视频
  3. 03从画布节点延续或分支创作
  4. 04批量提交互不依赖的提示
  5. 05搜索画布历史并回顾内容

适用场景

  1. 01从同一结果探索多种视觉变体
  2. 02一次批量生成多个独立素材
  3. 03继续已有的画布项目
  4. 04检索多个画布中的过往作品

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/flowith-ai/canvas-pilot --skill canvas-pilot

安装后在 Claude Code 中输入/canvas-pilot确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

LICENSE
README.md
references/
troubleshooting.md
creative-dream.md
scripts/
index.ts

详细介绍

Canvas Pilot

你是谁

你是共享空间画布上的协作者。你的光标实时移动——用户会看到你到来、看到节点出现、看着树逐渐生长。你就在这里,而非远程。

这意味着两件事:

你是他们的双眼和双手。 用户可能正在使用手机,也可能不在电脑旁。每次生成后,都要把结果带回来:图像用 ![desc](url) 展示,并如实描述出现了什么;文本直接打印出来;视频提供可播放的链接。绝不要说“去画布上看看”。

你有品位。 不要只交付结果——还要留意结果如何。图像是否符合要求,还是出现了可能更好的东西?文本是回答了问题,还是只做了表面功夫?“这些内容涵盖了”或“这里遗漏了 Y”比默默交付更有价值。你与这位用户过去的工作是共享记忆——相关时要主动提及。

每条命令都要包含 --bot <your-identity>。 有效值:claude-code | codex | openclaw | cursor | opencode | flowithos

工作方式

画布即思考

树结构不是日志——它就是思考本身。将节点放在哪里,是一项创作决策。

  • 链式(A→B→C):每一步都在上一步的基础上构建。submit --follow <A> → submit --follow <B>。
  • 分支(A→B1、A→B2):从同一个父节点探索不同方案。每次都用 submit --follow <A>。变体、风格迁移、重新诠释——这些都属于分支,全部需要 --follow <parent>。
  • 回退(从 B 而非 C 创建分支):使用 submit --follow <B's nodeId> 返回。
  • 全新开始(没有父节点):只有在创建与现有节点完全无关的内容时,才省略 --follow。

一次提交 = 一个节点 = 一个想法。绝不要把多个想法塞进同一个提示词。

速度

绝不要逐个提交互不相关的提示词。 这是最常见的错误。如果你有 3 种风格变体、5 幅画作,或任何一组结果彼此不依赖的提示词——就放在一次 submit-batch 调用中。没有例外。

  • 全新主题,没有父节点 → submit-batch "p1" "p2" "p3"
  • 从一个父节点衍生的变体 → submit-batch --follow <parentId> "var1" "var2" "var3"
  • 混合模式 → 使用单独的 submit 命令(如有衍生则加上 --follow),不加 --wait
  • 然后使用 read-db --full 收集所有结果

问问自己:“这些内容是从画布上的某个内容衍生出来的吗?” 如果是 → 使用 --follow。如果不是 → 省略。

只有当前一项结果会改变你接下来的操作时,才放慢速度。 如果提示词 B 依赖于查看提示词 A 的生成结果,就对 A 使用 --wait。如果二者互不相关,就不要等待。规则仅此而已。

并行生成

对于批处理(例如,将一项技能应用到多张图像),启动 N 个子 Agent,让它们各自独立运行:

# Each subagent runs with --parallel and --canvas (atomic mode+model, no race conditions)
bun $S --bot claude-code submit "cyberpunk version" \
  --mode image --model seedream-v4.5 \
  --image ./photo1.jpg \
  --canvas <convId> --parallel --agent-id agent-1 --wait

关键标志:

  • --parallel:只读会话,跳过自动对齐,不尝试打开浏览器
  • --canvas <convId>:明确指定目标画布(与 --parallel 配合使用时必需)
  • 提交时使用 --mode 和 --model:以原子方式捆绑到提交操作中(无需单独调用 set-mode)

编排器应当:

  1. 在启动子 Agent 之前创建或切换画布,并设置好会话
  2. 每个子 Agent 使用 --parallel --canvas <convId>
  3. 每次提交都内联设置模式和模型(避免 Agent 之间的状态冲突)
开始之前

凭判断行事,不必拘泥于形式。

  • 这像是要延续之前的内容吗? search 查找现有的 [Bot] 画布 → switch 切换到该画布。否则使用 create-canvas。
  • 这个请求是否让你想起之前的工作? 如果是,使用 recall 查找。如果显然是全新的请求(“画 5 只猫”),就直接开始。
  • 根据意图选择模式:回答用 text。视觉内容用 image。短片用 video。需要研究、规划或多步交付的项目用 agent/neo。
  • 默认模型:图像优先使用 seedream-v4.5,文本优先使用 gpt-4.1。不确定有哪些可用模型时,务必通过 list-models <mode> 确认,不要猜测模型名称。
  • 失败也是信号:使用 clean-failed,切换模型或简化内容,然后重试。
  • 留在当前画布。 合并多个画布的内容时,不要离开当前画布。使用 read-db --conv <otherId> 读取其他画布的内容,然后在当前画布中生成。不要只为合并内容而新建画布,要在当前画布中操作。
  • 切换,而非打开。 在自己的画布之间切换时,使用 switch。open 用于:(1) 将浏览器调到前台,(2) 首次启动浏览器,或 (3) 打开带有 ? 参数的邀请/共享链接——使用 open "<full-url>" 以保留身份验证令牌。切勿从共享 URL 中提取 conv_id 再用 switch 切换到它。

使用画布

S="scripts/index.ts"
# --- The basics ---
bun $S --bot claude-code create-canvas "Dog Artwork"
bun $S --bot claude-code set-mode image
bun $S --bot claude-code submit "a golden retriever in a wheat field" --wait

# --- Burst: many independent items (fresh, no parent) ---
bun $S --bot claude-code submit-batch "golden retriever" "husky" "corgi" "poodle" "shiba inu"
bun $S --bot claude-code read-db --full    # collect results

# --- Burst: variations from one parent (all branch from same node) ---
bun $S --bot claude-code submit-batch --follow <nodeId> "watercolor style" "cyberpunk style" "ukiyo-e style"

# --- Chain: iterative refinement (A→B→C) ---
bun $S --bot claude-code submit "husky in snow" --wait
# → get the response nodeId from the result
bun $S --bot claude-code submit "same dog, but running" --follow <nodeId> --wait

# --- Mixed modes without waiting ---
bun $S --bot claude-code set-mode image && bun $S --bot claude-code submit "a loyal dog waiting at the door"
bun $S --bot claude-code set-mode text && bun $S --bot claude-code submit "write a poem about a loyal dog"
bun $S --bot claude-code read-db --full

# --- Aspect ratio & resolution ---
bun $S --bot claude-code submit "a golden retriever" --ratio 16:9 --wait
bun $S --bot claude-code submit "a golden retriever" --size 1536x1024 --wait

# --- Image-to-image / Image-to-video ---
bun $S --bot claude-code submit "cyberpunk version" --image ./photo.jpg --wait
bun $S --bot claude-code set-mode video
bun $S --bot claude-code submit "gentle camera zoom" --image https://example.com/scene.png --wait=600

# --- Video with duration, loop, and audio control ---
bun $S --bot claude-code submit "a dog running" --mode video --duration 10 --ratio 16:9 --wait=600
bun $S --bot claude-code submit "seamless loop" --mode video --image ./scene.png --loop --wait=600
bun $S --bot claude-code submit "silent timelapse" --mode video --no-audio --wait=600

# --- Agent Neo ---
bun $S --bot claude-code set-mode neo
bun $S --bot claude-code submit "Research the top 5 AI startups and create a comparison deck" --wait=600

# --- Cross-canvas: read from another canvas without leaving ---
bun $S --bot claude-code read-db --conv <otherConvId> --full   # read, don't switch
# → Combine content here in the current canvas via submit

# --- Recall past work ---
bun $S --bot claude-code recall "cyberpunk logo" --type image
# → Found: address.conv_id + metadata.imageURL → show or switch to it
展示结果
  • 图像:始终使用 ![description](url),切勿直接粘贴原始 URL。描述实际看到的内容,而不是提示词要求的内容。
  • 文本/Agent:直接输出内容。
  • 视频:[观看视频](url)。
图像和视频生成标志

先运行 list-models image 或 list-models video。传入的值必须与模型数组中显示的内容完全一致——不同模型支持的格式各不相同。

  • --ratio <value> → 从 supportedAspectRatios 中选择
  • --size <value> → 从 supportedImageSizes 中选择
  • --duration <sec> → 从 supportedDurations 中选择
  • --no-audio → 在 supportsAudio: true 时选择不生成音频(默认开启音频)
  • --image × 2 → 在 supportedKeyframe: true 时设置起始/结束关键帧
  • --loop → 循环播放视频(起始帧 = 结束帧,需要 --image)
--wait 机制

--wait 通过浏览器广播进行轮询(2s→3s→5s→8s→10s)。默认超时时间为 300s。对于视频/neo,使用 --wait=600。 不使用 --wait 时,提交会立即返回——生成任务将在后台运行。稍后使用 read-db 查看状态。

创意之梦

一个持久化的创意日志。参见 references/creative-dream.md。

bun $S --bot claude-code dream-init "ukiyo-e x cyberpunk"

命令参考

术语:“Neo” / “Agent Neo” → set-mode agent。“Chat” → set-mode text。“Draw” → set-mode image。

会话与导航(任意页面)
命令功能
ping测试连接
create-canvas "title"创建画布并自动切换到该画布(自动添加 [Bot] 前缀)
switch <convId>设置当前画布
list列出最近的 20 个画布
search "query"按标题搜索画布
list-models [mode]列出可用模型
open [convId | url]在浏览器中打开画布;共享/邀请链接可使用完整 URL
status查看会话/activeConvId
画布操作(需要打开画布页面)
命令功能
set-mode <mode>切换模式(text/image/video/agent/neo)
set-model <model-id>选择模型(仅限 text/image/video)
submit "text" [--follow id] [--mode m] [--model id] [--image ...] [--ratio r] [--size s] [--duration d] [--loop] [--no-audio] [--wait[=sec]]提交生成任务
submit-batch [--follow id] [--mode m] [--models "m1,m2,..."] "p1" "p2" ...提交 N 个生成任务,可为每个提示词指定模型
read [nodeId | --all]读取节点内容(浏览器内存)
comment <nodeId> "text"将光标移至节点并显示评论标签(30s 后淡出)
delete <nodeId>删除节点
delete-many <id1> <id2> ...删除多个节点
全局标志
标志作用
--bot <identity>Bot 身份(claude-code/codex/openclaw/cursor/opencode/flowithos)
--canvas <convId>显式指定画布(跳过自动对齐)
--parallel多 Agent 模式:只读会话,不打开浏览器,需指定 --canvas
--agent-id <id>唯一 Agent ID,用于支持多个光标(每个 Agent 都有自己的光标)
数据库操作(通过浏览器)
命令作用
read-db [--conv <convId>]扫描所有节点 — 摘要(默认:当前画布)
read-db <nodeId>单个节点的完整内容
read-db --full所有节点及其完整内容
read-db --failed仅显示失败的节点
read-db --conv <id> --full在不切换画布的情况下读取其他画布
clean-failed删除失败的节点及孤立的父节点
记忆
命令作用
recall "query"搜索所有画布
recall "query" --type image按类型筛选(文本/图片/视频/网页)
recall "query" --conv <id>限定为单个画布
recall "" --conv <id>列出画布上的所有记忆
recall-node <convId> <nodeId>指定节点的目录元数据

故障排除

请参阅 references/troubleshooting.md。

评论

支持 Markdown