Agent-System-Documents/docs/proposals/2026-10-12-work-companion-ui-design.md

title, revision, status, date, owner, scope, implementation, delivery, project-record

title	revision	status	date	owner	scope	implementation	delivery	project-record
面向非专业用户的工作台整体界面重设计	r0.2	approved-for-continuous-implementation	2026-10-12	weichen	requirements-and-design	implemented	tracked-in-dev-task-record	persisted

工作台整体界面重设计 r0.2

用户在评审 r0.1 后明确授权“开始实施直到完成”。本稿 r0.2 保留已选设计，并通过本次独立任务连续实施、验证、Review 与合入。已有快慢通道执行方案的其他增量不由界面授权自动扩大。

1. 设计目标

让不懂命令、脚本、模型和代理的用户，通过表达目标、提供材料、查看结果、完成必要确认来推进工作。

默认界面回答三件事：现在在做什么，已经得到什么，下一步是否需要我处理。用户能够只用对话完成主要工作，也能在需要时展开工作摘要、阅读文件、核对依据。

用户明确要求：不要过于复杂；以辅助工作为中心；渐进、多层级展示；减少命令和脚本细节；大气、现代、简约、美观、易用。

本稿的场景假设：主要工作包括材料整理、分析比较、问题审查和文档生成，兼顾日常问答。业务领域的具体审批和发布入口按当前服务端能力提供。

2. 推荐形态与备选

推荐渐进展开的三栏工作台。左侧找项目与历史，中间通过对话推进工作，右侧按需处理工作或文件。普通问答默认收起右栏，复杂工作时提供概览；用户手动收起后不因普通更新反复打开。

形态	适用和取舍	本稿选择
渐进三栏	对话入口清晰，复杂任务可展开，文件有稳定位置	推荐
纯对话	学习成本低；长文件、并行工作和多次确认容易淹没在历史消息中	作为轻量状态
总览仪表盘	跨任务监控方便；默认要求用户理解更多指标和导航	仅在确有项目总览需求时另审

不单独建设快通道页、慢通道页或后台管理页。新增功能先判断能否放进现有对话、工作和文件入口。

3. 界面布局

左栏：上下文。 项目身份集中出现一次；新建对话、最近对话、搜索；文件和已启用的领域工作区放底部；账户与个人设置沉底。管理员操作只由管理员入口提供。

中栏：推进工作。 当前对话标题；用户的目标和材料；助手的结论、简短说明、必要动作；输入区上方一条工作状态。附件入口始终易找。权限设置保留清晰入口，展开说明其实际含义；初次使用采用现有默认值，不暗中扩大授权。

右栏：工作 / 文件。 工作按需要你处理、当前关注的工作、其他进行中或排队、新成果排列。完成历史收纳后仍可找回。文件负责列表、预览、编辑和下载；全屏阅读是同一个预览的放大。来源点击也进入同一预览对象，定位能力不足时说明定位范围。

左栏约 200–240，工作右栏约 320–420，中央弹性。正式落地继续消费已有拖拽宽度和文件阅读档规则。空间不足时先隐藏辅助栏；手机显示一个主视图，工作和文件按需打开，并有明确返回对话入口。

4. 渐进展示层级

层级	显示内容	打开方式
L0 概览	后台工作数量、必要确认、新成果	一条状态行或小徽标
L1 摘要	业务目标、真实状态、当前工作、最多 3 条重要发现、缺项、下一步	当前任务卡或对话锚点
L2 依据与范围	阶段结果、来源、覆盖范围、未决问题和结论更正	原位置展开
L3 执行记录	按工作阶段分组的动作、结果和有权限查看的诊断信息	明确点击执行记录

默认 L0/L1，不展开所有任务。必要确认、重要限制和失败影响不能藏在 L2/L3。L3 不是模型内部思考的展示入口，也不改变日志和来源的访问权限。

示例任务卡：

整理三份项目材料 · 进行中
正在核对：会议结论与需求说明
当前发现：上线时间出现两种说法；3 项需求缺少验收条件
待核查：评审意见中的补充要求
查看依据与范围

没有阶段成果时诚实显示“尚无阶段结论，正在读取材料”。以上业务发现是示例数据，当前 U1 骨架并不证明已经具备真实阶段发现发布能力。

5. 快慢通道的连续体验

用户界面主要使用“助手正在处理”“后台继续整理”等业务语言。快通道是当前对话回合，慢通道是后台工作，不是由用户选择的快慢速度档位。

