跳到正文

排序

Sort

初级通用

排序(Sort)是按某个字段和方向,把一组内容排成可预期的顺序。它解决的是用户找不到优先要看的内容的问题,比如让项目列表按最近更新时间从新到旧显示。

你可能会说:「这个列表能不能让用户按更新时间或名称排列,方便先看到自己要找的内容?」

动手看看

我的项目
项目名称
状态
更新时间
品牌官网
进行中
07 月 16 日
会员中心
待审核
07 月 20 日
客服后台
已完成
07 月 12 日
按更新时间:新到旧
按更新时间:旧到新
未排序:保持原始列表顺序
排序方式

用下方的「排序方式」切换列表,再悬停或按 Tab 聚焦「更新时间」表头,看看它的交互反馈。重点观察:项目内容没变,变的是先看到哪条。

新到旧时,最近更新的会员中心排在最上面,适合先处理刚发生变化的项目。向下的箭头提示了当前排序方向。

要点

  1. 1

    先选用什么字段比较

    你说“按最新排序”时,我们得先确认“新”指创建时间还是更新时间。一个项目昨天创建、今天修改,按这两个字段会出现在不同位置。字段说清楚,AI 才能写出符合预期的逻辑。

  2. 2

    再定升序还是降序

    同一个字段可以有两个方向:价格从低到高是升序,从高到低是降序。界面上的选项最好直接写出方向,因为只写“按价格排序”,用户还得试一次才知道便宜的排在哪边。

  3. 3

    相同值还要有固定顺序

    多条记录的更新时间可能相同。我们可以再用唯一编号决定它们的先后,这样用户翻页或刷新时,记录不容易在相邻页面之间跳来跳去。尤其是分页列表,要把这条规则告诉 AI。

容易混淆的地方

排序改变的是同一批内容的先后,不决定哪些内容留下;筛选才会按条件缩小内容范围。搜索则是根据输入找匹配内容,结果可能再按相关性或时间排序。比如“只看未完成项目”是筛选,“未完成项目按截止日期从近到远显示”才加上了排序。

什么时候用

适合用

  • 做商品列表时,让用户在价格从低到高和上架时间从新到旧之间切换,方便按购买目标浏览。
  • 做项目后台时,把最近更新的项目放在前面,让团队先看到近期有变化的工作。
  • 做有分页的工单列表时,按创建时间和唯一编号排列,让翻页时的记录顺序保持稳定。

不适合用

  • 用户只想看分配给自己的工单时,关键是筛选负责人;单纯改变工单顺序,仍会显示其他人的工单。
  • 用户要通过工单编号直达某一条记录时,更适合提供搜索;让他反复切换顺序并不能快速定位。
  • 页面展示必须按操作步骤阅读的引导内容时,保持预设顺序更合适;让用户按名称排序会打乱流程。

练一练

你在做一个分页的工单后台。用户希望最新提交的工单排在最前面,刷新和翻页时也尽量保持顺序稳定。你会怎么向 AI 描述?

让 AI 帮你做

请给工单列表加入排序:默认按创建时间从新到旧显示,创建时间相同时按唯一编号从大到小排列。提供“最新提交”和“最早提交”两个选项;切换后,列表和分页数据都使用所选顺序。

接下来学什么