Anywhere Door
Anywhere Door 是什么?
一个跨标签页的 AI 生成状态层,让用户在当前页面看见所有任务,并一键回到已完成的对话。
用户痛点
多个 AI 标签并行之后,等待本身不耗时,反复确认状态才消耗注意力。
日常工作里通常同时开着 4 至 6 个 ChatGPT 和 Gemini 标签页,每个页面都在处理不同任务。向 A 模型发出问题后切到 B 模型继续工作,但 A 何时完成并没有统一信号。
现有动作是记住每个标签,再逐一打开确认。标签页越多,用户越容易把任务状态、上下文和下一步都留在短期记忆里。
浏览器容器与任务状态的三层断裂
1 感知层:标签页不表达生成状态
标签标题只能说明页面存在,无法说明当前任务正在等待、生成、完成还是报错。用户看到的是容器,缺少状态。
2 操作层:检查状态必须切换页面
切换六个标签页只为确认一句回复是否完成,认知恢复与鼠标操作会反复打断当前工作。
3 注意层:完成事件没有主动出口
生成完成本应被告知,但浏览器不会把这类页面事件汇总给用户,最后只能依靠人工轮询。
根因判断:浏览器标签页负责容纳页面,不负责汇总页面内部正在发生的任务。Anywhere Door 增加的是跨标签页状态层。
设计方案
把状态放回当前画布,并用统一状态机隔离不同 AI 平台的 DOM 差异。
1 浮窗与 Eye Icon 是同一信息层的两种密度
完整浮窗负责浏览与跳转;Eye Icon 在遮挡内容时保留状态提醒。位置记忆跨标签页同步,收起后仍能感知任务变化。
2 用推断式状态机替代单一 DOM 监听
状态来自多个弱信号的组合:DOM 变化、aria-busy、Stop 按钮、消息文本变化与错误标记共同推断当前阶段。
3 平台 Adapter 隔离变化,状态机与面板保持稳定
ChatGPT 与 Gemini 的 DOM 结构不同,平台层只负责翻译信号。新增平台时扩展适配器,不复制核心逻辑与界面。
- Platform Adapter 每个平台只维护 DOM 选择器与信号来源。
- Signal Fusion 组合 DOM 变化、aria-busy、Stop 按钮与文本变化。
- Core State 统一推断 idle、waiting、generating、done 与 error。
- Panel UI 同一套浮窗、通知与跳转交互消费统一状态。
4 轻量、现代、丝滑的安心感
明暗主题保持同一信息层级,柔和通知音承担完成反馈,展开与状态过渡降低打断感。
结果与反思
从个人痛点到可用版本约两小时,随后通过真实使用逐步补齐通知、主题与收起模式。
- 角色
- 产品设计、交互设计、视觉设计与扩展开发
- 状态
- 已发布,Chrome Web Store v1.0.2
- 技术栈
- Manifest V3、Vanilla JS、CSS Custom Properties
快速进入真实环境是正确的。个人工具先抵达可用状态,才能让后续判断建立在真实行为上。迭代从状态灯与跳转,逐步加入声音通知、桌面通知、Eye Icon、位置记忆与自适应主题。
品牌约束应更早进入版本。设计宪章把“轻量、现代、丝滑”和“安心感”固定为判断标准,避免默认样式与强提醒音效在早期版本里积累。
下一步是补充生成耗时。完成状态只回答“是否结束”,耗时信息还能帮助用户比较模型与任务类型,进一步优化并行工作流。