时刻	用户看到的内容	表述边界
发消息或材料	接收结果、可先回答的内容、接下来处理的范围	已选文件不等于上传成功；解析不等于分析完成
任务登记或排队	同一工作对象显示已登记、排队中	登记成功才能说已登记；未开跑不能写进行中
工作进行中	当前工作、真实阶段结果、缺项	没有可信进度就不显示百分比或预计完成时间
用户继续输入	后台继续工作时可继续对话；前台忙时说明消息排队	发送不等于即时执行，不承诺已改变正在跑的任务
有新成果	更新原卡；重要结果提供一条对话通知	不逐条回投工具动作，不把所有任务复制成另一条聊天流
等待用户	操作、范围、影响和明确选择	等待、执行、生成、用户认可和正式发布分开
完成或失败	结论、最多 3 个要点、范围或缺项、文件和下一步	保存失败不得声称已交付；部分完成不能冒充完整结果

后台更新不切换用户正在读的文件，不抢焦点，不把历史阅读强行滚到底部。状态恢复期间保留最后已知内容并注明“正在重新连接，最新进展待确认”。

6. 按工作选择展示形式

统一骨架保持稳定，内容形态随任务改变。默认由工作目的决定，用户无需先学习或配置一种展示模式。

工作	默认成果形式	进一步展开
简单问答	一段结论，必要说明	依据与例子
材料整理	主要结论、问题和缺项	材料覆盖清单、来源
方案比较	一条建议、关键差异表	判断依据、取舍和适用条件
问题审查	按影响排列的问题清单	原文、影响、处理建议
文档生成	草稿文件、完成范围、需要评审的事项	文件预览与后续修订
多步骤流程	当前阶段、已完成阶段、必要动作	阶段结果与历史
用户确认	简明操作说明、影响、选择	参数与诊断详情

图表仅在数量、趋势或关系能帮助判断时使用；可理解的短表不升级成图表。生成式任务页面作为可选增强，关闭插件后仍能通过任务卡、文字和文件读到主要结果。领域审批不能成为所有基座任务的固定步骤。

7. 等待确认与异常

确认卡先写操作及影响，例如“依据三份材料新增 1 份项目草稿，保留原件，不对外发送”。涉及覆盖、发送、发布或权限变化时，关键对象和影响必须在默认层显示。避免只有“是否执行”而没有范围。

对话和右栏操作同一确认对象。提交中阻止重复提交；已处理同步更新；超时显示“正在核实处理结果”，查清后再允许后续动作。示例稿只演示本地状态同步，不证明服务端幂等和恢复。

异常表述使用“发生了什么 → 对结果的影响 → 用户可以做什么”。例：“评审意见未能读取；已整理另外两份材料，完整结论尚未生成；可补充清晰版本或先讨论已有结果”。错误代码、脚本与输出置于授权可读的详情。动作只按服务端当前能力显示；未核验的暂停、独立取消、续跑、自动重试不进入默认设计。

8. 视觉规则

沿用 DESIGN.md 和 @ui/tokens.css：灰白表面阶梯、单色反色主按钮、发丝边框、克制语义色；清晰的标题与正文层级；常用信息保持可读，不以缩小字号装下所有内容。

大气来自稳定分栏、整齐对齐、合理阅读行长和区块间距；简约来自减少同时出现的内容。没有营销式大标题、装饰渐变、速度表盘、满屏彩色卡片或默认工具日志。

字型走 --fs-ui-，界面字号可调。状态同时有文字和形状。折叠消费 @ui Collapsible，动效只用 mk- 并响应减少动效。交互稿复制固定 UI 令牌，实际使用当前 Collapsible 源码与 MotionKit，不新建颜色和动效体系。

9. 当前依据与依赖

本轮只读源码核对，来源 SELF；没有对生产或当前 dev 服务作功能验收。

对象	固定提交	核对点
Dev	4d362537d0e8755a03b1757b5bad92779a064b33	DESIGN.md、policy/delivery.md、既有规划
Frontend	1edd872c554f666ba43353da7e6f0605ecec311b	Workbench.tsx、Conversation.tsx、Workspaces.tsx
Backend	acabb85e2ae970f834defae916c7539d0a47993d	spawnBackgroundOpts、CancelRun、createBackgroundCard、finishBackgroundCard
UI	83e80f5648649c3cc070f4dbc6bf118996828ae8	tokens.css、Collapsible.tsx、motion.css
Documents	3cc6438030	快慢通道展示 r1.1 及 U1 实施计划

当前读到的源码已有三栏“工作 / 文件”、前台忙时输入排队、后台并行限制、排队工作、精炼卡片骨架以及失败 CardFailed 映射。这里只说明源码形状，不推断已部署与运行表现。

与既有方案衔接：modules/documents/docs/proposals/2026-10-12-fast-slow-channel-display.md 是快慢通道摘要与异步投影的已有主记录；本稿补充整体交互与各种成果形式，不另起一套状态或快照契约。U2/U3/U4 的真实阶段发现、持久恢复、确认闭环和窄屏完善继续以原记录及后续批准为准。

