JieGou 一直提供多种方式来检视 workflow:用于快速编辑的步骤清单、用于了解结构的图表,以及用于执行顺序的 DAG 视图。但它们都无法让您以视觉化方式建构——在画布上排列步骤、绘制步骤之间的连接,并查看自动化中的空间关系。
全新的视觉化 workflow 画布改变了这一切。它是一个完整的拖放式 SVG 编辑器,具备缩放、平移、小地图、对齐网格和即时执行视觉化功能。
在画布上建构
画布将每个 workflow 步骤渲染为一个节点。节点依步骤类型以不同颜色区分——recipe 步骤、LLM 步骤、条件分支、回圈、平行群组、审批闸门等,各自拥有独特的视觉识别。
要在步骤之间新增连接,从节点的输出埠(底部)拖曳到另一个节点的输入埠(顶部)。拖曳时,一条蓝色虚线预览线会跟随您的游标移动,当您悬停在有效的放置目标上时,它会高亮显示。在埠上释放即可建立边线。边线以平滑的贝兹曲线渲染在连接的节点之间。
移动节点很简单:点击并拖曳即可。节点会对齐 20 像素的网格,因此布局无需手动对齐即可保持整洁。对齐阈值为 10 像素——离网格线够近时节点会锁定到位,但在需要时您仍然可以自由地精确定位。
导览大型 workflow
小型 workflow 可以在一个画面中显示。正式环境的 workflow 则不行。画布提供了多种导览工具:
缩放 — 滑鼠滚轮(搭配 Ctrl/Cmd)可从 0.15 倍缩放至 2.5 倍,以游标位置为中心。键盘快捷键同样有效:Cmd+0 重设为 1 倍,Cmd+= 放大,Cmd+- 缩小。
平移 — 使用触控板或滑鼠滚轮进行水平和垂直卷动。画布在节点下方平滑移动。
小地图 — 右下角有一个 200x140 像素的概览图,显示完整的 workflow 布局,并用白色矩形标示您目前的检视范围。点击小地图上的任意位置即可立即跳转到该处。
全选 — Cmd+A 选取画布上的所有节点。Escape 取消全选并取消任何进行中的拖曳操作。
即时执行视觉化
画布不仅仅是一个建构工具——它也是正在执行的 workflow 的检视器。
当 workflow 执行时,画布会即时显示执行状态。正在执行的步骤会发光。已完成的步骤显示其状态。失败的步骤会立即可见。您可以在 workflow 执行时,逐步观看自动化流程在图形中流动。
对于使用 Claude 或其他 LLM 的步骤,当您选取正在执行的步骤时,画布底部会出现一个推理覆盖层。它显示模型的思考过程——输出背后的思维链。这对于除错提示词和理解 AI 为何做出特定决策非常有用。
多代理覆盖层
对于使用多个 AI 代理的 workflow——协调者委派给专家、管道在角色专属代理之间传递工作——画布以半透明的边界框和虚线边框显示共享记忆体区域。
每个区域依代理角色以不同颜色标示:协调者为青色、专家为粉色、工作者为绿色。区域标签显示哪些共享变数连接了这些代理。这种视觉化清楚地展示了多代理 workflow 中资料如何在代理之间流动。
画布还会对多代理 workflow 执行循环侦测。如果步骤之间存在循环依赖,受影响的节点会发红光,工具列中会出现一个警告徽章,显示侦测到的循环数量。代理委派中的循环可能导致无限回圈——在设计阶段发现它们比在执行阶段好得多。
网格与埠系统
网格背景使用双层图案:20 像素的点用于精细对齐,100 像素的点用于主要网格线。如果您偏好干净的画布,可以透过工具列切换网格显示。
埠——每个节点上的连接点——半径为 6 像素,点击侦测区域为 12 像素,即使在较低的缩放层级下也容易点击。输入埠位于每个节点的顶部,输出埠位于底部。在建立边线时,当您的游标靠近埠时,它会高亮显示以确认您正在指向正确的连接点。
画布视图与其他模式并列
画布是四种 workflow 检视模式之一,可透过 workflow 详细页面上的分页切换:
- 清单 — 原始的步骤清单,最适合快速编辑个别步骤的配置
- 图表 — 唯读的结构图
- DAG — 有向无环图,显示执行依赖关系
- 画布 — 全新的视觉化编辑器,具备完整的互动功能
四种视图都反映相同的 workflow。在清单视图中编辑步骤的配置,切换到画布视图,即可立即看到变更。画布也可在 workflow 建立流程中使用——当您从自然语言产生 workflow 时,画布会显示产生步骤的预览,让您在储存前重新排列。
可用性
视觉化 workflow 画布适用于 Team 和 Enterprise 方案,与 DAG 执行模式及完整的 workflow 编排功能集一同提供。深入了解 workflow 编排或开始免费试用。