摘要：在数字化时代，流程图是产品经理工作中不可或缺的工具，但传统的流程图绘制方式往往耗时费力，效率低下。随着AI技术的飞速发展，现在有了更高效、更智能的解决方案。本文将介绍如何利用AI结合Mermaid语法，快速生成专业且美观的流程图。

在数字化时代，流程图是产品经理工作中不可或缺的工具，但传统的流程图绘制方式往往耗时费力，效率低下。随着AI技术的飞速发展，现在有了更高效、更智能的解决方案。本文将介绍如何利用AI结合Mermaid语法，快速生成专业且美观的流程图。

今天分享的案例是：利用Mermaid语法进行AI画流程图， 这对于咱们产品工作来说非常实用，建议点赞、收藏，跟着学，你也能学会！

图-⬆️利用mermaid语法，一键绘制流程图

每一次技术的跃迁，都意味着工作方式的迭代升级。

在这个信息爆炸、AI新能力快速涌现的时代，咱们的核心竞争力，将不再是处理信息的‘手速’，而是驾驭信息、创造洞察的‘脑力’！

这段时间，咱不是聊了点“AI产品技能树”的实战经验嘛，从原型设计到产品方案汇报等。

好几个同学特意留言反馈说很受启发，镜哥咱这心里也暖洋洋的，就像郭德纲老师所说“江山父老能容我，不使人间造孽钱”啊！（虽然大家也没买票打赏。。）

当然，也有不少同学私信，问我能不能再深入点，把产品架构、产品规划、业务流程这些更核心的产品设计环节，也掰开揉碎了讲讲怎么跟AI结合，看看AI能给咱们带来啥样的“神助攻”。

事实上，在AI时代巨变的洪流中，每一次技术的跃迁，都意味着工作方式的迭代升级，咱们的产品工作，也有太多可以插上智能翅膀的地方了！

这不，镜哥立马就安排上了！

今天，咱们就先来聊个高频且让不少产品经理“头大”的环节——业务流程设计。

大家都知道，业务流程图对咱们产品设计工作有多关键，那是你对业务的抽象、对市场的洞察，最终落地时的骨架和血肉。

可当你真沉浸到具体的业务场景里，你会发现这活儿虽然重要，但也挺耗时间、特磨人——因为一旦某个业务活动或规则调整了，整张流程图可能就得跟着“大变脸”，甚至推倒重来！

咱们吭哧吭哧对着Visio、Axure捣鼓半天，画出来不是密密麻麻像蜘蛛网，就是各种连线缠绕不清，改起来更是要了老命！

好消息是，这效率内耗，现在咱们也有了跟它一定程度上说“拜拜”的可能了！

“工欲善其事，必先利其器”。

镜哥多说一句个人暴论：在AI无孔不入的当下，如果还偏执地抱着老一套工具不放，甚至更自诩为古典匠人，都是在逆时代趋势的不进则退，也更像是在“用战术上的勤奋，掩盖战略上的懒惰”！。

事实上，镜哥每次听到团队资深老同事说“担心AI出错”，我都想引用《堂吉柯德》里的一句话：鲁莽也比怯懦更接近勇敢。

好，今天，镜哥就给大家带来一个能让你画流程图效率“Duang”一下提升N个档次的秘密武器——AI工具结合Mermaid语法！

说到Mermaid，肯定有同学还觉得有点陌生，但了解之后你会发现，它绝对是咱们产品经理的“超强辅助”！

简单来说，Mermaid就是一个基于文本的图表绘制工具。你不需要拖拽各种图形，也不需要担心连线歪七扭八，它能让你像写Markdown一样，用简单的文字描述（也就是所谓的“语法”）来快速生成各种图表。

这包括但不限于咱们最常用的流程图（Flowchart）、时序图（Sequence Diagram）、类图（Class Diagram）等等！

Mermaid的官网是 ⬇️：

mermaid.js.org，官网上面有详细的语法说明和各种示例。

Mermaid在线编辑器的地址为⬇️：

https://www.mermaidchart.com/app/dashboard，大家后续可以通过编辑器地址来使用。

大家别看它是代码，但有了AI加持后咱们上手非常快，因为其核心就是用文字来定义节点和它们之间的关系，然后神奇的事情就发生了——你的文字自动就“变身”成了漂亮的图！

这种纯文本的绘制方式，简直是为我们产品经理量身定做的——改起来贼方便，版本管理也容易，而且还能和各种文档、代码平台完美结合，想想就刺激不？

事实上，如今AI已然把Mermaid语法门槛极度降低，咱们甚至不需要懂Mermaid语法，只需要通过自然语言和AI交流，让其帮你生成符合mermaid语法的代码，而后通过在线编辑器即可实现。