10. 实施需求

以下为本次界面实施与验收范围；实现消费真实已有能力，不伪造尚未发布的阶段发现。

ID	需求	优先级	可判定的验收方向
UI01	对话能完成主要工作	P0	关右栏仍能读摘要、核对依据、处理确认、打开成果
UI02	普通问答保持轻量	P0	无后台工作时不生成空任务卡和空进度条
UI03	默认内容可支持下一步	P0	用户能说明当前工作、结果范围、必要下一动作
UI04	快慢通道连续展现	P0	前后台并行、排队和完成状态归属正确且不重复刷屏
UI05	四层渐进阅读	P0	默认无命令日志，关键限制和确认不被折叠藏起
UI06	成果按目的呈现	P1	整理、比较、审查和生成各能支持对应工作判断
UI07	状态与动作忠实	P0	不伪造进度，不暴露未支持控制，不把失败显示成功
UI08	同一文件同一预览	P0	对话、来源、文件列表均进入同一预览位置
UI09	确认结果一致	P0	双入口、重复点击、超时未知和已处理均有一致表现
UI10	阅读稳定	P0	普通后台更新不抢焦点、换文件或改阅读位置
UI11	窄屏和大字可用	P0	320/390/736/1024/1440 及 18px 字号必要动作可达
UI12	遵守设计系统	P0	令牌、Collapsible、MotionKit、对比度守护符合规范
UI13	能力与权限匹配	P0	未启用领域入口不显示；摘要与来源不绕过访问控制

最终产品验收场景：三个附件无文字发送；前后台并行及排队；确认双入口；完整/部分/失败结果；查看来源与文件；刷新和断线；新对话；窄屏、大字、键盘及减少动效。r0.1 设计评审时，真实模型、真实后端和真实浏览器任务验收均为 NOT_RUN；实施期结果见第 13 节，示例交互稿不能代替验收。

11. 落地次序建议

1. 整体界面与文案。 在既有三栏和 U1 上整理默认内容、必要操作和阅读路径。优先确定 UI01–UI03/UI05/UI08/UI12；不在此增量改变后台执行契约。
2. 动态工作摘要。 接续既有快慢通道 U2/U3，在真实快照与检查点之上显示业务发现、范围和恢复状态；避免另外安排重复任务。
3. 成果形式与适配。 衔接 U4，完成比较、审查、可选任务页面、窄屏和具体领域入口。先用结构化文字/表格，再增强生成式展示。

r0.1 布局与展示已获连续实施授权，当前按 r1 计划交付界面。完成本增量后的首选衔接仍是既有快慢通道 U2/U3 的真实阶段发现与恢复验收；需先核对其在途任务和批准范围，不能由本界面任务重复启动或改变路由。

12. 授权与实施记录

来源：2026-10-12 用户在本聊天评审 r0.1 后指示“开始实施直到完成”。模式 authorized-continuous；阶段 1–10 在本稿界面范围内连续推进，平台门禁和高后果双钥匙保留。启动检查从已登记干净 Dev 检出捕获，后由 make task-start 创建 feature/work-companion-ui，并导入原始 SELF 收据。保护主检出的 Frontend 更新与其他任务现场。

实施计划见 r1；进展和原始证据仅维护于 Dev .task/feature-work-companion-ui.md。PR、CI、Review、合入与部署分别记载，不因本授权预先标为通过。

13. 实施进展与能力边界

2026-10-12：渐进任务卡、轻量对话/输入、响应三栏和单一异步状态投影已形成可审阅候选。SELF 验证包括 Frontend 210 与 UI 155 单元测试、类型/设计守护/knip、Dev make test 与 make build；现有 Playwright 11 个展示场景、6 个移动导航场景及隔离 HTTP/MockRunner 2 个真实接口链路场景通过。原始命令、精确对象和完整输出以 Dev 任务卡为准，测试成功不推断已经合入或部署。

原始独立代码 Review 已完成，必要问题均已有整改候选；最终精确版本复审、组合 CI 与合入进展只维护在 Dev 任务主记录，方案正文不复制第二份交付状态。UI 仓原 CI 在下载 GitHub action 时失败，交付补充改用既有平台固定 SHA 检出和 Node22 镜像，保留原测试；安全和规范 Review 及实际平台结果均须记录。

动态摘要只消费系统发布的真实内容：缺少阶段发现时显示诚实占位，不生成示例百分比、ETA 或虚构成果。真实模型阶段发现质量 NOT_RUN，后台自动路由和模型提示词未在本增量修改。旧运行服务未更新；最终组合、Review、GATE 和本任务安全收口以 Dev 主记录为准。