videos1.0/User_Role_Interfaces.md

User_Role_Interfaces.md - 用户角色与界面规范

文档类型	UI/UX Spec (Interface Definitions)
项目名称	SmartAudit (AI 营销内容合规审核平台)
版本号	V1.0
发布日期	2026-01-30
关联文档	RequirementsDoc.md (RD), PRD.md
侧重	角色权限、核心页面布局、交互逻辑

---

版本历史 (Version History)

版本	日期	作者	变更说明
V0.1	2026-01-30	Gemini	初稿：角色权限、三端界面设计
V1.0	2026-02-02	Claude	审阅补充：导航结构、数据看板、响应式/无障碍设计、错误处理规范
V1.1	2026-02-02	Claude	与 RD/PRD 对齐：补充用户故事引用、区域合规、特例记录规范、证据链权限

---

1. 角色权限矩阵 (Role-Permission Matrix)

在进入界面细节前，先明确各角色在系统中的能力边界。

对应 PRD 第8章、RequirementsDoc 第3章

功能模块	👤 达人 (Creator)	👥 代理商 (Agency)	🛡️ 品牌方 (Brand)
终端设备	Mobile (主) / Desktop	Desktop (主)	Desktop (主)
Brief 管理	查看任务详情	✅ 上传/解析/编辑 Brief	✅ 全局规则配置
脚本/视频提交	✅ 上传 & 修改 [US-03]	❌ 不可提交	❌ 不可提交
查看 AI 报告	✅ 仅查看自己的 [US-07]	✅ 查看所管辖达人的	✅ 查看所有
审核决策	❌ 无权	✅ 初审 (驳回/通过) [US-08]	✅ 终审 / 强制通过 [US-09]
申诉功能	✅ 发起申诉 (消耗令牌)	✅ 仲裁申诉	❌ 无需申诉
证据链导出	❌ 无权	✅ 导出所管辖任务	✅ 导出全部 [US-12]
数据看板	仅看个人任务进度	整体进度 / 达人排名	全局合规率 / 舆情风控
系统配置	❌ 无权	❌ 无权	✅ 规则库/阈值/白名单/区域合规 [US-10]
用户管理	❌ 无权	✅ 管理所属达人	✅ 管理代理商与达人

---

1.1 各端导航结构 (Navigation Structure)

达人端 (Mobile-First)

┌─────────────────────────────────────┐
│  底部导航栏 (Tab Bar)                │
├─────────┬─────────┬─────────┬───────┤
│  🏠     │  📤     │  🔔     │  👤   │
│  任务   │  上传   │  消息   │  我的 │
└─────────┴─────────┴─────────┴───────┘

代理商端 (Desktop Sidebar)

┌──────────────────────────────────────────────┐
│  📊 工作台 (Dashboard)                        │
│  📋 Brief 管理                                │
│  ✅ 审核台 (Review)                           │
│  👥 达人管理                                  │
│  📈 数据报表                                  │
│  ⚙️ 设置                                      │
└──────────────────────────────────────────────┘

品牌方端 (Desktop Sidebar)

┌──────────────────────────────────────────────┐
│  📊 数据看板 (Analytics)                      │
│  🛡️ 规则配置 (Rule Engine)                   │
│  📋 审计日志 (Audit Log)                      │
│  👥 代理商管理                                │
│  🔔 舆情预警                                  │
│  ⚙️ 系统设置                                  │
└──────────────────────────────────────────────┘

---

2. 界面详解：达人端 (The Creator Portal)

设计目标： 极简、透明、减少焦虑。让达人像发朋友圈一样简单地完成合规检查。 核心设备： 手机浏览器 (Mobile Web) / 小程序。

2.1 任务列表页 (Task List)

• 状态概览： 卡片式布局，显示当前任务状态（待提交、AI审核中、需修改、已通过）。
• 行动号召 (CTA): 针对不同状态显示醒目按钮，如 [上传脚本] 或 [查看修改意见]。

2.2 智能上传与扫描页 (The Magic Scanner) [US-03, US-07]

这是达人等待 AI 结果的页面，必须缓解等待焦虑（Wait-time Anxiety）。

• 文件支持： 支持粘贴文本、上传文档、上传视频文件（≤ 100MB，1080p）
• 透明思考 UI： 实时显示 AI 处理进度
  • 屏幕中央显示 AI 正在扫描的动态波纹
  • 进度指示器： 显示当前处理阶段和预估剩余时间
  • 滚动日志 (Rolling Log): 实时显示 AI 动作，例如：

    🔍 正在解析 Brief 核心卖点... 👁️ 正在逐帧检测竞品 Logo... 🧠 正在分析口播情感色彩... ✅ 口播检测完成，正在核对卖点覆盖...

