分步表单的重点,是让用户每一步只处理一组相关问题,并且能够放心返回修改。把二十个字段平均拆成四页,并不一定比一张长表单更好:如果用户反复往返找信息,或者改了上一页就要重填后面,步骤条只是把麻烦分成了几段。
设计前先写出每一步要完成的决定,再用墨刀原型把报名流程做成可点击页面,检查前进、返回、核对和提交是否都能走通。下面以企业培训报名为例,说明怎样拆步骤,以及最容易遗漏的依赖和恢复规则。

先判断这份表单是否值得分步
分步适合几个阶段的材料明显不同,或者后一阶段需要根据前面的选择变化的任务。例如先确认报名人身份,再选择课程和场次,最后核对费用与提交;三个阶段对应三个决定,不只是三个屏幕。
如果只有姓名、手机、邮箱和一句备注,分步会增加跳转。如果用户必须同时比较多个字段,拆开也会损失上下文。真正的判断依据是认知负担、依赖关系和任务时长,不能规定“超过几个字段一定分步”。W3C 的多页表单指南同样强调按逻辑阶段组织,并向用户说明进度。
| 任务特点 | 更合适的安排 | 设计时要确认 |
|---|---|---|
| 少量独立字段,几眼能看完 | 单页填写 | 标签和错误提示是否清楚 |
| 身份、方案、材料分属不同阶段 | 按阶段分步 | 上一步修改影响哪些内容 |
| 大量字段需要来回比较 | 单页分组或分区 | 是否可以折叠次要区域 |
| 多日准备、不同人员接力 | 任务清单与草稿状态 | 是否必须按固定顺序完成 |
把培训报名拆成三个明确的决定
本例的报名人先填写基本信息,再选课程与场次,最后确认报名。页面标题用“填写报名信息”“选择课程与场次”“核对并提交”,比“第一步、第二步、第三步”更能表达当前要做什么。步骤条同时显示当前位置、已完成阶段和剩余阶段。
第一步只收集会影响报名资格和联系的必要资料。第二步展示符合资格的课程与场次;选项旁写时间、地点和是否还有名额。第三步显示前两步的结果、费用以及提交后发生什么,而不是再放一份没有重点的完整表单。
步骤数量会随选择变化时,不要提前承诺错误的总步数。比如团体报名多出“填写参加人员”,可以先说明后续将按报名类型展示;一旦路径确定,再呈现实际步骤。不要在用户已经完成第二步后,突然把它改成“第二步,共七步”而不解释新增的任务。
校验放在哪一步,决定用户能否顺利前进
点击“下一步”时,应校验当前步骤必须满足的条件。未填写完的下一页字段不能反过来阻止当前页继续。邮箱格式等即时规则,可以在用户结束输入后提示;依赖服务器的名额或资格判断,应有检查中的状态,不能让按钮看起来无响应。
如果有错误,保留已填内容,在对应字段解释原因,并把焦点带到清楚的错误位置或错误汇总。错误提示要能指导动作:“请填写用于接收报名通知的邮箱”比“输入有误”更有帮助。字段层面的校验可以接着参考表单字段与提交状态的设计方法。
“下一步”和“提交报名”要有区别。用户点击前者只是进入下一阶段,不能悄悄创建正式订单;点击后者才执行最终动作。按钮附近可写“提交后生成报名记录,是否成功以确认结果为准”,具体表达以实际业务流程为准。
返回修改时,哪些答案能保留
返回上一页通常应保留已填内容。但保留并不意味着所有旧答案继续有效。假设用户从“公司统一报名”改为“个人报名”,原先选择的内部专场可能不再可选;如果继续显示它,就会把一个已经失效的选项提交出去。
| 修改项 | 后续影响 | 页面处理 |
|---|---|---|
| 联系人姓名 | 课程选择仍有效 | 直接更新确认页 |
| 报名类型 | 可选课程范围改变 | 保留仍有效的选择,标记需要重选的项目 |
| 课程 | 场次、价格可能改变 | 说明影响,重新确认场次与费用 |
| 联系方式 | 通知地址改变 | 确认页同步更新,必要时重新验证 |
不要一律清空后续所有输入。系统知道哪些字段依赖上一步,设计稿也应把这个关系写清。需要重选时告诉用户为什么,例如“报名类型已变更,请重新选择可报名场次”,同时保留与该变化无关的备注。

核对页必须允许就地回到对应步骤
确认页不是一张“请检查”的图片。按报名人、课程场次、费用三组展示信息,每组提供清楚的“修改”入口。修改结束后返回确认页,比要求用户再点完整条步骤链更省力;但如果变更导致后续选择失效,应先完成必要的重新确认。
提交期间显示正在处理,避免重复操作。网络异常时,不能直接认定报名失败并让用户再次提交:请求可能已经被服务器接收。产品和研发应约定如何查询最终结果;页面先说明“正在确认提交结果”,再提供与真实状态匹配的后续操作。
成功页至少回答报名编号、课程和场次、通知方式及下一步。有失败项时指出失败对象和可补救方式。用户离开后再次进入,是继续草稿、查看已提交报名,还是开始新报名,也应有独立规则,不能每次都回到空白第一步。
评审时跑这六条路径
- 按正常顺序完成报名,核对每一步的标题、按钮和最终结果。
- 在第二步返回修改姓名,确认课程选择没有无故丢失。
- 修改报名类型,检查不适用场次如何标记和重新选择。
- 在确认页修改联系方式,检查能否直接回到确认页。
- 模拟提交中断,确认不会出现“失败了但实际上已报名”的矛盾引导。
- 离开后再次进入,检查草稿和已提交记录的入口是否容易区分。
在墨刀里,可以为每个关键结果建立页面或状态,并用交互连接组成这些路径。原型演示的是已定义的行为,数据保存与重复提交控制仍由实际系统实现。将依赖规则写在页面旁,研发接手时就能理解为什么某个字段需要重新确认。
好的分步表单让用户始终知道自己完成了什么、修改会影响什么、下一次点击会发生什么。如果删掉步骤条后这些答案仍然清楚,说明流程结构本身已经成立。