在人工智能飞速发展的今天，职场中如何高效利用AI工具来提升工作效率成为了许多人关注的焦点。本文将带你深入了解如何结合大模型和Mermaid工具，快速生成各种职场中常用的图表，如流程图、思维导图、甘特图等。产品经理的一项重要技能就是绘制各种工程图，譬如流程图、思维导图、桑基图、用户旅程地图等，在有了大模型之后，用AI绘图更是成为一个大幅提升工作效率的必备技能。我们先看看下面几个案例：用户登录流程图象限图思维导图上面这些，都是使用AI+Mermaid生成的下面我们对这个绘图工具做一个快速学习，尤其是后面的绘图案例，包括语法和绘图效果，可以直接抄作业。一、什么是 Mermaid？Mermaid 是一种用文本语法生成图表的轻量级标记语言。它的理念是：用文字描述图，用渲染引擎生成图形。只要用几行语句，就能生成流程图、时序图、甘特图、状态图、用户旅程图等，非常适合：产品经理整理业务流程开发人员画系统架构图教师或博主制作知识笔记写作、课程、报告中插入可视化逻辑图Mermaid官网：https://mermaid.js.org/推荐一个Mermaid在线编辑器，比官网的好用，可以在电脑打开，使用本文后面的案例进行绘图学习。https://www.lddgo.net/chart/mermaid-chart例如，在 Markdown 文档或微信公众号排版工具（如语雀、Notion、Typora、Obsidian）中，你可以直接这样写：graph TDA[需求提出] –> B[产品设计]B –> C[开发实现]C –> D[测试验收]D –> E[上线运营]即可生成一张漂亮的自上而下流程图。二、Mermaid 基本语法概览1. 图类型定义graph TD语法结构为：graph [方向]方向参数如下：案例：横向参数用LR，表示Left到Right2. 节点定义节点格式如下：记得这些符号都是英文半角。A[方框] B(圆角矩形) C((圆形)) D>旗帜形] E{菱形（判断）}案例：圆角矩形用单括号：(需求提出)，(结束)案例：圆形节点用双括号：((产品设计))菱形：{测试验收}3. 连线语法A –> B 直线箭头 A — B 无箭头连线 A — 文案 –> B 带说明的箭头案例：带说明的箭头可组合：A -.-> B 虚线箭头A ==> B 粗线箭头案例：粗箭头==>4. 子图与分组可以使用 subgraph 来组织流程逻辑块：graph LRsubgraph 产品流程A[需求] –> B[设计]endsubgraph 技术流程C[开发] –> D[测试]endB –> C案例：subgraph组织逻辑块三、实战案例讲解：产品上线流程图我们来一步步画出一个「App产品版本上线」的业务流程图。Step 1：基本框架先确定主干流程：graph TDA[需求提出] –> B[评审通过]B –> C[产品设计]C –> D[开发实现]D –> E[测试验收]E –> F[上线发布]Step 2：加入判断分支假设测试阶段可能「不通过」，那我们就加上条件判断节点：graph TDA[需求提出] –> B[评审通过]B –> C[产品设计]C –> D[开发实现]D –> E{测试是否通过?}E –>|是| F[上线发布]E –>|否| D这样就出现了一个判断循环逻辑。Step 3：添加泳道（子图）如果想区分「产品组」和「技术组」的职责：graph LRsubgraph 产品组A[需求提出] –> B[评审通过] –> C[产品设计]endsubgraph 技术组D[开发实现] –> E{测试是否通过?}E –>|是| F[上线发布]E –>|否| DendC –> DStep 4：优化美观度可以调整方向为 LR（从左到右），让流程更紧凑；并加上带文字的连线说明。graph LRA(需求提出) –评审会–> B[通过]B –> C[产品设计]C –> D[开发实现]D –> E{测试结果}E –>|通过| F(上线发布)E –>|不通过| D最终效果一目了然。样式定义（可局部美化）graph LRA[开始] –> B[处理中]B –> C[结束]style A fill:#8fd3f4,stroke:#333,stroke-width:2pxstyle B fill:#f6f6a6style C fill:#9fe3b4案例：颜色填充四、更多可视化类型除了流程图（flowchart/graph），Mermaid 还能画：案例1：时序图代码：sequenceDiagram用户 ->> 产品经理: 提出需求产品经理 ->> 开发: 提交需求文档开发 ->> 测试: 提交测试版本测试 ->> 用户: 验收版本效果：案例用于展示不同角色之间的消息往来。代码：sequenceDiagramparticipant 用户participant 系统用户 ->> 系统: 提交登录信息系统 –>> 用户: 返回验证结果效果更多语法sequenceDiagramparticipant A as 客户端participant B as 服务器participant C as 数据库A->>B: 登录请求B->>C: 查询用户信息C–>>B: 返回数据B–>>A: 登录成功Note over A,B: 登录耗时 < 2s激活/停用生命线sequenceDiagramA->>B: 请求activate BB->>C: 调用activate CC–>>B: 响应deactivate CB–>>A: 完成deactivate B案例2，状态图（State Diagram）展示系统状态变化。stateDiagram-v2[*] –> 待审核待审核 –> 审核中: 提交审核中 –> 通过: 符合要求审核中 –> 拒绝: 不符合通过 –> [*]拒绝 –> [*]嵌套状态（层级状态）stateDiagram-v2[*] –> 登录流程state 登录流程 { [*] –> 输入账号 输入账号 –> 验证密码 验证密码 –> 登录成功}登录流程 –> [*]案例3，甘特图（Gantt Chart）展示项目进度、任务依赖。gantttitle 网站开发计划dateFormat YYYY-MM-DDsection 产品需求分析 :a1, 2025-10-01, 3d原型设计 :after a1, 4dsection 技术前端开发 :b1, after a1, 5d后端开发 :b2, after a1, 6dsection 测试系统测试 :after b2, 3d上线发布 :milestone, 2025-10-20, 1d案例4，类图（Class Diagram）常用于展示面向对象结构或数据结构。classDiagramclass 人 { +姓名 +年龄 +打招呼()}class 学生 { +学号 +选课()}class 老师 { +工号 +授课()}人 C2[“委托他人”]D1[“不重要不紧急”] –> D2[“忽略/删除”]案例9，思维结构图（树状图）graph TD目标[打造知识IP] –> 内容策略目标 –> 渠道建设目标 –> 社群运营内容策略 –> 图文输出内容策略 –> 视频短片渠道建设 –> 微信公众号渠道建设 –> 视频号社群运营 –> 核心粉丝群社群运营 –> 线下活动案例10，综合案例：产品生命周期图graph TDA[产品概念] –> B[需求分析]B –> C[设计阶段]C –> D{开发是否完成?}D –>|是| E[测试阶段]D –>|否| CE –> F{测试通过?}F –>|是| G[上线发布]F –>|否| DG –> H[运营与优化]H –> I{是否下线?}I –>|是| J[归档]I –>|否| H案例11，Quadrant Chart（象限图） 语法规范quadrantChart title [标题] x-axis [X轴左标签] → [右标签] y-axis [Y轴下标签] → [上标签] [名称]: [x值, y值] 案例代码quadrantChart title 基金风险收益象限 x-axis 风险低 –>风险高 y-axis 收益率 –>收益高 “货币基金”: [0.2, 0.1] “债券基金”: [0.4, 0.3] “混合基金”: [0.6, 0.6] “股票基金”: [0.9, 0.8]quadrantChart title Reach and engagement of campaigns x-axis Low Reach –> High Reach y-axis Low Engagement –> High Engagement quadrant-1 We should expand quadrant-2 Need to promote quadrant-3 Re-evaluate quadrant-4 May be improved Campaign A: [0.3, 0.6] Campaign B: [0.45, 0.23] Campaign C: [0.57, 0.69] Campaign D: [0.78, 0.34] Campaign E: [0.40, 0.34] Campaign F: [0.35, 0.78]案例12，Kanban（任务看板） 语法规范kanban section [列名] [任务] 案例代码kanban title 小程序开发任务 section 待办 需求调研 UI设计 section 进行中 前端开发 AI接入 section 已完成 原型评审案例13，ER 图（Entity Relationship Diagram，实体关系图）ER 图（Entity Relationship Diagram）主要描述：实体（Entity）：系统中的对象，如“用户”“订单”“商品”等。属性（Attributes）：实体的字段或特征。关系（Relationships）：实体之间的联系，如一对多、一对一、多对多。erDiagram 用户 ||–o{ 订单 : 下单 订单 ||–|{ 订单明细 : 包含 商品 ||–o{ 订单明细 : 被购买 用户 { int 用户ID string 姓名 string 邮箱 string 手机号 } 订单 { int 订单ID date 下单日期 float 总金额 string 状态 } 订单明细 { int 明细ID int 数量 float 单价 } 商品 { int 商品ID string 名称 string 分类 float 价格 }效果：先写这么多，后面再继续写一篇Mermaid的进阶小结。本文由人人都是产品经理作者【Blues】，微信公众号：【BLUES】，原创/授权 发布于人人都是产品经理，未经许可，禁止转载。题图来自Unsplash，基于 CC0 协议。