• 离开提示： 深度审核约需 1-3 分钟，可选择离开并通过微信通知结果

2.3 审核结果反馈页 (Audit Report)

当 AI 发现问题时，不能直接把 JSON 扔给达人，要翻译成“人话”。

• 结果横幅：

• 🔴 未通过 (Blocked): 存在硬性违规，必须修改。

• 🟡 建议修改 (Warning): 存在舆情风险或卖点遗漏，建议优化。

• 🟢 AI 初审通过: 已自动转交人工复核。

• 修改清单 (Action Items):

• 时间轴跳转： 点击报错条目，视频自动跳转到对应秒数（例如 00:15）。

• 错误详情：

• 错误类型： 广告法违禁词

• 原内容： “全网第一”

• AI建议： 建议改为“深受喜爱”或“销量领先”。

• 申诉入口：

  • 在每一条报错旁边提供 [ 申诉 ] 按钮
  • 申诉弹窗：
    • 显示剩余令牌数量（如：剩余 2 次）
    • 令牌配额基于达人信用评分（历史表现越好，配额越高）
    • 提供理由输入框（必填，≥ 10 字）
    • 可上传补充证据（截图、链接等）
  • 申诉流程： 提交 → 代理商仲裁 → 结果通知
  • 令牌返还： 申诉成功后令牌自动返还

2.4 消息通知中心 (Notification Center)

达人需要及时获知任务状态变化，避免反复主动查询。

• 通知类型：

  • 🔔 任务分配： "您有一个新任务【XX品牌618推广】，请在 3 天内提交脚本"
  • ✅ 审核通过： "恭喜！您的视频已通过审核，可安排发布"
  • ❌ 需要修改： "您的视频有 2 处需修改，点击查看详情"
  • 💬 申诉结果： "您的申诉已通过，AI 已学习您的反馈"

• 通知渠道：

  • App 内消息中心（必选）
  • 微信服务号推送（可选）
  • 短信提醒（仅紧急/超时）

2.5 历史记录页 (History)

• 任务归档： 按品牌/时间筛选已完成的任务
• 数据统计：
  • 累计完成任务数
  • 一次通过率（个人）
  • 平均修改轮次
• 证书导出： 支持导出"合规达人"认证徽章（达到一定通过率后解锁）

---

3. 界面详解：代理商端 (The Agency Console)

设计目标： 高效、批量、上帝视角。 核心设备： 桌面端 (Desktop Web)。

3.1 工作台 (Dashboard)

• 待办事项： 醒目显示 待人工复核 (12)、申诉待仲裁 (3)。
• 项目概览： 显示当前 Brief 下的所有达人提交进度条。

3.2 Brief 配置中心 (Brief Setup) [US-01, US-02]

• 全能解析器： 巨大的拖拽上传区域
  • 支持 PDF/Word/Excel/PPT/图片上传
  • 在线文档链接导入： 支持飞书/Notion 等已授权分享链接
    • ⚠️ 重要约束： 仅支持用户授权的分享链接；不得绕过权限或抓取受限内容
• 投放平台选择： 选择目标平台（抖音/小红书/B站等），自动加载对应平台规则库
• 区域合规切换： 不同地区投放可切换对应法规与平台规则版本
• 规则确认区 (Split View):
  • 左侧：原始 PDF/文档预览
  • 右侧：AI 提取出的结构化规则表单（可编辑）
    • 必含词： [美白] [淡斑] (支持手动增删)
    • 禁忌词： [药用] [治疗]
    • 参考图： (显示 AI 从 Brief 提取的 3 张参考图)
  • 规则冲突提示： 若 Brief 要求与平台规则冲突，高亮显示并给出建议

3.3 核心审核决策台 (The Review Cockpit) ✨ 核心功能 [US-05, US-08]

这是系统最复杂的界面，用于人工复核 AI 的结果。

布局结构：

• 左侧：视频播放器

  • 智能进度条： 进度条上打满 colored dots
    • 🔴 红点：硬伤（点击跳转）
    • 🟠 橙点：油腻/舆情风险
    • 🟢 绿点：成功识别到的卖点（High-light）
  • 画中画参考： 播放器角落可悬浮 Brief 中的参考图，方便对比（如对比手持产品的手势）

