Yuzhiran Dev
332 lines
19 KiB
Plaintext
332 lines
19 KiB
Plaintext
# 宇之然工作台改造方案 — 极简实用 AI Agent 时代设计
|
||
|
||
> 调研日期: 2026-06-16
|
||
> 基于 2026 年 AI 产品设计趋势 + 现有工作台全面审计
|
||
|
||
---
|
||
|
||
## 一、现有工作台问题分析
|
||
|
||
### 1.1 当前页面结构
|
||
|
||
| 页面 | 定位 | 问题 |
|
||
|------|------|------|
|
||
| `/index.html` 仪表盘 | 系统概览 + 模块状态 + 近期计划 | **系统视角**，不是用户视角。6 张统计卡片 + 6 个定时模块卡片 + 调度状态 → 像运维面板，不像创作工作台 |
|
||
| `topics.html` 选题 | 选题表格 CRUD + 批量操作 | 功能完整但无聊。没有 AI 辅助选题推荐，没有智能排序 |
|
||
| `metrics.html` 数据 | 统计看板 + 图表 | 功能 OK，但与 GEO/搜索排名/合规数据分离在不同页面 |
|
||
| `calendar.html` 日历 | 内容日历 | 独立页面，与选题/数据割裂 |
|
||
| `tasks.html` 任务 | 流水线执行记录 | 展示后端调度状态，普通用户看不懂 |
|
||
| `admin.html` 系统管理 | 13 个 Tab 的后台 | 混入了业务功能（AI助手、搜索排名、GEO） |
|
||
| `assets.html` 素材 | 素材管理 | 基础功能 |
|
||
| `landing.html` 官网 | 产品官网 | ✅ 独立、清晰 |
|
||
|
||
### 1.2 核心问题
|
||
|
||
1. **仪表盘是「系统监控」不是「创作工作台」**
|
||
- 一进来看到的是定时任务状态（热点趋势/采集/创作/审查），不是「我今天要做什么」
|
||
- 缺少任务优先级、待办提醒、进度概览
|
||
- 对于内容编辑来说，模块卡片（scheduler 状态）毫无意义
|
||
|
||
2. **导航/信息架构是「功能菜单」不是「创作流程」**
|
||
- 六个平级菜单项：仪表盘、选题、数据、日历、素材、任务
|
||
- 没有工作流意识 — 用户需要在多个页面跳转来完成一个创作流程
|
||
- 缺少「最近工作」「快速开始」等具有上下文感的入口
|
||
|
||
3. **AI 能力是「附加功能」不是「内嵌体验」**
|
||
- AI 助手是右下角浮窗 chatbot，与工作流分离
|
||
- AI 选题分析在选题页弹窗里，AI 写文章在发布流程里
|
||
- 没有 Agent 工作区 — 没有一个地方能看到 AI 正在做什么、做了什么、需要什么审批
|
||
|
||
4. **权限与功能混杂**
|
||
- 业务功能（搜索排名、GEO 优化、AI 助手）锁在 admin.html 里
|
||
- 普通用户使用需要切换到「系统管理」—— 概念上就不对
|
||
|
||
5. **缺少「Agent 时代」的核心交互模式**
|
||
- ❌ 没有 Plan-first（先展示计划，再执行）
|
||
- ❌ 没有 AI 操作轨迹/审计
|
||
- ❌ 没有任务编排/Agent 工作区
|
||
- ❌ 没有智能建议/预测
|
||
- ✅ 但已经有一个基础的 AI 助手浮窗底座
|
||
|
||
---
|
||
|
||
## 二、2026 AI 产品设计趋势映射
|
||
|
||
### 从 7 个趋势看我们应该做什么
|
||
|
||
| # | 趋势 | 对我们意味着什么 |
|
||
|---|------|----------------|
|
||
| 1 | **UX → AX (Agentic Experience)** | 工作台需要展示 AI 的**行动计划**和**执行轨迹**，而不是单纯的界面操作 |
|
||
| 2 | **Plan-first 交互** | 选题→创作→发布 应该有一个**流程预览**步骤，AI 先展示「我将做 A→B→C」，用户确认后再执行 |
|
||
| 3 | **Invisible AI (嵌入式 AI)** | AI 不应该是右下角聊天窗，而应该嵌入到选题列表（智能排序）、文章编辑（实时优化建议）、日历（智能排期）|
|
||
| 4 | **Delegation with Control** | 用户需要看到一个「代理仪表盘」— AI 正在做什么、已完成什么、需要审批什么 |
|
||
| 5 | **Workspace over Chat** | 从「跟 AI 对话」到「AI 作为团队成员在共享空间工作」|
|
||
| 6 | **预览→差异→确认 模式** | 所有 AI 生成/修改的内容，先展示 diff/预览，再确认写入 |
|
||
| 7 | **审批路径和可逆性** | 每一步操作都有 undo 路径和操作历史 |
|
||
|
||
---
|
||
|
||
## 三、改造方案设计
|
||
|
||
### 3.1 总体信息架构重构
|
||
|
||
```
|
||
当前: 目标:
|
||
┌──────────┐ ┌──────────────────┐
|
||
│ 仪表盘 │ ← 系统视角 │ 工作台 (首页) │ ← 用户视角
|
||
│ 选题 │ │ ├─ 今日待办 │
|
||
│ 数据 │ │ ├─ 创作流水线 │
|
||
│ 日历 │ │ ├─ 智能建议 │
|
||
│ 素材 │ │ └─ 最近工作 │
|
||
│ 任务 │ ├──────────────────┤
|
||
│ 系统管理 │ │ 内容工厂 │ ← 创作流程
|
||
└──────────┘ │ ├─ 选题工作区 │
|
||
│ ├─ AI 创作工作区 │
|
||
│ ├─ 发布工作区 │
|
||
│ └─ 内容日历 │
|
||
├──────────────────┤
|
||
│ 数据洞察 │ ← 效果分析
|
||
│ ├─ 数据看板 │
|
||
│ ├─ 搜索排名 │
|
||
│ ├─ GEO 就绪度 │
|
||
│ └─ 合规报告 │
|
||
├──────────────────┤
|
||
│ 资产库 │ ← 资源管理
|
||
├──────────────────┤
|
||
│ 系统管理 (admin) │ ← 仅管理员
|
||
```
|
||
|
||
### 3.2 工作台首页（全新设计）
|
||
|
||
**目标**：一打开就知道今天要做什么、进度如何、有什么需要关注
|
||
|
||
```
|
||
┌─────────────────────────────────────────────────┐
|
||
│ ☀️ 早上好，张三 你的团队本周已发布 3 篇内容 │
|
||
├─────────────────────────────────────────────────┤
|
||
│ ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐ │
|
||
│ │ 待处理│ │ 待审查│ │ 待发布│ │ 本月 │ │ 合规 │ │
|
||
│ │ 选题 │ │ 文章 │ │ 内容 │ │ 目标 │ │ 健康 │ │
|
||
│ │ 12 │ │ 5 │ │ 3 │ │ 67% │ │ 94% │ │
|
||
│ └──────┘ └──────┘ └──────┘ └──────┘ └──────┘ │
|
||
├─────────────────────────────────────────────────┤
|
||
│ 📋 今日待办 │
|
||
│ ┌─────────────────────────────────────────────┐ │
|
||
│ │ 🔴 审查「远程办公的 5 个陷阱」- 逾期 2 天 │ │
|
||
│ │ 🟡 审核「AI 写作工具实测」- AI 已完稿 │ │
|
||
│ │ 🔵 确认本周排期 - 3 篇待定稿 │ │
|
||
│ └─────────────────────────────────────────────┘ │
|
||
├─────────────────────────────────────────────────┤
|
||
│ 🤖 AI Agent 工作区 │
|
||
│ ┌─────────────────────────────────────────────┐ │
|
||
│ │ 📡 热点采集 ✅ 完成 (12 条新趋势) │ │
|
||
│ │ ✍️ 文章创作 ⏳ 进行中 (2/5 篇) │ │
|
||
│ │ 🔍 合规审查 ⏳ 排队中 (3 篇待审) │ │
|
||
│ │ 📊 数据同步 ⏰ 06:00 自动运行 │ │
|
||
│ │ │ │
|
||
│ │ [查看 Agent 轨迹 →] │ │
|
||
│ └─────────────────────────────────────────────┘ │
|
||
├─────────────────────────────────────────────────┤
|
||
│ 💡 AI 智能建议 │
|
||
│ ┌─────────────────────────────────────────────┐ │
|
||
│ │ 💡 「碳中和」关键词本周搜索量 ↑47% │ │
|
||
│ │ 建议创建一篇相关选题 │ │
|
||
│ │ [一键创建选题 →] │ │
|
||
│ │ 💡 你的知乎上周互动率 ↑12% │ │
|
||
│ │ 建议继续保持数据分析深度 │ │
|
||
│ └─────────────────────────────────────────────┘ │
|
||
├─────────────────────────────────────────────────┤
|
||
│ 📅 近期计划 │
|
||
│ ┌──────────┬──────────────────┬──────────┐ │
|
||
│ │ 06/17 二 │ 远程办公工具对比 │ 知乎发布 │ │
|
||
│ │ 06/18 三 │ AI 写作体验 │ 公众号 │ │
|
||
│ │ 06/19 四 │ 零浪费生活指南 │ 小红书 │ │
|
||
│ └──────────┴──────────────────┴──────────┘ │
|
||
└─────────────────────────────────────────────────┘
|
||
```
|
||
|
||
### 3.3 内容工厂（创作流水线重构）
|
||
|
||
**目标**：按创作流程组织，而不是按数据表组织
|
||
|
||
#### 选题工作区
|
||
- **AI 智能选题板**：热点趋势 + 关键词热度 + 历史数据 → 推荐选题
|
||
- **选题看板**：Kanban 视图（待处理→分析中→已评分→待创作）
|
||
- **批量操作**：AI 一键分析 → 自动评分 → 自动排序
|
||
- **卡片预览**：题目的核心观点、受众痛点、差异化切入点和评分一览
|
||
|
||
#### AI 创作工作区 (NEW)
|
||
- **创作任务面板**：显示所有进行中的 AI 创作任务
|
||
- **Plan-first 流程**：用户选择选题 → AI 展示大纲 → 用户确认 → AI 逐节写作
|
||
```
|
||
步骤 1: 选择选题 + 平台
|
||
步骤 2: AI 生成大纲 (展示预览)
|
||
步骤 3: 用户调整大纲 (拖拽排序/编辑)
|
||
步骤 4: AI 逐节写作 (进度条展示)
|
||
步骤 5: 合规审查 (展示问题列表)
|
||
步骤 6: 用户最终编辑
|
||
```
|
||
- **Agent 执行轨迹**：每次 AI 操作都有时间线记录
|
||
- **在线编辑器**：统一的富文本编辑器，支持实时 AI 优化建议
|
||
|
||
#### 发布工作区
|
||
- **发布检查清单**：AI 自动检查合规、字数、配图、格式
|
||
- **一键多平台发布**：选题→三平台各自适配→预览→确认发布
|
||
- **发布历史**：时间线视图
|
||
|
||
### 3.4 AI Agent 工作区（新概念页面）
|
||
|
||
**这是本次改造的核心创新亮点** — 一个展示 AI 作为「团队成员」工作状况的看板。
|
||
|
||
```
|
||
┌─────────────────────────────────────────────────┐
|
||
│ 🤖 AI Agent 工作区 │
|
||
├─────────────────────────────────────────────────┤
|
||
│ 🔴 活跃任务 │
|
||
│ ┌─────────────────────────────────────────────┐ │
|
||
│ │ ✍️ 正在创作「远程办公的 5 个陷阱」→ 知乎版 │ │
|
||
│ │ 进度: ████████░░ 78% │ │
|
||
│ │ 当前步骤: 撰写第 3 节「团队协作挑战」 │ │
|
||
│ │ [预览] [暂停] [取消] │ │
|
||
│ │ │ │
|
||
│ │ 🔍 正在审查「AI 写作工具实测」- 小红书版 │ │
|
||
│ │ 进度: ████░░░░░░ 35% │ │
|
||
│ │ 发现 2 个合规问题 │ │
|
||
│ │ [查看详情] │ │
|
||
│ └─────────────────────────────────────────────┘ │
|
||
├─────────────────────────────────────────────────┤
|
||
│ ⏳ 待审批 │
|
||
│ ┌─────────────────────────────────────────────┐ │
|
||
│ │ 📝 大纲待确认 「零浪费生活指南」 │ │
|
||
│ │ 已由 AI 自动生成，等待你审核 │ │
|
||
│ │ [查看大纲] [确认] [修改] │ │
|
||
│ │ │ │
|
||
│ │ 📄 文章待审 「碳中和入门」已完稿 │ │
|
||
│ │ 合规评分 92/100，2 条建议 │ │
|
||
│ │ [审阅] [通过] [退回修改] │ │
|
||
│ └─────────────────────────────────────────────┘ │
|
||
├─────────────────────────────────────────────────┤
|
||
│ ✅ 今日已完成 │
|
||
│ ┌─────────────────────────────────────────────┐ │
|
||
│ │ ✅ 采集热点 12 条 → 生成 3 个新选题 │ │
|
||
│ │ ✅ 同步数据指标 → 知乎互动率 +12% │ │
|
||
│ └─────────────────────────────────────────────┘ │
|
||
└─────────────────────────────────────────────────┘
|
||
```
|
||
|
||
### 3.5 数据洞察（统一分析中心）
|
||
|
||
将当前分散的数据功能整合：
|
||
|
||
| Tab | 功能 | 来源 |
|
||
|-----|------|------|
|
||
| 概览 | 总指标 + 趋势图 | 现有 metrics.html |
|
||
| 搜索排名 | 关键词排名追踪 | 现 admin.html 搜索排名 |
|
||
| GEO 就绪度 | AI 搜索优化评分 | 现 admin.html GEO |
|
||
| 合规报告 | 发布前合规检查历史 | 现 admin.html + 优化报告 |
|
||
| 平台对比 | 知乎/公众号/小红书数据 | 现有 metrics.html |
|
||
|
||
### 3.6 导航改造
|
||
|
||
```javascript
|
||
// 现有 navItems (硬编码):
|
||
[{dashboard, topics, metrics, calendar, assets, tasks}]
|
||
// admin 额外: [admin]
|
||
|
||
// 目标 navItems (按角色动态):
|
||
// 编辑:
|
||
[{工作台(top), 内容工厂(factory), 数据洞察(insights), 资产库(assets)}]
|
||
// 管理员:
|
||
内容工厂 + 数据洞察 + 资产库 + 系统管理(admin)
|
||
```
|
||
|
||
导航从「功能清单」变成「流程引导」：
|
||
- **工作台** = 首页（今日待办 + Agent 状态 + 智能建议）
|
||
- **内容工厂** = 创作全流程（选题→创作→发布→日历）
|
||
- **数据洞察** = 所有数据分析入口
|
||
- **资产库** = 素材管理
|
||
|
||
### 3.7 移动端适配
|
||
|
||
当前移动端只是隐藏表格换卡片，改造后：
|
||
- 底部 Tab 导航栏（代替顶部汉堡菜单）
|
||
- 工作台首页简化为：今日待办 + Agent 状态 + 快速操作按钮
|
||
- 内容工厂：简易 Kanban，手势左右切换阶段
|
||
- AI Agent: 推送通知代替实时面板
|
||
|
||
---
|
||
|
||
## 四、实施优先级
|
||
|
||
### P0 — 快速见效 (1-2 天)
|
||
这些改动小但体验提升大：
|
||
|
||
| 改动 | 文件 | 工作量 |
|
||
|------|------|--------|
|
||
| 仪表盘改为用户视角（统计卡片 = 待办数量而不是系统模块） | `index.html` | 半天 |
|
||
| 将 AI 助手从浮窗升级为半屏面板 | `ai-assistant.js` | 半天 |
|
||
| 导航改为新架构（工作台/内容工厂/数据洞察/资产库） | `uni-nav.js` | 半天 |
|
||
|
||
### P1 — 核心重构 (3-5 天)
|
||
| 改动 | 涉及 | 工作量 |
|
||
|------|------|--------|
|
||
| 内容工厂页面（创作流水线） | 新建 `factory.html` | 2 天 |
|
||
| AI Agent 工作区 | 新建 `agent.html` | 2 天 |
|
||
| 数据洞察整合（合并 GEO/搜索排名） | 改造 `metrics.html` | 1 天 |
|
||
|
||
### P2 — 增强功能 (5-7 天)
|
||
| 改动 | 工作量 |
|
||
|------|--------|
|
||
| Plan-first 创作流程（大纲预览→确认→执行） | 3 天 |
|
||
| Agent 执行轨迹/审计时间线 | 2 天 |
|
||
| 智能选题推荐面板 | 2 天 |
|
||
| 移动端全面适配 | 2 天 |
|
||
|
||
### P3 — AI 原生体验 (后续)
|
||
| 改动 | 工作量 |
|
||
|------|--------|
|
||
| 智能排期 / 内容策略建议 | 3 天 |
|
||
| 自动化工作流编排（拖拽编排 Agent 任务） | 5 天 |
|
||
| 多 Agent 协作（采集 Agent + 写作 Agent + 审查 Agent） | 5 天 |
|
||
|
||
---
|
||
|
||
## 五、关键设计原则
|
||
|
||
1. **用户视角 > 系统视角**
|
||
- 展示「我今天要做什么」而不是「系统正在运行什么」
|
||
- 统计数字 = 行动信号（待办数量）而不是监控指标
|
||
|
||
2. **流程 > 功能**
|
||
- 按创作流程组织页面（选题→创作→发布→分析）
|
||
- 不在功能之间跳转，在流程中前进
|
||
|
||
3. **AI 是团队成员，不是工具**
|
||
- 展示 AI 的工作计划、进度、产出
|
||
- 用户是「审核者/决策者」而不是「操作者」
|
||
- 核心模式：用 AI → AI 执行 Plan → 用户审核/批准
|
||
|
||
4. **预览→确认→执行**
|
||
- AI 生成的所有内容：先预览/展示差异，再确认
|
||
- 所有操作可逆，有撤销路径
|
||
|
||
5. **极简不极简功能**
|
||
- 减少平级菜单数量和页面复杂
|
||
- 不减少功能 — 用上下文和流程引导代替功能罗列
|
||
|
||
---
|
||
|
||
## 六、与当前改造项目的关系
|
||
|
||
本次工作台改造与正在进行的数据隔离/权限升级是 **互补关系**：
|
||
|
||
| 改造线 | 范围 | 依赖 |
|
||
|--------|------|------|
|
||
| **数据隔离+权限** (当前进行中) | 后端架构、数据安全 | 无 |
|
||
| **工作台极简改造** (本方案) | 前端 UI/UX、信息架构 | 权限系统就绪后可基于角色定制页面 |
|
||
|
||
建议：
|
||
1. 先完成数据隔离和权限基础 — 这是安全基石
|
||
2. 工作台改造可以在权限未完全就绪时就开始前端改造（不依赖后端）
|
||
3. 导航的 role-based 显示可以利用现有的 `/api/menus/active` 接口
|