Fuse:浏览器内的就地 sensemaking 支持工具
作者
文献标题
Fuse: In-Situ Sensemaking Support in the Browser
文献信息
- 主题领域: 人机交互 (HCI)、在线信息整合与任务管理
- 关键词: 浏览器插件, 感知辅助系统, 信息组织, 卡片式设计, 在线研究, 层级结构, 可视化
研究背景与问题
-
存在问题:
- 人们在网络中搜集和组织信息时面临高额的切换成本(如浏览器标签过载、使用外部工具整理数据)。
- 传统浏览器标签和剪辑工具缺乏将信息“收集”和“组织”流畅连接的能力,容易打断用户的工作流程。
- 页面上下文、信息来源以及个人注释在现有工具中难以有效保存和结构化。
- 尽管某些工具允许剪辑网页内容,但仍需要切换应用来组织这些内容,无法实现数据收集与整合的一体化。
-
重要性: 用户需要一个系统来轻松从网页中提取关键信息,同时在原位置(浏览器内)完成结构化整理,为重启任务提供支持,并减少信息处理的认知负荷。
-
研究动机与相关工作: 研究动机基于“流畅感知支持”的理念,即希望打造一种工具能扩展用户的工作记忆,将感知任务合理外化至信息系统中,同时保留可视化参考和组织能力。Fuse 的设计灵感来源于已有工具如 Evernote、hypothes.is 和 Pinterest 的剪辑功能,以及基于卡片和侧栏的在线信息管理方式,但在现有工具中添加了即时组织和统一工作空间的能力。
解决方案
-
方法与解决方案: 作者设计了 Fuse,一款浏览器插件,通过一个始终可用的侧边栏实现低成本的内容收集与轻量级的内容组织。它允许用户:
- 从网页快速剪辑信息(文本、图像、截图等)。
- 在同一界面中组织收集的内容,如创建层级结构和嵌套卡片。
- 可视化表达信息,同时压缩显示不同类型的内容。
-
创新之处:
- 提供了五种轻量化的剪辑方法,让用户能够快速采集多种内容(如图片拖拽、文本高亮、边界框剪辑等)。
- 引入“容器卡片”(Container Cards)的概念,通过层级嵌套减少组织复杂性,并支持快速预览。
- 实现了内容的多种压缩和表示形式,如“读者视图”和“快速概览”,允许用户在有限的侧边栏空间内浏览大量内容。
- 支持边界剪辑 HTML 元素并自动保存其原状态(例如文字、链接、页面截图等),让数据收集具有上下文。
- 用户随时可快速暂停、继续浏览内容,提高任务恢复的效率。
-
实施步骤与关键技术:
- 使用 TypeScript 开发核心逻辑(约 37,000 行代码)及 React 构建 UI。
- 运用 Firebase 实现用户身份认证和项目存储。
- 使用 Chrome 浏览器扩展框架,使侧边栏与网页内容无缝嵌合。
- 部署至 Chrome 应用商店并通过在线用户反馈持续优化设计。
研究成果
-
具体成果:
- Fuse 提供了一个统一的在线研究工作空间,使用户能够同时收集和组织信息,极大降低了切换成本。
- 在 22 个月的公共部署中,共吸引了 134 名用户安装插件,其中有 89 名用户创建了包含实际内容的项目。
- 实验表明,Fuse 在购物、旅游规划、学术文献综述等多种任务情境下都具有很高的使用价值。
-
优势: 与已有工具相比,Fuse 实现了“在浏览器内部操作”的目标,不需要用户跳转到其他应用就可以组织信息。此外,其零摩擦的工作流程和可视化组织体验在减少认知负担方面效果显著。
-
实验与评估结果:
- 用户访谈显示,Fuse 的卡片式侧栏设计帮助用户快速浏览和复用其信息集合,有效支持任务恢复。
- 40.3% 的项目被分类为“自我参考”,表明用户利用 Fuse 的注释和卡片嵌套功能提取了关键信息并形成了个人知识库。
- 用户的项目层级结构大多较浅(2 层以下),表明 Fuse 的组织方法适合大部分用户的使用习惯。
-
局限性与未来方向:
- 局限性:Fuse 的卡片压缩设计在处理过大规模的内容集合时可能受到侧栏空间限制。
- 存在进一步优化个人工作记忆扩展的可能,例如通过“低冗余信息显示”设计使卡片更紧凑。
- 开发基于任务的跨平台版本(如移动端)以支持更短的会话时间和更高的中断率。
- 探索共享信息集合的机制,理解用户如何重用他人的感知集合,从而拓展协同感知应用。
总结
Fuse 展示了如何通过浏览器插件实现在线信息收集与组织的无缝结合,为用户提供了强大的任务支持与感知外化工具。此研究的成功证明了此类工具在提高现代信息处理效率中的潜力,同时启发了关于数字化工作记忆、信息共享和任务管理等方面的进一步研究。
研究问题 / 现实痛点
这篇论文在当前问题库中对应的问题线索。
研究问题
3- 如何设计一个浏览器插件,在不打断用户流程的情况下实现信息的收集和组织?分类: 浏览器内的信息收集与组织同类问题arrow_forward
- “容器卡片”的嵌套结构能否有效减少用户的认知负担?分类: 浏览器内的信息收集与组织同类问题arrow_forward
- Fuse插件的设计如何影响用户的任务恢复效率?分类: 浏览器内的信息收集与组织同类问题arrow_forward
现实痛点
1- 用户在浏览器中难以同时收集和组织线上信息且流程中断。分类: 浏览器内的信息收集与组织同类问题arrow_forward
- 100%
Misty: 通过交互式概念融合进行UI原型设计
CHI '25· 知识工作者工具与工作流 +1
- 83%
Colaroid:用于创作可探索的多阶段教程的文学编程方法
CHI '23· 编程教育与计算思维 +2
- 83%
从标签页到结构:理解与支持网页管理
CHI '26· 知识工作者工具与工作流 +2
- 83%
UX设计系统世界中的创意招聘
CHI '26· 参与式设计(Participatory Design) +2
- 80%
通过文件简历探索网络世界的新型文件隐喻
CHI '18· 知识工作者工具与工作流 +1
- 80%
ORC布局:带有OR约束的自适应GUI布局
CHI '19· 知识工作者工具与工作流 +1
- 80%
思维 aloud 计算:支持丰富且低努力的知识捕获
CHI '21· 知识工作者工具与工作流 +1
- 80%
TweakIt:支持将代码变形的终端用户程序员
CHI '21· 知识工作者工具与工作流 +1
- 80%
通过日志分析理解文档使用情况:四个云服务的案例研究
CHI '24· 知识工作者工具与工作流 +1
- 80%
推动关注工作场所会议目标:一项大规模预注册现场实验
CHI '26· 原型设计与用户测试 +1
基于研究子主题与职业分类的 Jaccard 相似度(≥60%)