• 右侧：AI 检查单 (The Checklist)

  • 分区一：硬性合规 (Hard Rules) — 必须处理
    • [✅] 违禁词检测
    • [✅] 竞品 Logo 检测
  • 分区二：Brief 完成度 (Brief Compliance)
    • [❌] 卖点：未提及"24小时持妆" (AI 提示：全程未检测到相关语义)
  • 分区三：舆情雷达 (Sentiment Radar) [US-06]
    • [⚠️] 00:42 油腻预警： 达人表情过于夸张，建议检查
    • ⚠️ 重要说明： 软性风险（油腻/爹味/性别偏见等）仅作提示，不强制拦截，需人工复核确认

• 底部：决策栏 (Action Bar)

  • [ 驳回 ]：点击后，自动将勾选的问题打包发送给达人
  • [ 强制通过 ] [US-09]：忽略 AI 的黄色警告，强制放行
    • 必须填写放行原因（如"达人玩的新梗，品牌方认可"）
    • 记录审批人与操作时间，纳入审计日志
  • [ 记录为特例 ]：将当前判断记录为规则白名单/豁免条款
    • 需品牌方确认后生效
    • 如需用于模型优化，必须确保数据授权与合规评估
  • [ 通过 ]：流程结束

3.4 版本比对视窗 (Diff View) [US-13]

当达人提交 V2 版本时触发。

• 顶部统计摘要：

  ┌─────────────────────────────────────────────────────┐
  │  📊 版本差异报告                                      │
  │  V1 版本指出 3 个违规点：✅ 已修复 2 个 | ❌ 未修复 1 个 │
  └─────────────────────────────────────────────────────┘
  

• 双屏模式： 左侧 V1，右侧 V2（同步播放）
• 差异高亮：
  • 右侧列表仅显示 "V1 报错点" 的修复情况
  • 状态：已修复 ✅ 或 未修复 ❌
  • 点击条目可跳转到对应时间戳，V1/V2 同步定位
• 快速决策： 若所有违规点均已修复，提供"快速通过"按钮

3.5 达人管理 (Creator Management)

• 达人列表：

  • 显示所有关联达人的基本信息、信用评分、历史通过率
  • 支持按平台（抖音/小红书/B站）、状态（活跃/休眠）筛选

• 达人画像卡片：

  • 基本信息：昵称、平台账号、粉丝量级
  • 合作数据：累计任务数、一次通过率、平均响应时长
  • 信用评分：基于历史表现的信用分（影响申诉令牌配额）

• 批量操作：

  • 批量分配任务
  • 批量发送催促通知
  • 批量导出达人数据

3.6 数据报表 (Analytics Reports)

• 项目维度：

  • 当前项目进度：已提交 / 审核中 / 已通过 / 待修改
  • 平均审核周期（从提交到最终通过）
  • 修改轮次分布图

• 达人维度：

  • 达人排行榜（按通过率、响应速度）
  • 问题达人预警（连续多次未通过）

• 问题类型分析：

  • 高频违规词 TOP 10
  • 常见遗漏卖点统计
  • 舆情风险分布

• 导出功能：

  • 支持导出 Excel/PDF 格式
  • 支持定时邮件订阅周报

3.7 批量操作中心 (Batch Operations) [US-11]

• 批量上传： 支持 ZIP 压缩包批量上传多个视频
• 批量审核： 对无问题项批量通过（需二次确认）
• 批量导出： 一键导出选中任务的审核报告
  • 支持 Excel/PDF 格式
  • 包含完整审核证据链

---

4. 界面详解：品牌方端 (The Brand Admin)

设计目标： 监管、配置、数据沉淀、风险预警。 核心设备： 桌面端 (Desktop Web)。

4.1 数据看板 (Executive Dashboard) ✨ 核心功能

品牌方需要一目了然地掌握整体合规状况。

对应 PRD 成功指标：人工投入时长、初审通过率、召回率/误报率、舆情一致性

顶部指标卡片：

┌─────────────┬─────────────┬─────────────┬─────────────┬─────────────┐
│  📊 本月    │  ✅ 初审    │  🎯 硬性    │  ⚠️ 舆情    │  ⏱️ 平均   │
│  审核总量   │  通过率     │  召回率     │  拦截数     │  审核周期   │
│  1,234      │  78.5%      │  96.2%      │  23         │  4.2 小时   │
│  ↑12%       │  ↑5.2%      │  目标≥95%   │  ↓18%       │  目标≤5分钟 │
└─────────────┴─────────────┴─────────────┴─────────────┴─────────────┘

可视化图表区：

