真实产品流作为模式证据

大理论

界面模式要服务决策：用户在什么场景下进入、如何判断下一步、失败时如何恢复、完成后如何确认。只看一张截图会丢掉状态和路径。

小知识点

1. 研究模式时至少记录入口、主任务、关键状态、错误状态、完成反馈和退出路径。
2. 同一个模式要比较 3-5 个真实产品，而不是只学习一个品牌。
3. 文案、控件密度、默认值和权限边界同样是模式证据。
4. 抽取结构，不复制品牌视觉。

设计判断

当一个模式能说明用户为什么点击、如何纠错、何时完成，它才可以进入知识库；只说明配色和圆角还不够。

实现建议

为每个模式条目记录：任务名、适用页面、关键状态、组件组成、移动端变化、可访问性要求、反例和来源链接。

反例/风险

把 Dribbble 单图当流程证据，忽略错误/空状态，复制品牌样式，未区分 iOS/Android/Web 习惯。

案例分析

Mobbin 的公开首页强调可搜索真实产品的 screens、UI elements、flows 和截图文本，并展示大量 app、screens 和 flows 数据。可学习点是：RAG 检索应能按任务、控件和流程查证，而不只是按风格词找图。

来源链接

Mobbin: https://mobbin.com/