跳到正文

结果页

Result

初级通用

结果页(Result)是在一项操作结束后,集中展示成功、失败等结果的页面或页面主体。它帮你告诉用户刚才发生了什么、接下来能做什么,比如文件导入完成后展示导入数量和查看入口。

你可能会说:「帮我做个操作结束后展示结果的页面,让用户看懂有没有完成,还能继续下一步。」

动手看看

客户名单.csv客户资料 · CSV 文件
导入成功客户资料已加入通讯录,可以开始使用了。
新增联系人
128 条
查看联系人
继续导入
导入失败没有新增联系人,请修正文件后重试。
无法读取文件文件编码不是 UTF-8。请将 CSV 另存为 UTF-8 格式后重新上传。
重新选择文件
查看导入指南
导入结果

切换导入结果,看看页面怎样交代刚才发生的事,以及下一步能做什么。也可以悬停按钮,或按 Tab 查看聚焦反馈。

成功时突出新增数量,并把「查看联系人」放在首要位置;调整数量,看看结果如何随实际导入量更新。

要点

  1. 1

    先说清操作是否完成

    你可以用“导入完成”或“导入失败”作标题,让用户先确认结果。因为用户来到这里通常是在等一个结论,所以别只放图标;图标可以辅助识别,但不能代替文字。

  2. 2

    补上影响后续操作的信息

    如果导入了 80 条记录、另有 3 条失败,就把数量和失败原因的查看入口放在结果页。这样用户能判断是否需要处理问题,而不是回到列表里猜刚才发生了什么。

  3. 3

    给出与结果匹配的下一步

    成功后可以提供“查看导入记录”,失败后可以提供“重新上传”。我们让按钮指向具体任务,是因为结果页不只是宣布结束,还要帮用户从当前结果继续往前走。

容易混淆的地方

结果页适合承载一次操作结束后的结论和后续动作,不限定必须占满整个屏幕。轻提示通常短暂出现,适合反馈“已复制”这类小操作;弹窗会打断当前界面,更适合需要当场确认或处理的事情。你可以按信息量和用户是否需要停下来决策,选择合适的呈现方式。

什么时候用

适合用

  • 后台批量导入客户资料后,展示成功与失败的数量,并提供查看失败记录的入口。
  • 网站支付流程结束后,展示订单是否创建成功,以及查看订单或重试的入口。
  • AI 工具完成一批文件处理后,展示处理结果,并引导用户查看或下载产物。

不适合用

  • 用户复制了一段链接,只需要知道复制成功;用短暂的轻提示更合适,不必离开当前页面。
  • 用户提交表单时漏填了必填项,问题还在输入过程中;直接在对应字段附近提示,方便当场修改。
  • 后台任务仍在运行,结果尚未确定;先用进度或状态展示等待过程,完成后再考虑结果页。

练一练

你在做一个后台导入功能:用户上传表格后,系统已处理完毕,成功导入 80 条,另有 3 条因格式错误未导入。此时哪种设计更合适?

让 AI 帮你做

请为后台表格导入功能设计结果页:处理结束后展示成功和失败数量、简短说明,以及“查看失败记录”和“返回列表”的操作。成功与部分失败要用不同文案;不要把处理中的进度当成最终结果。

接下来学什么