workflow-diagram
使用Mermaid语法自动生成工作流程图
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：workflow-diagram。 它的用途是：使用Mermaid语法自动生成工作流程图 完整的 Skill 内容见：https://321skill.com/skills/workflow-diagram-x-3/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
'请为用户登录流程生成一个Mermaid流程图，包括输入账号密码、验证、成功跳转主页、失败提示错误等步骤。'，它会理解你的描述，生成对应的Mermaid代码。你可以将代码粘贴到GitHub Markdown或Notion等支持Mermaid的平台，立即获得一个清晰的可视化登录流程图，方便团队评审和文档记录。
介绍
这个Skill旨在解决开发者和项目管理者在设计和沟通复杂业务流程时，手动绘制流程图耗时费力且难以维护的问题。它能够根据用户提供的流程描述，自动生成标准的Mermaid流程图代码，直观展示步骤、决策点和状态转换。
使用时，用户只需向AI描述工作流程的步骤、条件分支和状态变化，AI便会生成对应的Mermaid语法代码。用户可以将此代码直接复制到支持Mermaid渲染的Markdown编辑器、文档或代码库中，即可获得清晰的可视化图表。
该Skill特别适合需要频繁梳理和展示业务流程的软件开发人员、产品经理和项目经理。对于撰写技术文档、设计系统架构或进行项目评审的场景，它能极大提升效率。
建议在描述流程时尽量清晰、结构化，明确起始点、结束点以及每个决策的条件。由于生成的图表基于文本代码，可以轻松进行版本控制和后续修改，是文档即代码（Docs as Code）实践的有力工具。
核心特点
与一般图表生成工具不同，它专注于生成标准、可嵌入的Mermaid代码，而非静态图片，这使得生成的流程图易于版本管理、协作修改和自动化集成。同时，它通过自然语言理解直接生成代码，降低了使用Mermaid语法的学习门槛。
注意事项
不适合需要高度定制化视觉样式（如特定颜色、复杂布局）或生成非流程类图表（如类图、时序图）的场景。
常见问题
生成的Mermaid代码可以直接用吗？
是的，生成的代码是标准的Mermaid语法，可直接复制到支持Mermaid的Markdown编辑器或文档平台中渲染出流程图。
能画除了流程图以外的图吗？
这个Skill主要专注于生成工作流/流程图（graph TD或graph LR），对于时序图、类图等其他Mermaid图表类型支持有限。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/workflow-diagram-x-3/raw/index.md 读取 workflow-diagram 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/workflow-diagram-x-3/raw/index.md（查看排版版本）