Flowzap

FlowZap Code DSL — 官方语法与示例

FlowZap Code 是一种简单的领域专用语言（DSL），用于协作式业务流程绘制和工作流自动化。编写自然易读的代码，即可创建流程图、泳道图、时序图和架构图。无需技术技能！

• 网站： https://flowzap.xyz
• 语法指南： flowzap.xyz/flowzap-code
• AI 指南： flowzap.xyz/flowzap-code-guidelines.md
• 模板： flowzap.xyz/templates — 250 多个可直接使用的工作流、时序图和架构图模板
• MCP 服务： flowzap.xyz/docs/mcp — 适用于 Claude Desktop、Cursor、Windsurf 及另外 8 款编码工具
• Agent 技能： skills.sh/flowzap-xyz/flowzap-mcp/flowzap-diagrams
• npm： flowzap-mcp

---

⚡ 快速示例：婚礼筹备流程

couple { # couple
  n1: circle label:"Start Planning"
  n2: rectangle label:"Define Budget & Priorities"
  n3: rectangle label:"Review Proposals"
  n4: rectangle label:"Make Final Decisions"
  n5: circle label:"Wedding Day!"
  n1.handle(right) -> n2.handle(left)
  n2.handle(right) -> n3.handle(left)
  n3.handle(right) -> n4.handle(left)
  n4.handle(right) -> n5.handle(left)
  n2.handle(bottom) -> planner.n6.handle(top) [label="Hires"]
}

planner { # planner
  n6: rectangle label:"Initial Consultation"
  n7: rectangle label:"Create Planning Timeline"
  n8: rectangle label:"Coordinate Vendors"
  n9: rectangle label:"Final Walkthrough"
  n6.handle(right) -> n7.handle(left)
  n7.handle(right) -> n8.handle(left)
  n8.handle(right) -> n9.handle(left)
  n7.handle(bottom) -> vendors.n10.handle(top) [label="Requests"]
}

vendors { # vendors
  n10: rectangle label:"Receive Requirements"
  n11: diamond label:"Available?"
  n12: rectangle label:"Send Proposal"
  n13: rectangle label:"Confirm Booking"
  n10.handle(right) -> n11.handle(left)
  n12.handle(right) -> n13.handle(left)
  n11.handle(right) -> n12.handle(left) [label="No"]
  n11.handle(bottom) -> n12.handle(bottom) [label="Yes"]
  n12.handle(top) -> couple.n3.handle(bottom) [label="Sends"]
}

在 https://flowzap.xyz 创建免费账户。然后将上面的内容粘贴到 FlowZap 工作区，即可在几秒钟内将你的第一个工作流、时序图和架构图可视化。

---

🤝 参与贡献

• Fork 并提交包含新代码示例或建议的拉取请求！
• 针对语法问题或文档修正提交 issue。
• 详情请参阅 CONTRIBUTING.md。

---

📖 文档

• 语法规则 — 包含时序图最佳实践（v1.3.4）
• AI 编码指南 — 为生成 FlowZap Code 的 AI 助手提供说明
• 下载 AI 指南 — 将此文件放入项目的 /docs/ 文件夹，供 AI 编码工具使用
• 模板库 — 250 多个适用于工作流、时序图和架构图的现成模板
• 架构图模板 — 50 个架构图模板（微服务、事件驱动、CQRS、无服务器、Saga 等）
• n8n 工作流 JSON 示例 — 将 FlowZap Code 导出为 n8n JSON
• Make.com Blueprint 示例 — 将 FlowZap Code 导出为 Make.com JSON

博客

• FlowZap 推出 .fz：为时序图和 AI 原生工作流提供真正的代码化图表
• 借助 FlowZap，为氛围编码流程注入强劲动力：将 AI 灵感化为结构化创意
• FlowZap MCP 服务介绍
• FlowZap 图表技能现已上线——了解它为何重要
• 一份代码，三种视图：流程图 + 时序图 + 架构图
• CI/CD 流水线配置的十大工作流

🤖 面向 AI Agent 和 Agent 式浏览器

FlowZap 提供机器可读资源，便于自动发现：

• 语法架构（JSON）： /api/flowzap-code-schema.json
• Well-Known 发现： /.well-known/flowzap-code-schema.json
• 大模型上下文文件： /llms.txt
• 完整的大模型上下文： /llms-full.txt
• AI 指南： /flowzap-code-guidelines.md
• 语法文档： /flowzap-code
• OpenAPI 规范： /.well-known/openapi.json

MCP 服务（v1.3.5）

为任何兼容的编码工具安装 flowzap-mcp npm 包：

{
  "mcpServers": {
    "flowzap": {
      "command": "npx",
      "args": ["-y", "flowzap-mcp"]
    }
  }
}

兼容 11 种编码工具： Claude Desktop、Claude Code、Cursor、Windsurf IDE、OpenAI Codex、Warp Terminal、Zed Editor、Cline（VS Code）、Roo Code（VS Code）、Continue.dev、Sourcegraph Cody。

提供 7 种工具： flowzap_validate、flowzap_create_playground、flowzap_get_syntax、flowzap_export_graph、flowzap_artifact_to_diagram、flowzap_diff、flowzap_apply_change

URL 参数

• 在 /playground/{id} 中使用 ?mode=code 可自动打开代码编辑器对话框
• 在 /playground 中使用 ?code=<base64url> 可从 URL 加载 FlowZap Code（无需 API 调用）

---

训练语料库

如需专为大模型训练打造的、包含 200 多个真实示例的综合数据集，请参阅： flowzap-xyz/sequence-workflows

---

许可证

请参阅 LICENSE。