From b0a661069f4f7811cded30508cf279f6407f09dc Mon Sep 17 00:00:00 2001 From: Your Name Date: Mon, 2 Feb 2026 16:15:40 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E4=BB=A3=E7=90=86=E5=95=86?= =?UTF-8?q?=E7=AB=AF=E5=92=8C=E5=93=81=E7=89=8C=E6=96=B9=E7=AB=AF=E7=A7=BB?= =?UTF-8?q?=E5=8A=A8=E7=AB=AF=20UI=20=E8=AE=BE=E8=AE=A1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 代理商移动端 (3.8节)： - 移动端工作台：待审核/待仲裁/今日通过统计 - 快捷审核：外出场景下的紧急视频审核处理 - 任务列表：卡片式任务展示与筛选 - 消息中心：通知类型与快捷操作 品牌方移动端 (4.6节)： - 移动端数据看板：关键指标与趋势图 - 舆情预警：紧急/关注事项分级展示 - 审批中心：强制通过申请的移动端审批 - 审计日志：快速查询与证据链导出 设计原则： - 移动端定位为桌面端的轻量补充 - 复杂操作（规则配置等）引导至桌面端完成 - 支持横屏全屏视频预览 Co-Authored-By: Claude Opus 4.5 --- User_Role_Interfaces.md | 263 +++++++++++++++++++++++++++++++++++++++- 1 file changed, 260 insertions(+), 3 deletions(-) diff --git a/User_Role_Interfaces.md b/User_Role_Interfaces.md index 5d1236e..9798d09 100644 --- a/User_Role_Interfaces.md +++ b/User_Role_Interfaces.md @@ -17,6 +17,7 @@ | V0.1 | 2026-01-30 | Gemini | 初稿：角色权限、三端界面设计 | | V1.0 | 2026-02-02 | Claude | 审阅补充：导航结构、数据看板、响应式/无障碍设计、错误处理规范 | | V1.1 | 2026-02-02 | Claude | 与 RD/PRD 对齐：补充用户故事引用、区域合规、特例记录规范、证据链权限 | +| V1.2 | 2026-02-02 | Claude | 新增代理商端和品牌方端移动端 UI 设计（工作台、快捷审核、预警、审批） | --- @@ -28,7 +29,7 @@ | 功能模块 | 👤 达人 (Creator) | 👥 代理商 (Agency) | 🛡️ 品牌方 (Brand) | | --- | --- | --- | --- | -| **终端设备** | **Mobile (主) / Desktop** | **Desktop (主)** | **Desktop (主)** | +| **终端设备** | **Mobile (主) / Desktop** | **Desktop (主) / Mobile (辅)** | **Desktop (主) / Mobile (辅)** | | **Brief 管理** | 查看任务详情 | ✅ 上传/解析/编辑 Brief | ✅ 全局规则配置 | | **脚本/视频提交** | ✅ 上传 & 修改 [US-03] | ❌ 不可提交 | ❌ 不可提交 | | **查看 AI 报告** | ✅ 仅查看自己的 [US-07] | ✅ 查看所管辖达人的 | ✅ 查看所有 | @@ -65,6 +66,17 @@ └──────────────────────────────────────────────┘ ``` +### 代理商端 (Mobile Tab Bar) 📱 +``` +┌─────────────────────────────────────────────┐ +│ 底部导航栏 (Tab Bar) │ +├─────────┬─────────┬─────────┬─────────┬─────┤ +│ 🏠 │ ✅ │ 📋 │ 🔔 │ 👤 │ +│ 工作台 │ 审核 │ 任务 │ 消息 │ 我的│ +└─────────┴─────────┴─────────┴─────────┴─────┘ +``` +> 📱 **移动端定位：** 外出场景下的紧急审核处理、进度查看、消息通知，复杂配置操作引导至桌面端完成 + ### 品牌方端 (Desktop Sidebar) ``` ┌──────────────────────────────────────────────┐ @@ -77,6 +89,17 @@ └──────────────────────────────────────────────┘ ``` +### 品牌方端 (Mobile Tab Bar) 📱 +``` +┌─────────────────────────────────────────────┐ +│ 底部导航栏 (Tab Bar) │ +├─────────┬─────────┬─────────┬─────────┬─────┤ +│ 📊 │ 🔔 │ ✅ │ 📋 │ 👤 │ +│ 看板 │ 预警 │ 审批 │ 日志 │ 我的│ +└─────────┴─────────┴─────────┴─────────┴─────┘ +``` +> 📱 **移动端定位：** 关键指标查看、舆情预警响应、强制通过审批，规则配置等复杂操作引导至桌面端完成 + --- ## 2. 界面详解：达人端 (The Creator Portal) @@ -167,7 +190,7 @@ ## 3. 界面详解：代理商端 (The Agency Console) **设计目标：** 高效、批量、上帝视角。 -**核心设备：** 桌面端 (Desktop Web)。 +**核心设备：** 桌面端 (Desktop Web) 为主，移动端 (Mobile) 为辅。 ### 3.1 工作台 (Dashboard) @@ -296,12 +319,119 @@ * 支持 Excel/PDF 格式 * 包含完整审核证据链 +### 3.8 移动端界面 (Mobile Portal) 📱 + +**设计目标：** 外出场景下的紧急审核处理、进度监控、即时通知响应。 +**核心设备：** 手机浏览器 / 小程序 / App。 +**定位：** 桌面端的轻量补充，复杂操作引导至桌面端完成。 + +#### 3.8.1 移动端工作台 (Mobile Dashboard) + +``` +┌─────────────────────────────────────────────┐ +│ 📊 代理商工作台 [头像] │ +├─────────────────────────────────────────────┤ +│ ┌─────────────┐ ┌─────────────┐ │ +│ │ 🔴 待审核 │ │ ⚠️ 待仲裁 │ │ +│ │ 12 │ │ 3 │ │ +│ └─────────────┘ └─────────────┘ │ +│ ┌─────────────┐ ┌─────────────┐ │ +│ │ ✅ 今日通过 │ │ 📋 进行中 │ │ +│ │ 28 │ │ 45 │ │ +│ └─────────────┘ └─────────────┘ │ +├─────────────────────────────────────────────┤ +│ 📌 紧急待办 │ +│ ├─ 🔴 达人A视频 - 竞品露出 (2小时前) │ +│ ├─ 🟠 达人B申诉 - 待仲裁 (30分钟前) │ +│ └─ 🟡 达人C视频 - AI审核完成 │ +├─────────────────────────────────────────────┤ +│ 🏠 ✅ 📋 🔔 👤 │ +│ 工作台 审核 任务 消息 我的 │ +└─────────────────────────────────────────────┘ +``` + +#### 3.8.2 移动端快捷审核 (Quick Review) + +**场景：** 外出时收到紧急审核通知，需快速处理。 + +``` +┌─────────────────────────────────────────────┐ +│ ← 返回 快捷审核 ⋮ 更多 │ +├─────────────────────────────────────────────┤ +│ ┌─────────────────────────────────────┐ │ +│ │ │ │ +│ │ 📹 视频播放器 │ │ +│ │ (支持横屏全屏) │ │ +│ │ │ │ +│ │ advancement bar with colored dots │ │ +│ │ 🔴──🟠────────🟢────────────────── │ │ +│ └─────────────────────────────────────┘ │ +├─────────────────────────────────────────────┤ +│ 🔴 硬性问题 (1) 展开 ▼│ +│ ├─ 00:15 竞品Logo露出 [点击跳转] │ +├─────────────────────────────────────────────┤ +│ 🟠 舆情提示 (1) 展开 ▼│ +│ ├─ 00:42 油腻风险 (仅提示) │ +├─────────────────────────────────────────────┤ +│ 🟢 卖点覆盖 (3/4) 展开 ▼│ +├─────────────────────────────────────────────┤ +│ │ +│ [ 驳回 ] [ 通过 ] [强制通过▼] │ +│ │ +└─────────────────────────────────────────────┘ +``` + +**交互说明：** +* 点击问题条目自动跳转到视频对应时间点 +* 横屏模式下视频全屏播放，问题列表收起为浮层 +* "强制通过"需输入原因，记录审批人 +* 复杂编辑（如修改 Brief）提示"请在电脑端操作" + +#### 3.8.3 移动端任务列表 (Task List) + +``` +┌─────────────────────────────────────────────┐ +│ 📋 任务列表 🔍 筛选 ▼ │ +├─────────────────────────────────────────────┤ +│ ┌─────────────────────────────────────┐ │ +│ │ 🔴 XX品牌618推广 - 达人A │ │ +│ │ 竞品露出 · 待审核 · 2小时前 │ │ +│ │ [查看详情] │ │ +│ └─────────────────────────────────────┘ │ +│ ┌─────────────────────────────────────┐ │ +│ │ 🟡 XX品牌618推广 - 达人B │ │ +│ │ AI审核完成 · 待确认 · 1小时前 │ │ +│ │ [快捷审核] │ │ +│ └─────────────────────────────────────┘ │ +│ ┌─────────────────────────────────────┐ │ +│ │ ✅ XX品牌618推广 - 达人C │ │ +│ │ 已通过 · 今天 14:30 │ │ +│ │ [查看报告] │ │ +│ └─────────────────────────────────────┘ │ +├─────────────────────────────────────────────┤ +│ 🏠 ✅ 📋 🔔 👤 │ +└─────────────────────────────────────────────┘ +``` + +#### 3.8.4 移动端消息中心 (Notifications) + +* **通知类型：** + * 🔴 **紧急：** 硬性违规视频需处理 + * 🟠 **申诉：** 达人申诉待仲裁 + * 🟢 **完成：** 达人提交新版本 / 审核通过 + * 📊 **日报：** 每日审核数据汇总（可配置推送时间） + +* **快捷操作：** + * 通知卡片支持左滑"标记已读" + * 点击直接跳转对应任务 + * 支持按类型筛选 + --- ## 4. 界面详解：品牌方端 (The Brand Admin) **设计目标：** 监管、配置、数据沉淀、风险预警。 -**核心设备：** 桌面端 (Desktop Web)。 +**核心设备：** 桌面端 (Desktop Web) 为主，移动端 (Mobile) 为辅。 ### 4.1 数据看板 (Executive Dashboard) ✨ *核心功能* @@ -405,7 +535,134 @@ * **预警规则：** * 配置自动通知规则（如：高风险视频自动 @品牌方） +### 4.6 移动端界面 (Mobile Portal) 📱 +**设计目标：** 随时掌握关键指标、即时响应舆情预警、紧急审批处理。 +**核心设备：** 手机浏览器 / 小程序 / App。 +**定位：** 数据查看与紧急响应，规则配置等复杂操作引导至桌面端完成。 + +#### 4.6.1 移动端数据看板 (Mobile Dashboard) + +``` +┌─────────────────────────────────────────────┐ +│ 📊 品牌看板 2026-02-02 ▼ │ +├─────────────────────────────────────────────┤ +│ ┌─────────────────────────────────────┐ │ +│ │ 本月审核总量 初审通过率 │ │ +│ │ 1,234 78.5% │ │ +│ │ ↑12% ↑5.2% │ │ +│ └─────────────────────────────────────┘ │ +│ ┌─────────────────────────────────────┐ │ +│ │ 硬性召回率 平均审核周期 │ │ +│ │ 96.2% 4.2 小时 │ │ +│ │ 目标≥95% ✅ 目标≤5分钟 ✅ │ │ +│ └─────────────────────────────────────┘ │ +├─────────────────────────────────────────────┤ +│ 📈 趋势图 (近7天) [查看详情 >]│ +│ ┌─────────────────────────────────────┐ │ +│ │ ╱╲ ╱╲ │ │ +│ │ ╱ ╲╱ ╲ ← 通过率趋势 │ │ +│ │ ╱ ╲ │ │ +│ └─────────────────────────────────────┘ │ +├─────────────────────────────────────────────┤ +│ 📊 🔔 ✅ 📋 👤 │ +│ 看板 预警 审批 日志 我的 │ +└─────────────────────────────────────────────┘ +``` + +#### 4.6.2 移动端舆情预警 (Alert Center) + +**场景：** 收到舆情预警推送，需快速查看并决策。 + +``` +┌─────────────────────────────────────────────┐ +│ 🔔 舆情预警 全部已读 │ +├─────────────────────────────────────────────┤ +│ 🔴 紧急预警 (2) │ +│ ┌─────────────────────────────────────┐ │ +│ │ ⚠️ 代理商A - 竞品露出集中爆发 │ │ +│ │ 过去24小时内5条视频触发 │ │ +│ │ 10分钟前 [查看 >] │ │ +│ └─────────────────────────────────────┘ │ +│ ┌─────────────────────────────────────┐ │ +│ │ ⚠️ 达人B - 高风险舆情内容 │ │ +│ │ 疑似性别偏见言论 │ │ +│ │ 30分钟前 [查看 >] │ │ +│ └─────────────────────────────────────┘ │ +├─────────────────────────────────────────────┤ +│ 🟠 关注事项 (3) │ +│ ┌─────────────────────────────────────┐ │ +│ │ 📋 达人C连续3次提交未通过 │ │ +│ │ 建议与代理商沟通 │ │ +│ │ 2小时前 [详情 >] │ │ +│ └─────────────────────────────────────┘ │ +├─────────────────────────────────────────────┤ +│ 📊 🔔 ✅ 📋 👤 │ +└─────────────────────────────────────────────┘ +``` + +#### 4.6.3 移动端审批中心 (Approval Center) + +**场景：** 代理商申请"强制通过"，品牌方需审批。 + +``` +┌─────────────────────────────────────────────┐ +│ ✅ 待审批 筛选 ▼ │ +├─────────────────────────────────────────────┤ +│ 待处理 (3) │ +│ ┌─────────────────────────────────────┐ │ +│ │ 🟡 强制通过申请 │ │ +│ │ 达人：@小美美 │ │ +│ │ 申请人：代理商A - 张三 │ │ +│ │ 原因：达人玩的新梗，品牌方认可 │ │ +│ │ ┌─────────────────────────────┐ │ │ +│ │ │ 📹 点击查看视频片段 │ │ │ +│ │ └─────────────────────────────┘ │ │ +│ │ AI报错：00:42 油腻风险 │ │ +│ │ │ │ +│ │ [ 拒绝 ] [ 批准 ] │ │ +│ └─────────────────────────────────────┘ │ +├─────────────────────────────────────────────┤ +│ 已处理 (12) [查看 >] │ +├─────────────────────────────────────────────┤ +│ 📊 🔔 ✅ 📋 👤 │ +└─────────────────────────────────────────────┘ +``` + +**交互说明：** +* 点击视频片段可预览关键时间点 +* 批准/拒绝需二次确认 +* 批准后自动通知代理商和达人 +* 审批记录同步至审计日志 + +#### 4.6.4 移动端审计日志 (Audit Quick View) + +``` +┌─────────────────────────────────────────────┐ +│ 📋 审计日志 🔍 搜索 │ +├─────────────────────────────────────────────┤ +│ 筛选：全部 ▼ 代理商 ▼ 时间 ▼ │ +├─────────────────────────────────────────────┤ +│ ┌─────────────────────────────────────┐ │ +│ │ ✅ XX品牌618推广 - 达人A │ │ +│ │ 状态：已通过（强制） │ │ +│ │ 审批人：李四 · 今天 14:30 │ │ +│ │ [查看详情] [导出证据链] │ │ +│ └─────────────────────────────────────┘ │ +│ ┌─────────────────────────────────────┐ │ +│ │ ❌ XX品牌618推广 - 达人B │ │ +│ │ 状态：已驳回 │ │ +│ │ 原因：竞品Logo露出 │ │ +│ │ [查看详情] │ │ +│ └─────────────────────────────────────┘ │ +├─────────────────────────────────────────────┤ +│ 📊 🔔 ✅ 📋 👤 │ +└─────────────────────────────────────────────┘ +``` + +**移动端功能边界：** +* ✅ 支持：数据查看、预警响应、审批处理、日志查询、证据链导出 +* ❌ 不支持（引导至桌面端）：规则配置、阈值调整、代理商权限管理、复杂报表分析 ---