Interface Lab
返回知识库
Design Systems Page Patterns

知识库与资源库浏览模式

知识库、素材库和模式库需要把搜索、分类、筛选、结果数量、命中摘要、空结果和详情返回路径组织成稳定浏览流程。

设计原则

库页面的价值不是展示很多卡片,而是帮助用户从模糊意图逐步收敛到可调用条目,并保留来源、质量、分类和下一步行动。

大理论

知识库和素材库是 agent 的外部记忆,也是人类维护者的审计界面。它们必须同时支持搜索和浏览:搜索解决“我知道我要什么”,分类和 facets 解决“我还不知道该用什么”。一个成熟库页面会让 query、active filters、结果数、排序、命中片段、条目质量和空结果恢复都可见,而不是只把所有内容平铺成卡片墙。

小知识点

  1. 顶部提供搜索输入和结果数量,让用户知道当前视图的范围和反馈速度。
  2. 分类、标签、资源类型、授权、质量分和状态应作为 facets 或 tab,而不是埋在卡片正文里。
  3. Active filters 必须可见、可逐个移除,并提供 reset all;移动端可放入 filter tray,但结果数仍要外显。
  4. 卡片摘要要包含 title、category、tags、matched excerpt/summary、quality/source 信号和主行动;不要只显示漂亮封面。
  5. 空结果需要解释当前筛选条件,并给出改 query、移除筛选、查看热门分类或新建条目的路径。
  6. 详情页要保留返回上下文:回到同一 query、filter、scroll 或至少同一 tab/category。

设计判断

如果用户能从一个模糊查询逐步收敛到具体 skill/知识/素材,并理解为什么这个结果可信、如何使用、如何返回列表,这个库才是可调用系统;如果用户只能滚动卡片墙,它只是内容陈列。

实现建议

在 URL 中保存 tabqcategorytaglicensesort 等 query state;服务端或客户端都要显示 result count。搜索命中时高亮或显示 matched excerpt;筛选状态用 chips 展示;空结果组件包含 reset/search suggestion;详情链接附带或保留返回状态。RAG 管理页还应暴露 item slug、section、score、source、quality 和最近命中事件。

反例/风险

搜索后 URL 不变导致无法分享;移动端筛选打开后看不到结果数;空结果只写 No results;卡片没有来源和质量信号;详情返回后丢失滚动和筛选;搜索 token 用简单 substring 导致 Rive 命中 driven。

案例分析

A List Apart 把 faceted navigation 描述为会影响整体信息架构的 master pattern,因为它让搜索和浏览形成更紧密关系。NN/g 区分 filters 和 facets,指出 facets 通过多个属性帮助用户发现可能未主动想到的类别。Carbon 的 Search 和 Empty states pattern 要求 loading/empty 状态提供有用说明,并帮助用户调整搜索或筛选。Atlassian Empty state 也强调无数据时要说明用户下一步能做什么。可学习点是:库页面不是“搜索框 + 卡片”,而是一套可恢复、可解释的探索状态机。

来源链接

A List Apart Faceted Navigation: https://alistapart.com/article/design-patterns-faceted-navigation/ NN/g Filters vs. Facets: https://www.nngroup.com/articles/filters-vs-facets/ NN/g User Intent Affects Filter Design: https://www.nngroup.com/articles/applying-filters/ Carbon Search Pattern: https://carbondesignsystem.com/patterns/search-pattern/ Carbon Empty States: https://carbondesignsystem.com/patterns/empty-states-pattern/ Atlassian Empty State: https://atlassian.design/components/empty-state

Agent 指令

生成库页面时必须同步设计 search、facets、active filter chips、result count、matched excerpt、empty recovery 和详情返回状态;禁止只输出卡片网格。