第 6 章 · 先画流程，不要先画界面
用户从进入到拿到结果，中间经过哪几步？
上一阶段你砍出了一条核心流程。这一章把它画出来，在写代码之前发现哪一步说不通。
机制
界面是流程的表现，不是反过来。流程说不通，界面再好看也只是把问题藏得更深。
画流程只做一件事：把每一步的输入和输出写出来。每一步要能回答三个问题——用户这时看到什么？需要给出什么？拿到什么？
三个里有任何一个答不上，那一步就还没想清楚。最常见的是第二个：你知道结果长什么样，但说不出用户得先给你什么。
一步的输入是用户在这一步必须提供的东西，输出是他离开这一步时拿到的东西。
上一步的输出必须能作为下一步的输入。接不上的地方，就是流程断裂的地方——这在界面草图上看不出来，在输入输出表上一眼就能看见。
超过五步要回头。核心流程不是用户旅程地图，它只覆盖「为了拿到结果必须做的事」。第六步往往是你偷偷加回来的东西。
草图足够。纸、Figma、Excalidraw 都行，第一版不需要设计系统——这一步的产出是一张能让你自己发现问题的图，不是给别人看的稿。
现实案例
第一版流程：粘贴数据 → 合并 → 复制走。
写输入输出时卡在第二步：
- 第一步输出「5 段粘贴的文本」
- 第二步需要输入「5 段结构一致的文本」
接不上。5 个渠道的后台导出格式不同，有的带表头有的不带，列顺序也不一样。她原以为「合并」是一个动作，实际上中间缺了一步：把 5 段异构文本对齐成同一张表。
而对齐这一步无法自动完成——至少第一版不能。所以流程改成四步：粘贴 → 选择每段对应哪几列 → 合并 → 复制走。多出来的那一步是整个工具最难的地方，而它在界面草图上根本不存在。
这就是先画流程的价值：她在写第一行代码之前就知道了真正的难点在哪。
动手试
把你的核心流程写成一张表，一行一步，三列：用户看到什么 / 需要给出什么 / 拿到什么。
然后逐行检查：上一行的「拿到什么」，能不能直接作为下一行的「需要给出什么」？
接不上的地方就是你漏掉的步骤。把它补进去，重新数总步数——如果超过五步，回到第 4 章重新裁剪。
你的行动
画出核心流程，标出每一步的输入和输出。
然后找出你最不确定的那一步，把它写成一条待解决的问题记下来。那通常就是整个项目的真正难点，越早知道越好。
检查标准
- 流程画出来了，步骤可数且不超过五步
- 每一步的输入和输出都写了
- 上一步的输出能接上下一步的输入，没有断点
- 流程里没有不属于核心任务的步骤
- 我写下了最不确定的那一步是哪一步
容易搞错的地方
写不出某一步的输入，不是因为它太简单，是因为你默认用户已经有了某样东西——而他可能没有。
林舒默认用户粘进来的 5 段数据格式一致，这个默认让整个工具少了最关键的一步。
按钮放哪、用什么颜色，这些在流程通了之后十分钟就能决定，在流程通之前决定几次都会推翻。先用灰色方块代替。
本章自测
- 一步的输入和输出分别指什么？
- 为什么流程超过五步要回头重新裁剪？
- 林舒是怎么发现流程里少了一步的？