文件上传队列不是把多个进度条堆在一起。用户需要知道哪些文件在等待、哪个正在上传、哪些已完成或失败,以及失败后是否能只重试这一项。先用一组固定素材设计状态,再决定队列的并行规则、暂停行为和离开页面提示。
本例的素材库接受 JPG、PNG 和 MP4;用户选择 logo.svg、产品演示.mp4、封面.jpg 三个素材,分别演示格式不支持、上传中暂停和网络中断。可以用墨刀制作上传队列的可交互原型,把每个文件的结果和下一步连起来。

先定义文件级状态
队列级“上传中”不足以回答用户问题。每个文件至少有待上传、校验中、排队、上传中、成功、失败和暂停状态;状态名称应与可执行动作对应。
| 文件 | 示例状态 | 用户需要看到的动作 |
|---|---|---|
| logo.svg | 格式不支持,未入队 | 移除或改选 PNG/JPG 文件 |
| 产品演示.mp4 | 上传中 42% | 暂停、继续或取消 |
| 封面.jpg | 网络失败 | 重试,且不重复创建成功文件 |
| 已完成文件 | 上传成功 | 查看、替换或关闭队列 |
上传达到 100% 只说明传输阶段结束,若服务还需转码或校验,应进入“处理中”,完成后才显示可查看。暂停若能保留已传部分,恢复时可继续;若只能停止后重传,就写“停止上传”,不要用“暂停”暗示断点续传。
把校验放在开始前,也保留上传中的失败
格式、大小和命名规则可以在入队前提示,避免一个文件永远卡在排队。网络失败、服务拒绝和用户主动取消则发生在上传过程中,三者的文案与恢复动作不同。
- 选择三份素材,先显示文件名、类型和大小,允许移除单项。
- logo.svg 在入队前被拦截,说明支持 JPG、PNG 和 MP4;用户改选 logo.png 后才进入排队。
- 产品演示.mp4 进入上传中,显示当前状态和暂停入口;暂停后改为“已暂停”,继续时回到队列。
- 封面.jpg 发生网络失败,保留文件信息,提供单项重试,不把其他成功文件重新上传。
- 队列完成后显示成功数量、失败数量和查看结果入口。
不要用统一的“上传失败,请重试”覆盖格式错误。格式错误不需要反复请求,网络失败可能需要重试,服务拒绝还要解释权限或规则。

并行数量是团队决定,不是进度条样式
一次上传几项、暂停后是否让出队列位置、取消后能否重新加入,都可能改变用户对结果的理解。可先按“同时处理两项”的规则排队:暂停一项后,下一项是否立即开始?回答这个问题,再决定暂停后的占位和队列顺序。并行数量由团队结合上传服务确认。
队列关闭前给出可恢复的摘要:成功几项、失败几项、仍在处理几项。返回队列时保留每个任务的状态和错误原因;实现方需说明状态的保存时长与范围。
队列摘要还应能区分“尚未开始”和“失败后等待重试”。前者无需解释原因,后者应保留失败文件和最后一次错误。评审时把这两项分别记录,避免用一个灰色进度条隐藏真正的下一步。
给每个文件保留一个稳定的演示编号,评审意见写“文件 3(封面.jpg)的网络失败”而不是“第三个卡片”。当队列排序或文案调整时,编号仍能帮助团队确认是同一个对象。实现阶段再把编号映射到真实上传任务。
离开页面时要说明队列是否继续
如果用户关闭页面,队列是继续、暂停还是取消,取决于产品和服务端能力。离开后任务会取消时,不要提示“后台继续上传”。提供明确的离开提示:仍有任务时显示文件数和选择,返回后能找到队列状态;如果离开会取消,则明确取消哪些项目。
手机端还要检查系统切后台、网络切换和列表滚动后是否能找到失败项。队列返回入口应能找到暂停和失败文件,避免让用户重新选择整批素材。
用固定三文件任务评审
给评审者任务:“上传 logo.svg、产品演示.mp4 和封面.jpg;处理一个格式不支持的文件,暂停视频后恢复,遇到网络失败只重试该文件,最后查看成功与失败数量。”评审时观察:
- 能否看懂文件级状态,而不是只看到队列总体状态;
- 暂停与取消的动作是否有区别;
- 失败重试是否保留文件信息且不会重复处理成功项;
- 关闭页面前是否知道队列会如何处理。
把发现的问题记录到文件名和状态,不写“上传体验不好”。还可以用原型分支覆盖补查暂停、失败、取消和返回路径。
交付给研发的队列契约
- 每项文件的唯一标识、原文件名、类型、大小、校验结果。
- 队列状态和允许动作,例如暂停仅适用于上传中,重试仅适用于失败。
- 重复文件、网络失败、服务拒绝和用户取消的差异文案。
- 离开页面、重新进入和成功结果的状态保存规则。
重复文件规则单列:同名文件是允许并存、覆盖旧资源,还是提示重命名?同一文件连续点击重试时只保留一个任务,已经成功的文件不重复计数。队列摘要以任务最终状态统计;格式校验未通过的文件单独提示“未加入队列”,避免成功数、失败数和总数对不上。