docs: add homepage workbench redesign spec
This commit is contained in:
@@ -0,0 +1,313 @@
|
||||
# StoryForge 首页工作台改版设计
|
||||
|
||||
- 日期:2026-03-28
|
||||
- 状态:已完成脑暴与结构确认,待进入实现计划
|
||||
- 范围:`web/storyforge-web-v4`
|
||||
|
||||
## 1. 背景
|
||||
|
||||
当前首页存在几个持续影响使用效率的问题:
|
||||
|
||||
- 首屏同时铺开项目状态、重点账号、生产任务、依赖状态、说明性信息,阅读压力过高。
|
||||
- 信息密度主要靠文字解释堆出来,用户需要先“读懂页面”,才能开始做事。
|
||||
- 首页同时承担了工作台、汇报页、系统状态板三种角色,导致优先级混乱。
|
||||
- 管理员与普通用户共享首页主体是合理的,但系统级治理内容不应该继续挤占首页主体空间。
|
||||
|
||||
本次改版不重做视觉风格,不换皮,不重建整体导航语言。重点是沿用现有 Web V4 的工作台风格,对首页信息架构做减法和重排。
|
||||
|
||||
## 2. 目标与非目标
|
||||
|
||||
### 2.1 目标
|
||||
|
||||
- 用户打开首页后,第一眼能判断“今天先做什么”。
|
||||
- 首页默认站在“当前项目”视角,而不是全工作区汇总视角。
|
||||
- 保留项目概览能力,但把它降到动作判断之后。
|
||||
- 让首页从“说明页”变回“工作台”。
|
||||
- 管理员的系统级治理入口保留,但通过独立管理员配置台承接,不污染首页主体。
|
||||
- 为后续主 Agent 驱动首页动作推荐提供稳定的页面骨架。
|
||||
|
||||
### 2.2 非目标
|
||||
|
||||
- 本轮不重做全站视觉语言。
|
||||
- 本轮不重新设计左侧主导航。
|
||||
- 本轮不实现完整管理员配置台,只定义首页与管理员配置台的边界。
|
||||
- 本轮不实现主 Agent 新能力本身,只定义首页与主 Agent 的交互入口。
|
||||
|
||||
## 3. 设计原则
|
||||
|
||||
### 3.1 动作优先,说明后置
|
||||
|
||||
首页的第一职责不是解释系统做了什么,而是帮助用户决定下一步做什么。
|
||||
|
||||
### 3.2 当前项目优先于全局汇总
|
||||
|
||||
首页默认站在当前选中项目。全局工作区信息仅作为轻量上下文出现,不作为首页主体。
|
||||
|
||||
### 3.3 一次只让用户看一类信息
|
||||
|
||||
项目进度、重点账号、生产任务不再同时展开,而是通过 tab 切换,在同一内容区按需展示。
|
||||
|
||||
### 3.4 详细说明按需打开
|
||||
|
||||
首页仅保留做决定所需的最短说明。详细原因、执行计划、历史上下文收进详情页、弹层或主 Agent 窗口。
|
||||
|
||||
### 3.5 管理与业务分层
|
||||
|
||||
系统依赖健康、系统存储状态、系统级 Agent 管理、用户策略审计等系统治理信息,不再占首页主体,而由管理员配置台承接。
|
||||
|
||||
## 4. 最终推荐结构
|
||||
|
||||
本次确认采用“人类决策优先”的首页结构,也就是本地草图中的 `v6` 方向。
|
||||
|
||||
### 4.1 页面顺序
|
||||
|
||||
首页从上到下按以下顺序组织:
|
||||
|
||||
1. 页面标题与主操作
|
||||
2. 轻量上下文条
|
||||
3. “今天先做什么”动作区
|
||||
4. “项目概览”tab 区
|
||||
5. 全局主 Agent 悬浮入口
|
||||
|
||||
### 4.2 页面标题与主操作
|
||||
|
||||
顶部保留现有的页面标题区域,继续使用现在的样式体系:
|
||||
|
||||
- 标题:`项目总台`
|
||||
- 说明文字:保留极短说明,强调这是当前项目的工作决策入口
|
||||
- 右侧主操作:保留现有常用动作,例如 `新建项目 / 导入主页 / 创建 Agent`
|
||||
|
||||
该区域的职责是建立页面定位,不承担细节展示。
|
||||
|
||||
### 4.3 轻量上下文条
|
||||
|
||||
标题下方保留一条轻量上下文条,用于说明“我现在在哪”。
|
||||
|
||||
建议包含:
|
||||
|
||||
- 当前工作区
|
||||
- 当前项目
|
||||
- 账号数量
|
||||
- 任务数量
|
||||
- Agent 数量
|
||||
|
||||
交互要求:
|
||||
|
||||
- `当前项目` 必须可点击,并支持项目切换。
|
||||
- `账号 / 任务 / Agent` 以可点击胶囊入口呈现,分别跳到对应视图或筛选后的工作页。
|
||||
- 该区域不再承载大段文字,也不承载多余解释。
|
||||
|
||||
### 4.4 今天先做什么
|
||||
|
||||
这是首页第一优先级模块,也是本次改版的核心。
|
||||
|
||||
#### 结构
|
||||
|
||||
- 1 条主动作
|
||||
- 2 条次动作
|
||||
|
||||
#### 主动作
|
||||
|
||||
主动作展示为一张更醒目的主卡片,但仍保持现有卡片风格。
|
||||
|
||||
只保留:
|
||||
|
||||
- 动作标题
|
||||
- 一句最短原因
|
||||
- 2-3 个极短标签,例如 `最优先 / 预计耗时 / 关联类型`
|
||||
- 三个操作:`查看原因 / 去处理 / 交给主 Agent`
|
||||
|
||||
不再在首页内展开长说明。
|
||||
|
||||
#### 次动作
|
||||
|
||||
次动作展示为两条压缩行。
|
||||
|
||||
每条只保留:
|
||||
|
||||
- 编号
|
||||
- 动作标题
|
||||
- 一句超短说明
|
||||
- 两个操作按钮
|
||||
|
||||
目的不是完整说明任务,而是提供“快速扫读与进入”的入口。
|
||||
|
||||
#### 推荐逻辑
|
||||
|
||||
- 首页默认展示 3 条今日动作。
|
||||
- 优先由主 Agent 生成。
|
||||
- 如果主 Agent 不可用,则回退到规则系统。
|
||||
- 推荐动作默认与当前项目绑定。
|
||||
|
||||
#### 与主 Agent 的关系
|
||||
|
||||
点击 `交给主 Agent` 时:
|
||||
|
||||
- 自动打开右下角主 Agent 悬浮窗口
|
||||
- 先展示执行计划确认卡
|
||||
- 用户确认后才开始执行
|
||||
- 执行进度在主 Agent 窗口里持续更新
|
||||
|
||||
### 4.5 项目概览 tab 区
|
||||
|
||||
项目概览保留,但下沉为第二优先级模块。
|
||||
|
||||
#### 顶部 tab
|
||||
|
||||
保留 3 个入口:
|
||||
|
||||
- 项目进度
|
||||
- 重点账号 / 对标
|
||||
- 生产任务
|
||||
|
||||
交互原则:
|
||||
|
||||
- 三者使用一致的卡片风格
|
||||
- 当前激活项有明显高亮
|
||||
- 只能在下方内容区展示当前 tab 的内容
|
||||
- 不允许把三类内容再次同时铺开
|
||||
|
||||
#### 内容区
|
||||
|
||||
下方只承接当前 tab 的内容。
|
||||
|
||||
例如:
|
||||
|
||||
- 选中“项目进度”时,只展示阶段信息、下一步和阶段风险
|
||||
- 选中“重点账号 / 对标”时,只展示重点对象和当前需要关注的变化
|
||||
- 选中“生产任务”时,只展示与生产执行有关的关键状态
|
||||
|
||||
要求:
|
||||
|
||||
- 内容区不得再重复出现其他 tab 的明细
|
||||
- 不再保留首页底部额外的“当前项目推进详情 / 重点账号对标”独立大区块
|
||||
- 所有详细内容通过 tab 切换进入,而不是继续堆在首页下面
|
||||
|
||||
### 4.6 主 Agent 悬浮入口
|
||||
|
||||
首页右下角保留全局主 Agent 悬浮入口。
|
||||
|
||||
定义如下:
|
||||
|
||||
- 对全站固定存在,不局限于首页
|
||||
- 在首页中承担“接住动作交接”的作用
|
||||
- 用户可最小化,让 Agent 后台继续运行
|
||||
- 再次打开时,能看到近期执行状态与工作进度
|
||||
|
||||
首页只负责给出入口,不负责承载完整对话信息。
|
||||
|
||||
## 5. 首页与管理员配置台边界
|
||||
|
||||
首页主体在管理员和普通用户之间保持一致。
|
||||
|
||||
管理员额外差异:
|
||||
|
||||
- 左侧导航出现 `管理员配置台`
|
||||
|
||||
管理员配置台承接的内容:
|
||||
|
||||
- 系统依赖健康
|
||||
- 系统存储状态
|
||||
- 系统级主 Agent 管理
|
||||
- 系统级平台 Agent 管理
|
||||
- 用户策略查看
|
||||
- 管理员覆盖查看、代改、回滚、审计
|
||||
|
||||
明确不放在管理员配置台首页中的内容:
|
||||
|
||||
- 说明性流程配置
|
||||
|
||||
明确不继续挤在首页主体中的内容:
|
||||
|
||||
- 系统依赖健康
|
||||
- 系统存储状态
|
||||
- 长跟踪摘要列表
|
||||
- 说明性流程卡片
|
||||
|
||||
## 6. Agent 与策略边界
|
||||
|
||||
本次首页改版需要遵守已确认的 Agent 逻辑:
|
||||
|
||||
- 全系统只有一个系统级主 Agent
|
||||
- 每个平台有系统级平台 Agent
|
||||
- 用户只与主 Agent 对话
|
||||
- 用户对平台策略的修改由主 Agent 理解并下发
|
||||
- 用户策略按用户隔离,不能影响其他用户
|
||||
- 用户策略支持长期与阶段性生效,默认长期
|
||||
- 管理员可以代改和回滚用户策略,但形成管理员覆盖层,不吞掉用户控制权
|
||||
- 用户侧需要明确看到管理员覆盖存在、原因和时间
|
||||
|
||||
这些规则不会在首页一次性完整展示,但会影响首页动作推荐与主 Agent 交接方式。
|
||||
|
||||
## 7. 状态与异常处理
|
||||
|
||||
### 7.1 无当前项目
|
||||
|
||||
若当前没有选中项目:
|
||||
|
||||
- 首页标题和上下文条仍保留
|
||||
- “今天先做什么”区域切成建项目/选项目导向
|
||||
- 概览区不展示业务数据,只展示项目切换或创建入口
|
||||
|
||||
### 7.2 主 Agent 不可用
|
||||
|
||||
若主 Agent 暂时不可用:
|
||||
|
||||
- 今日动作仍显示 3 条
|
||||
- 标注为“规则推荐”
|
||||
- `交给主 Agent` 按钮禁用或转为提示
|
||||
|
||||
### 7.3 当前 tab 无内容
|
||||
|
||||
若某个 tab 当前为空:
|
||||
|
||||
- 内容区展示极简空态
|
||||
- 提供进入对应模块的行动入口
|
||||
- 不用长段解释
|
||||
|
||||
## 8. 数据与实现影响
|
||||
|
||||
本次改版优先重组现有信息,不要求后端新增完整新接口。
|
||||
|
||||
前端可优先基于当前已有能力组织数据:
|
||||
|
||||
- `/v2/me/dashboard`
|
||||
- 当前项目数据
|
||||
- 当前项目相关账号/对标数据
|
||||
- 当前项目相关任务摘要
|
||||
- 主 Agent 推荐结果或规则回退结果
|
||||
|
||||
如现有 dashboard 数据不足,可在实现阶段补最小必要字段,但应避免为首页堆出新的大而全接口。
|
||||
|
||||
## 9. 实现边界建议
|
||||
|
||||
为了降低风险,建议按以下顺序实现:
|
||||
|
||||
1. 先重排首页骨架顺序
|
||||
2. 再把“今天先做什么”改成 `1 主 2 次`
|
||||
3. 再把项目概览改成单内容区 tab
|
||||
4. 最后移除首页中冗余的重复区块
|
||||
|
||||
这次实现不应同时重做其他页面。
|
||||
|
||||
## 10. 验收标准
|
||||
|
||||
改版完成后,应满足以下标准:
|
||||
|
||||
- 用户打开首页后,首屏不会再看到大段堆叠说明
|
||||
- 首页第一屏可在 3 秒内读完主要信息
|
||||
- 用户能在第一屏明确看到“当前项目”和“今天先做什么”
|
||||
- 今日动作区是 `1 主 2 次` 结构
|
||||
- 项目概览采用 tab 切换,下方只显示当前分类内容
|
||||
- 首页不再保留重复的项目推进详情与重点账号详情大区块
|
||||
- 管理员配置台通过左侧导航独立进入,而不是继续塞在首页主体
|
||||
|
||||
## 11. 后续计划入口
|
||||
|
||||
当本 spec 通过后,下一步进入实现计划,重点拆为:
|
||||
|
||||
- 首页结构重排
|
||||
- 动作区轻量化
|
||||
- 概览 tab 单内容区切换
|
||||
- 管理员配置台入口显式化
|
||||
- 主 Agent 悬浮入口与动作交接衔接
|
||||
Reference in New Issue
Block a user