• 趋势图： 近 30 天审核量与通过率趋势
• 问题分布： 饼图展示违规类型占比（违禁词 / 竞品 / 舆情 / 卖点遗漏）
• 代理商对比： 柱状图对比各代理商的审核效率与通过率
• 热力图： 问题高发时段分布（帮助优化审核资源配置）
• 舆情一致性： 软性风控判断与人工复核的一致率（目标 ≥ 80%）

风险预警区：

• 🔴 紧急： "代理商A在过去24小时内有5条视频触发'竞品露出'，请关注"
• 🟠 关注： "达人B连续3次提交未通过，建议沟通"
• 🟡 舆情： "本周舆情风险拦截数异常上升，建议检查阈值设置"

4.2 全局规则配置 (Rule Engine) [US-10]

• 黑白名单管理：

  • 禁用词库： 支持分类管理（广告法 / 平台规则 / 品牌私有）
  • 竞品列表： 上传竞品 Logo 图库，支持相似度阈值设置
  • 白名单： 允许特定达人/场景豁免某些规则
  • 特例记录： 查看从审核台记录的豁免条款，支持确认/撤销

• 区域合规配置：

  • 支持按投放地区切换法规版本（中国大陆 / 港澳台 / 海外）
  • 不同地区规则库独立管理
  • 切换时自动校验现有 Brief 与新规则的兼容性

• 舆情阈值设置：

  • 调整 AI 对"油腻"、"性感"、"争议话题"的敏感度
  • 支持 High / Medium / Low 三档
  • 支持按平台差异化配置（抖音 vs 小红书）
  • ⚠️ 提示： 舆情风险仅作提示，不作为强制拦截依据

• 规则版本管理：

  • 规则变更历史可追溯（含变更人、变更时间、变更内容）
  • 支持回滚到历史版本
  • 变更需审批生效（防止误操作）
  • 平台规则同步： 抖音/小红书规则变更时，系统在 1 工作日内更新并通知

4.3 代理商管理 (Agency Management)

• 代理商列表：

  • 显示合作代理商及其绑定的品牌项目
  • 数据指标：管理达人数、审核量、通过率、平均周期

• 权限配置：

  • 可见的 Brief 范围
  • 是否允许"强制通过"
  • 申诉仲裁权限

• 绩效评估：

  • 代理商月度评分卡
  • 问题率对比排名

4.4 审计日志 (Audit Log) [US-12]

• 列表视图： 查看所有审核记录，支持高级筛选

  • 按时间范围 / 代理商 / 达人 / 审核结果筛选
  • 关键词搜索（搜索视频标题、报错内容）

• 详情页： 点击任意记录查看完整审核链路

  • 原始视频（带时间戳标注）
  • AI 检测报告全文
  • 人工决策记录（谁在什么时间做了什么操作）
  • 申诉记录（如有）

• 证据链导出： 生成符合法务要求的 PDF 报告，包含：

  • 时间戳： 所有操作的精确时间记录
  • 截图： AI 报错对应的视频截图
  • 规则依据： 触发的规则版本与具体条款
  • 审核人： 操作人身份与电子签名
  • 规则版本号： 审核时使用的规则库版本
  • 模型版本号： AI 检测时使用的模型版本
  • 完整操作日志（不可篡改）

4.5 舆情预警中心 (Brand Safety Center)

• 实时监控：

  • 近期被 AI 标记为"舆情风险"的视频列表
  • 按风险等级排序（高 / 中 / 低）

• 案例库：

  • 历史舆情事件归档
  • 作为培训素材供代理商学习

• 预警规则：

  • 配置自动通知规则（如：高风险视频自动 @品牌方）

---

5. 交互状态与反馈规范 (UX States)

为保证体验流畅，需定义以下关键交互状态：

状态 (State)	界面反馈 (UI Behavior)	文案示例 (Micro-copy)
上传中	进度条 + 剩余时间预估	"正在上传视频 (35%)... 请勿关闭页面"
排队中	队列位置提示	"前面还有 3 个任务，AI 马上就到..."
处理中 (长时)	允许离开提示	"深度审核约需 3 分钟。您可以先去喝杯咖啡，结果将通过微信通知您。"
解析失败	错误引导 + 手动兜底	"无法读取此 PDF 内容。请检查文件是否加密，或[切换到文本输入模式]。"
申诉成功	激励动效 (Confetti)	"申诉生效！令牌已返还。AI 正在学习您的反馈。"

---

6. 设计风格指导 (Design Guidelines)