这样，咱们直接通过一个真实案例——电商履约流程，来快速理解Mermaid的使用方法和价值。

因为，镜哥有个朋友老A，正好在一家电商公司做产品，他们前段时间要优化一个复杂的订单履约流程，涉及到用户下单、支付、库存扣减、物流发货、用户签收等等十几个环节。

而且中间还穿插各种异常处理，老A吭哧吭哧用Visio画了两天，密密麻麻铺满了三张A4纸，自己看着都眼晕，更别提给开发和运营团队讲解了。

那天晚上他跟我吐槽时，我说你用Mermaid啊。

怎么用？

你完全可以这样操作：

首先，用你最习惯的自然语言，把脑子里关于业务流程的想法，毫无保留地“倾倒”给AI。

别担心语法、逻辑，就像你跟同事口述一样，把流程的来龙去脉、关键节点、决策分支都描述清楚。AI会像一个经验丰富的业务顾问，帮你“查漏补缺”，梳理出清晰的文字版流程。

一旦你确认这份文字流程“没毛病”，完全符合你的业务逻辑，那么，再发出指令，让AI帮你把这份文字流程“翻译”成 Mermaid语法代码

第1步，通过自然语言和AI对话，确认业务流程的文字描述

首先，咱们还是先把业务流程文字描述确认清楚，确保流程描述没问题，这是后续操作的前提。

当然，咱们同样使用AI来辅助进行流程梳理，不仅能完善组织语言，甚至还能发现一些潜在的问题或忽略掉的流程环节。

镜哥在这里依然推荐首选使用Gemini 2.5，同时，有条件的同学更推荐使用Cursor或Claude4.0，因为代码报错很少，效率很高。

图-⬆️ 利用Gemini快速梳理业务流程

第2步，继续和AI对话，获得Mermaid代码。

当你确认业务流程符合你的要求后，咱们就可以直接让AI帮你生成符合Mermaid语法的代码了。

通常来说，各类AI Chat工具都能识别、生成Mermaid格式的内容，当然，镜哥自己觉得效果最好的还是上面提到过的Gemini 2.5 Pro或Claude4.0。

比如，上述流程，通过Gemini生成的符合Mermaid语法的代码可以如下，大家可以作为参考（也可以复制去测试体验下）：

graph TD subgraph”订单创建与支付” userBrowse[用户浏览商品]

–> submitOrder(提交订单); submitOrder

–> createOrder{创建订单}; createOrder

–> pendingPayment[待支付状态]; pendingPayment

–> paymentGateway{调用支付网关}; paymentGateway

— 支付成功

–> paymentSuccess[支付成功]; paymentGateway

— 支付失败/超时

–> orderClosed[订单自动关闭];

end subgraph”订单处理与风控” paymentSuccess

–> notifyWMS[通知WMS/ERP系统]; notifyWMS

–> validateOrder{订单风控与库存校验}; validateOrder

— 校验通过

–> lockInventory[锁定库存]; validateOrder

— 库存不足/高风险

–> orderException[订单异常]; orderException

–> manualReview[人工审核/客服联系]; manualReview

— 审核通过

–> lockInventory; manualReview

— 审核失败

–> cancelAndRefund[取消订单并退款]; end subgraph”仓储作业 WMS” lockInventory

–> generatePickList[生成拣货单]; generatePickList

–> warehousePicking[仓库按单拣货]; warehousePicking

–> packAndCheck[打包与复核]; packAndCheck

–> weighAndLabel[称重并打印面单]; weighAndLabel

–> callLogisticsAPI{调用物流公司API}; callLogisticsAPI

— 下单成功

–> packageShippedOut[包裹出库]; callLogisticsAPI

— 下单失败 –> logisticsException[物流异常，人工处理]; end subgraph”物流与签收” packageShippedOut

–> updateStatusShipped[更新订单状态为’已发货’]; updateStatusShipped

–> notifyUserShipped[短信/App通知用户]; packageShippedOut

–> handoverToCourier[包裹交接给物流公司]; handoverToCourier

–> inTransit[物流运输中]; inTransit –> outForDelivery[到达目的站，开始派送]; outForDelivery

–> userSigns{用户签收}; end subgraph”订单终态与售后” userSigns

— 正常签收

–> confirmReceipt[确认收货]; userSigns

— 拒收/异常

–> triggerReturn[触发逆向物流-退货]; confirmReceipt

–> orderComplete[订单完成]; orderComplete

–> inviteForReview[邀请用户评价]; triggerReturn

–> afterSalesProcess[进入售后处理流程]; end

图-⬆️ 利用Gemini2.5 Pro，输出Mermaid代码

将代码复制到在线编辑器

