AI 交互模式
应对 AI 不确定性的完整状态设计
AI 功能的输出具有不确定性、时延、以及可能的错误，需要完善的状态设计来保证用户体验。本模式库定义了语音搜索、智能推荐、流式输出等常见 AI 场景的标准交互范式。
设计原则
状态透明
让用户清楚知道 AI 在做什么（listening / processing / generating）
即时反馈
0.1 秒内响应用户操作，用动画和文案消解等待焦虑
优雅降级
AI 失败时自动降级为传统方案，不中断用户流程
语音搜索
用户通过遥控器语音键触发搜索，系统识别语音并返回结果。
交互流程（5 个状态）
| 状态 | 用户感知 | UI 表现 | 时长 |
|---|---|---|---|
| 1. Idle 待唤醒 |
用户按下语音键 | 显示麦克风图标 + "请说话" | - |
| 2. Listening 听取中 |
用户正在说话 | 波形动画 + 实时音量显示 "正在听..." |
3-10 秒 |
| 3. Processing 识别中 |
系统识别语音内容 | 显示识别文本 + loading "正在识别..." |
1-2 秒 |
| 4. Searching 搜索中 |
系统搜索内容 | 显示搜索关键词 "正在搜索「xxx」..." |
1-3 秒 |
| 5. Results 结果展示 |
展示搜索结果 | 卡片列表 + 高置信度标记 焦点自动落在第一个结果上 |
- |
异常处理
| 异常类型 | 触发条件 | 处理方式 |
|---|---|---|
| 识别失败 | 语音识别置信度 < 30% | 显示"没听清，请再说一次" 自动回到 Listening 状态 |
| 无搜索结果 | 搜索返回空结果 | 显示"未找到「xxx」" 推荐相似内容或纠错建议 |
| 网络超时 | API 超过 5 秒未响应 | 显示"网络不佳，请重试" 提供"手动输入"入口 |
| 麦克风权限 | 用户拒绝麦克风权限 | 显示权限引导 + 降级为手动输入 |
设计细节
- 实时文本显示：Processing 状态下，显示识别到的文本，让用户可以提前判断是否正确
- 可中断：任何状态下用户按返回键都可以取消语音搜索
- 置信度标记：搜索结果按置信度排序，高置信度（>80%）的结果标记"⭐ 推荐"
- 历史记录：记住最近 5 次语音搜索，用户可以快速重新搜索
智能推荐
基于用户观看历史、时段、家庭成员的个性化推荐卡片。
推荐卡片设计
- 视觉标识：渐变边框 + "AI 推荐" badge，区别于编辑推荐
- 推荐理由：hover 时显示"因为你看过《xxx》" 或 "现在是晚间，为你推荐..."
- 反馈机制：长按菜单键，显示"不感兴趣" / "喜欢"，AI 学习用户偏好
加载状态
| 状态 | UI 表现 | 时长 |
|---|---|---|
| Loading | 骨架屏（3 个卡片占位） | 1-2 秒 |
| Streaming | 卡片逐个淡入（每个间隔 100ms） | 0.3-0.5 秒 |
| Complete | 展示完整推荐列表 | - |
| Failed | 降级为编辑推荐，不显示错误 | - |
优雅降级策略
AI 推荐失败时，自动降级为以下方案，用户不会感知到错误：
- 方案 1：使用上次成功的推荐结果（缓存 30 分钟）
- 方案 2：使用编辑精选内容
- 方案 3：使用热门排行榜
注：降级后移除 "AI 推荐" badge，改为 "为你推荐" 或 "热门推荐"
流式输出（Streaming）
AI 生成内容时，逐步展示结果而不是等待完整输出。
何时使用 Streaming
| 场景 | 是否使用 Streaming | 原因 |
|---|---|---|
| AI 生成文案（如简介、评论） | ✅ 使用 | 生成时间 > 3 秒，streaming 可以降低等待焦虑 |
| AI 生成推荐列表 | ✅ 使用 | 卡片逐个淡入，给用户"内容不断出现"的感觉 |
| 语音识别文本 | ❌ 不使用 | 识别时间 < 2 秒，直接显示结果更清晰 |
| 搜索结果 | ❌ 不使用 | 用户期望一次性看到所有结果进行对比 |
Streaming 设计规范
- 逐字显示：文本内容每次显示 3-5 个字，速度约 20 字/秒
- 光标提示：显示闪烁光标 "|"，表示内容还在生成中
- 可滚动：内容超出屏幕时自动滚动，始终显示最新生成的部分
- 可停止：显示"停止生成"按钮，用户可以提前终止
- Token 计数：长内容显示"已生成 340 / 最大 2000 tokens"
错误处理
AI 功能可能因为模型超时、内容过滤、网络错误等原因失败，需要系统性的错误处理。
| 错误类型 | 触发条件 | 用户感知 | 处理方式 |
|---|---|---|---|
| 模型超时 | API 超过 10 秒未返回 | 等待时间过长 | 显示"AI 响应较慢，请稍后重试" 提供"重试"按钮 |
| 内容过滤 | 请求触发安全策略 | 请求被拒绝 | 显示"无法处理该请求" 不展示具体原因（避免用户绕过） |
| 网络错误 | 网络中断或超时 | 无法获取结果 | 降级为本地缓存或传统推荐 显示"网络不佳"提示 |
| Token 超限 | 输入内容超出模型上下文 | 提交失败 | 提前在输入框显示"剩余 XXX 字" 超出时禁用提交按钮 |
| 识别错误 | 语音/图像识别结果不符合预期 | 结果错误 | 显示识别内容 + "不正确？点击修改" 提供手动编辑入口 |
错误设计原则
- 明确告知：说清楚"哪里出错了"（网络、识别、超时），而不是泛泛的"请求失败"
- 提供出路：每个错误都要有"重试" 或 "降级方案"，不能让用户卡住
- 不甩锅给 AI：避免"AI 出错了"这种表述，改为"网络不佳" 或 "无法处理"
- 记录反馈：错误发生时记录用户操作路径，用于优化模型和 Prompt
置信度展示
当 AI 结果不确定时，应向用户展示置信度，帮助用户判断结果可信度。
| 置信度区间 | UI 表现 | 用户感知 | 使用场景 |
|---|---|---|---|
| 高置信度 ≥ 80% |
直接展示结果 标记 "⭐ 推荐" |
AI 很确定，可以直接使用 | 语音搜索第一结果 智能推荐卡片 |
| 中置信度 50-79% |
展示结果 + 标注"可能是..." 提供其他候选项 |
AI 不太确定，用户需要判断 | 语音识别歧义词 搜索结果第 2-5 位 |
| 低置信度 < 50% |
展示多个候选项让用户选择 不标记"推荐" |
AI 不确定，用户自己决定 | 语音识别失败 无精确匹配的搜索 |
置信度设计原则
- 不过度展示：只在用户需要判断时展示置信度，不要每个结果都标"80% 置信度"（用户看不懂）
- 用视觉层级代替数字：用"推荐" / "可能是" / "其他结果"这种语义标签，而不是直接显示百分比
- 提供逃生口：低置信度结果要提供"不是这个？点击查看更多"的入口
总结
AI 交互设计的核心是把技术限制翻译成用户可理解、可控制、可预期的体验。
- 状态透明：让用户知道 AI 在做什么
- 即时反馈：0.1 秒内响应，用动画消解等待
- 错误友好：明确告知哪里出错 + 提供解决方案
- 优雅降级：AI 失败时自动 fallback，不中断用户流程
- 可控可逆：用户可以停止、修改、重新生成