• 色调 (Palette):

• 科技蓝 (Tech Blue): 用于 AI 正在思考、扫描的状态。

• 警示红 (Alert Red): 用于硬性阻断。

• 风险橙 (Risk Orange): 用于舆情/油腻提示。

• 安全绿 (Safe Green): 用于通过、合规项。

• 字体 (Typography): 清晰的无衬线字体，确保在视频播放器旁的密集文字依然易读。

• 动效 (Motion): 仅在"AI 处理中"使用微动效（波纹、扫描光效），强调系统的智能化属性；审核台保持静态高效。

---

7. 响应式设计规范 (Responsive Design)

7.1 断点定义 (Breakpoints)

设备类型	断点范围	适用角色
Mobile	< 768px	达人端（主要）
Tablet	768px - 1024px	达人端（辅助）、代理商外出场景
Desktop	> 1024px	代理商端、品牌方端（主要）

7.2 各端适配策略

• 达人端 (Mobile-First):

  • 单列布局，卡片式信息展示
  • 底部固定导航栏
  • 视频播放器全屏优先
  • 手势操作支持（左滑删除、下拉刷新）

• 代理商端 (Desktop-First):

  • 侧边栏导航（可折叠）
  • 多列布局，支持分屏操作
  • Tablet 下侧边栏自动收起为图标模式

• 品牌方端 (Desktop-Only):

  • 数据看板响应式网格布局
  • 图表自适应容器宽度
  • 最小支持宽度 1280px

---

8. 无障碍设计 (Accessibility / a11y)

8.1 基本要求

• WCAG 2.1 AA 级合规
• 颜色对比度： 文字与背景对比度 ≥ 4.5:1
• 键盘导航： 所有交互元素可通过 Tab 键访问
• 屏幕阅读器： 关键元素提供 ARIA 标签

8.2 具体实现

场景	无障碍要求
颜色标识	红/黄/绿状态不仅用颜色，同时用图标和文字区分
视频播放器	提供字幕轨道、支持键盘控制播放/暂停/跳转
表单	所有输入框有明确的 label 关联
错误提示	错误信息同时通过颜色、图标、文字三种方式呈现
动效	提供"减少动态效果"选项，尊重系统偏好设置

---

9. 错误处理与边界情况 (Error Handling)

9.1 错误类型与处理策略

错误类型	触发场景	用户提示	技术处理
网络错误	请求超时/断网	"网络不给力，请检查连接后重试"	自动重试 3 次，指数退避
上传失败	文件过大/格式不支持	"文件格式不支持，请上传 MP4/MOV 格式"	前端预校验 + 后端双重验证
解析失败	Brief PDF 加密/损坏	"无法读取此文件，请检查是否加密"	提供手动输入降级方案
AI 服务异常	模型超时/不可用	"AI 正在休息，请稍后重试"	自动进入队列，恢复后继续处理
权限不足	越权操作	"您没有权限执行此操作"	记录日志，通知管理员
并发冲突	多人同时编辑	"其他用户正在编辑，请刷新后重试"	乐观锁 + 版本号校验

9.2 空状态设计 (Empty States)

页面	空状态提示	引导动作
任务列表	"暂无任务，等待品牌方分配"	显示品牌方联系方式
审核队列	"太棒了！所有任务都已处理完毕"	显示历史数据入口
搜索结果	"未找到匹配结果"	建议调整筛选条件
数据看板	"暂无数据，审核开始后将自动生成"	显示示例数据

9.3 加载状态规范 (Loading States)

• 骨架屏 (Skeleton): 列表页、卡片区域使用骨架屏占位
• 进度条： 文件上传显示精确进度百分比
• Spinner： 短时操作（< 3s）使用旋转加载图标
• 进度提示： 长时操作显示预计剩余时间和当前步骤

---

10. 附录

10.1 页面清单 (Page Inventory)

角色	页面名称	优先级	备注
达人	任务列表	P0	MVP
	智能上传页	P0	MVP
	审核结果页	P0	MVP
	消息中心	P1
	历史记录	P2
代理商	工作台	P0	MVP
	Brief 配置	P0	MVP
	审核决策台	P0	MVP
	版本比对	P1
	达人管理	P1
	数据报表	P2
品牌方	数据看板	P0	MVP
	规则配置	P0	MVP
	审计日志	P1
	代理商管理	P1
	舆情预警	P2

10.2 设计资源

• 设计稿 (Figma): [待补充]
• 组件库 (Design System): [待补充]
• 图标库 (Icon Set): [待补充]