接下来就简单了，咱们只需将生成的代码轻轻一复制，粘贴到任何一个支持Mermaid的在线编辑器（比如前面提到的 Mermaid Chart）。

一般情况在，几乎一瞬间，很快一份专业又美观的流程图就立刻呈现在你眼前，效率简直不要太高！

比如，根据Mermaid语法，上述流程可以快速生成。

图-⬆️ 根据Mermaid代码，一键绘制流程图

bug如何修复、是否需要开通会员？

当然，很多时候，AI生成的Mermaid代码可能会有bug，这也很正常，官方提供了AI修复能力，但是一般需要会员，我一般直接复制bug信息，交给Gemini或cursor来修复。

基本上，修复两三次，bug就能搞定。

这里多说一句，Mermaid Pro版本的会员是6.67刀（为啥有整有零呢），开通会员之后就可以使用AI来修复bug，而且不限制文件数量，要知道免费版本只能创建3个文件。

图-⬆️ Mermaid会员定价，可按需不买。。。

但有一说一，Mermaid日常使用的话，其实咱不开通会员也足够了，因为支持导出PNG，最重要的是还不带水印，这点要好评点赞。

所以，这样的话，即便是限制3个文件，对咱们影响也不大，完全可以导出后删除新建。

当然，不缺钱的同学当我没说。

一般来说，根据Mermaid语法生成的图片，可能会有些排版不够精致，这种情况下，我都会选择自适应，基本就能达到我的要求。

自适应的入口参考下图：

图-⬆️ Mermaid选择自适应（Adaptive）

另外，自适应之后如果需要调整样式，可以在主题里进行调整或自定义，这个咱就不过多展开了，大家可以自行测试，很简单的。

技巧二：叠加《录音分析大师》Buff，效率更近一步

还记得上次我给大家分享的那个「录音分析大师」吗？（没看过的赶紧去补课：我用Gemini做了个「录音分析大师」，会议纪要一键转PRD，产品梳理效率直接拉满！）。

要知道，咱这个AI智能体，可不仅仅是整理会议纪要、梳理业务流程的“一把好手”！

实话跟大家讲，我们团队很多小伙伴现在就是利用咱这个“录音分析大师”来搞定流程图的！

你想想，开会或讨论会上，大家七嘴八舌地聊业务流程，很多时候都是口语化的、非结构化的。

以前咱们是不是得把录音转文字，再手动梳理，然后一步步画？费时费力不说，还容易漏掉细节。

现在不一样了！我们直接把会议录音转成的文字稿“喂”给“录音分析大师”，并且，你知道的，这个智能体，我已经给它设定好了“咒语”——如果你在Prompt里选择或者明确指示它需要“梳理业务流程”，它不仅会帮你用文字描述一遍，更“骚”的是，它能直接给你输出Mermaid语法的代码！

这是什么概念？

这意味着，你们刚开完会，你甚至不用离开会议室，边喝水边操作几分钟，一份初版的流程图可能就已经出来了！

团队里的小伙伴用我的这种方法，那和开发沟通的效率极高，因为流程图不再是“抽象艺术”，而是“所见即所得”，修改起来也极为方便。

你改个文字，流程图自动就变了，比传统拖拽式的工具效率高了不止一个量级！

正所谓，“好风凭借力，送我上青云。”

你看，只要你能善用AI工具，你的工作效率提升就不是一星半点，而是指数级的放大。

当然，Mermaid也好，其他AI应用也罢，都不是万能的，我们在使用过程中也需要注意一些问题，比如，AI的理解能力有限有时候咱们还需要仔细Review AI生成的结果，进行人工修正。

再比如，Mermaid语法有一定的学习成本：虽然基本语法不难，但要绘制复杂的流程图，仍然需要一定的学习和实践。

但是，这些都不应该成为咱们排斥AI新应用的接口，相反的，主动的尝试、高频地使用、不断地调优，才能真正提升我们的工作效率、激发AI最大潜能关键所在。

最后，镜哥还想对各位峡谷同学说：

拥抱AI，不是一句空话，而是要真正将其融入到我们的日常工作中。学会使用AI工具结合Mermaid语法来绘制流程图，只是我们在AI时代提升效率的一个小小尝试。

这只是冰山一角，更大的效率革命才刚刚开始！未来，还有更多AI赋能产品经理的可能性等待我们去探索。

记住，工具永远在变，但提升效率的底层逻辑不变。在这个信息爆炸、AI涌现的时代，我们的核心竞争力，将不再是处理信息的“手速”，而是驾驭信息、创造洞察的“脑力”！

还是那句老话：

进化，不是选择，而是必然。与其被时代裹挟，不如主动出击，成为定义未来的那批人！

来源：人人都是产品经理