关于流程图制作工具
流程图是把一个流程画成图。每个步骤放在一个方框里，箭头表示先后顺序。遇到选择时，菱形里的问题会把路径分成是和否。整个流程一目了然，所以流程图很容易讲解，也很容易检查。
多数流程图工具要你一个个拖动方框和箭头，既费时间，线条还常常交叉。在这里，你只需每行写一个步骤，就像在纸上列清单。工具会摆好方框、画好箭头，并让线条互不干扰。改一行，图就立刻更新。
功能
- 输入文字，得到流程图 — 每行一个步骤；方框、箭头和间距都自动完成
- 带“是/否”的问题 — 行尾加 ?，并在下面写出各条出路
- 循环和跳转 — -> 步骤名称 可以跳回（或跳到）某个步骤，画成侧边的一条线
- 标准形状 — 圆角的起点和终点、方框、菱形，以及用于输入和输出的斜方框
- 清楚的提示 — 每个问题都会指出所在行，点一下就能跳到那一行
- 8 种样式 — 经典、极简、醒目、粉彩、深色、蓝图、手绘和黑板
- 从上到下或从左到右 — 还可以加上形状图例，方便做课堂讲义
- PNG 和 SVG — 清晰的图片适合做幻灯片，SVG 可以编辑和打印；你的文字会保存在这个浏览器里
如何用文字写流程图
每行写一个步骤。文字决定形状：
| 你输入 | 你得到 |
|---|---|
把水烧开 | 方框里的一个步骤 |
水开了吗？ | 菱形里的一个问题（行尾是 ?） |
问题下面的 是: 和 否: | 这个问题的出路 |
-> 把水烧开 | 指向那个步骤的箭头（步骤在上面时就是循环） |
开始、结束 或 结束: 完成 | 圆角的起点或终点 |
输入: 姓名 或 输出: 总数 | 用于输入或输出的斜方框 |
// 我的备注 | 写给自己的备注；不会画出来 |
把一个分支的步骤写在它的 是: 或 否: 下面的行里，并缩进两个空格。分支写完后，回到最左边：下一行接在问题之后，两条路在那里重新汇合。简短的分支可以写在一行里：是: 带上雨伞。
两条路不必都写。如果一个问题只有 是:，“否”这条路就直接走到下一个步骤。分支也可以用其他简短的名字，比如 红:、黄: 和 绿:，这样一个问题就可以有三条或更多出路。
跳转要使用步骤里完全相同的文字。大小写和末尾的 ? 都不影响。要在某个步骤之后跳回去，就在下一行写 -> 步骤名称，或写在同一行的末尾：先存钱 -> 我有钱吗？。
括号是选择形状的另一种方式：(文字) 是圆角终点，[文字] 是方框，/文字/ 是输入或输出框，<文字> 是菱形。如果某个步骤以 ? 结尾但并不是问题，就用 [ ]，例如 [问“为什么？”]。
三个入门示例
点一下文本框下面的示例就能载入，然后再修改。第一个示例早晨流程展示了主要用法：
| 行 | 前面的空格 | 作用 |
|---|---|---|
| 开始: 起床 | 0 | 圆角的起点 |
| 关掉闹钟 | 0 | 一个步骤 |
| 今天要上学或上班吗？ | 0 | 一个问题 |
| 是: | 2 | “是”这条路开始 |
| 快速冲个澡 | 4 | “是”这条路上的一个步骤 |
| 穿好衣服 | 4 | “是”这条路上的下一个步骤 |
| 否: | 2 | “否”这条路开始 |
| 再睡一个小时 | 4 | “否”这条路上的一个步骤 |
| 吃早餐 | 0 | 两条路在这里汇合 |
| 外面在下雨吗？ | 0 | 只有“是”这条路的问题 |
| 是: 带上雨伞 | 2 | 写在一行里的简短“是”路径 |
| 刷牙 | 0 | “否”这条路直接走到这里 |
| 结束: 出门 | 0 | 圆角的终点 |
要不要买？加入了循环和提前结束。在 我有钱吗？ 下面，“否”这条路先写 先存钱，再写 -> 我有钱吗？，于是流程图会回去再问一次。否: 结束: 不买了 这一行让流程在分支里就结束了。
登录流程用到了输入和输出框，还有分支里的问题。密码输错后，失败 3 次了吗？ 要么锁定账号，要么用 否: -> 输入: 邮箱和密码 跳回去。
流程图符号及其含义
| 形状 | 名称 | 用在 |
|---|---|---|
| 圆角方框 | 起止框 | 流程开始和结束的地方 |
| 方框 | 处理框 | 一个动作，比如“总数加 1” |
| 菱形 | 判断框 | 有两个或更多答案的问题 |
| 斜方框 | 输入 / 输出 | 进来或出去的数据，比如“读取数字”或“打印结果” |
| 箭头 | 流程线 | 步骤的先后顺序 |
在高级选项里勾选显示形状图例，就会在流程图下面印上这份图例。图例只列出你的流程图用到的形状。
八种样式
- 经典 — 柔和的颜色，每种形状一种颜色
- 极简 — 白底黑线，打印时省墨
- 醒目 — 浓重的填充形状配白色文字，适合幻灯片
- 粉彩 — 温和的颜色和圆角
- 深色 — 深色背景上发光的形状，适合屏幕
- 蓝图 — 蓝色网格上的白线，像一张技术图纸
- 手绘 — 画在横线笔记本纸上的草图
- 黑板 — 绿色黑板上的粉笔线条，适合课堂
样式只改变外观。步骤、布局和下载内容都不变。每种形状一种颜色可以在样式列表下面改成全部用同一种颜色。
谁会用流程图
- 学生 — 规划计算机课的算法、科学实验的步骤，或数学解题的方法
- 老师 — 用全屏在黑板上展示班规，或“卡住了怎么办”
- 团队 — 一步一步讲清一个请求、一张订单或一个客服工单是怎么处理的
- 程序员 — 写代码之前先画出函数的逻辑
- 在家里 — 做决定，或画一份让孩子照着做的日常流程
常见问题
什么是流程图？
流程图是一个流程中各个步骤的示意图。方框里写步骤，箭头表示顺序，菱形里写让路径分叉的问题。学校、办公室和编程中都会用它来说明事情是怎么运作的。
怎么添加“是/否”判断？
在行尾加问号，比如 外面在下雨吗？。在接下来的行里写 是: 和 否:，各自带上缩进两个空格的步骤。如果只写其中一个，另一条路就直接走到下一个步骤。
怎么做循环？
写上 -> 和前面某个步骤里完全相同的文字，比如 -> 我有钱吗？。箭头就会回到那个步骤。它画成流程图侧边的一条线，所以不会和其他线交叉。
红色和黄色的提示是什么意思？
红色的行是工具画不出来的问题，比如跳转到一个不存在的步骤。黄色的行是提示，比如只有一条出路的问题。每条提示都以行号开头。点一下，文本框里就会选中那一行。文本框左边的行号也会做上标记。
可以在其他软件里编辑流程图吗？
可以。下载 SVG 即可。它能在 Inkscape、Illustrator 和 Figma 中打开，也可以插入 PowerPoint 或 Word。文字仍然是真正的文字。PNG 是两倍大小的图片，用在幻灯片和文档里很清晰。
我的流程图会被保存或上传吗？
你的文字和设置保存在这个浏览器里，所以下次回来流程图还在。不会上传任何内容。流程图是在你自己的设备上画出来的。
可以用其他语言写吗？
可以。步骤可以用任何语言来写。中文、日文和韩文会在字与字之间换行，阿拉伯文和希伯来文则从右往左绘制。在这个页面里，特殊词语可以用中文，也可以用英文（开始、结束、是、否、输入、输出，或 Start、End、yes、no、Input、Output）；像 (文字) 和 /文字/ 这样的括号在所有语言里都能用。
流程图制作工具是免费的吗？
是的。不用注册，没有水印，制作流程图的数量也没有限制。
小提示
- 布局是自动的。你不能手动拖动方框；想调整的话，请改变各行的顺序
- 长文字会换成多行，一个形状里最多 8 行
- 一张流程图最多可以有 400 行
- 用 是: 和 否: 写的分支永远不会交叉。跳转会在侧边画出自己的线；只有两个互相重叠的跳转（A 跳回 C，B 跳回 D）才可能需要交叉
- 如果两个步骤的文字相同，跳转会去第一个
- 很大的流程图，PNG 的最长边为 8000 像素；SVG 没有限制
相关工具
- 思维导图制作 — 把你的想法围绕一个主题摆开
- 组织架构图制作 — 显示团队里谁向谁汇报
- 时间轴制作 — 按日期顺序展示事件
- 甘特图制作 — 按天和按周规划任务
- 韦恩图制作 — 比较两个或三个群组
- 桑基图生成器 — 显示数量如何从一处流向另一处
使用方法
- 在输入框里输入步骤，每行一个——或点一个示例开始
- 问题以 ? 结尾，并在下面写 是: 和 否:，各自的步骤要缩进
- 写上 -> 和某个步骤的名称，就能跳回那个步骤
- 如果输入框下面出现红色的行，点一下它的行号，然后修改那一行
- 选择样式、方向和文字大小
- 点击下载 PNG 或下载 SVG——或点击全屏，在大屏幕上展示流程图
