CodeIsland Agent Room:预览图要讲清什么
About 5 min read
多终端、多模型融进同一协作房间——下一版概念图该强化路由、状态、权限与最终产物。
Contents · 6 sections · jump to a heading
CodeIsland 风格的 Agent Room 概念图需要让人一眼看懂:
多个独立终端 session 与不同 AI 模型,融进同一个协作房间。Agent 可互传消息、派发任务、回调、调用工具、请求权限,并围绕共同任务交付结果。
它在产品层表达 multi-agent 协作,在工程层呈现 Agent Harness:房间把编排、路由、权限与交付投影到 UI 上。
- 暗色终端 / CodeIsland-like 视觉
ROOM模式与共享任务(如 Fix login bug)- 多角色:Planner / Backend / QA / Reviewer
- 多模型来源:Claude、Codex、Qwen、Gemini
- 进度条与工具调用片段
- 底部
@agent输入
这些元素已经能说明「有多个 agent 在干活」,但观众仍可能把它读成聚合日志面板。下一版需要把 Agent 之间的融合与互操作画出来。
- 消息路由 —— 卡片标题写清
Planner → Backend, QA,别只剩统一日志流。 - 终端来源 —— 如
Codex · Ghostty #api,强调「真终端融合」,不是虚拟群聊。 - 有意义的状态 —— 用
editing · patch ready替代全员live。 - Agent Bus —— 左侧列表与时间线之间的轻量路由视觉。
- 更像刘海浮层 —— 减弱普通 App 窗口感,保留 notch、等宽字、霓虹绿、像素 mascot。
- 权限请求 ——
Approve / Deny / Modify,人类可介入。 - 具体输入框 —— 如
@reviewer focus on security risk...。 - 最终 Artifact —— Diff、测试、review、可交付文件列表,闭环。
工具调用片段(tool.search、tool.edit、$ pnpm test)应呈现真实 tool use 轨迹。权限卡对应 harness 的执行门:模型可以请求,人类与策略决定是否放行。
用户应立刻读出:
- CodeIsland-like 刘海浮层
- 处于
ROOM模式 - 多模型 + 多终端已连接
- 围绕同一任务协作
- 消息在 Agent 间路由
- 人类可
@插话与审批 - 最终有可交付结果
| 分支 | 强调 |
|---|---|
| 更原生 CodeIsland | 黑空间、notch、terminal badge、像素 mascot |
| 更产品 Dashboard | 左列表 / 中时间线 / 右产物面板 |
| 更系统浮层 | 桌面上浮、极简 chrome、高信息密度 |
选型取决于用途:对内对齐产品叙事时,原生 CodeIsland 身份优先;对外路演讲「多 agent 如何交付」时,Dashboard 更清晰。同一信息架构可以出两套皮肤,但路由 / 状态 / 权限 / 产物四件套不要丢。
这份笔记用可视化表达 multi-agent 协作的产品语义:共享任务、消息总线、工具调用、权限门和交付物。设计 Agent Room 或类似 harness 前端时,可以用上述清单验收信息架构,再调整颜色与圆角。
若你在设计 Coding Agent 的「房间模式」,优先保证信息架构正确,再抠霓虹与像素:用户先要懂 谁在跟谁说话、在哪个终端、卡在哪一步、人类能否插手、最后交付什么。
- 用强化版中文提示词出下一张图。
- 与基准图并排:路由与终端融合是否一眼可见。
- 不够则单点迭代(只加 bus,或只加权限卡),避免一次改十处。
- 定稿后把图回链到产品笔记,作为 Agent Room 概念锚点。