- 时间
- 2026 年 9 月
- 状态
- 已部署 Web 产品 · 邀请制
案例概览
- 问题
- 双语学习者需要在现场跟上内容，也能在之后复习时找回原句。
- 设计决定
- 配对原文与译文，用段落时间戳连接回听，并区分保存、转录收尾与云端归档。
- 结果与范围
- 邀请制 Web 产品，已有真实使用记录和隔离检查；更广泛的学习者研究仍为拟议工作。
跳转到章节
问题：当下听懂，之后找得回来
在双语课堂里，听内容、比较语言和决定记什么会争夺注意力。字幕能帮助当下理解，但课后回看难点，还需要找回疑问发生的位置、当时的原音和正在讲的课件。我把“现场跟上，到课后找回”作为核心产品问题。
起点是我自己的学习流程和另一个预创建账号，并非面向更大群体的访谈研究。我独立负责产品范围、交互设计、浏览器音频采集、AI 服务集成、保存恢复与部署。
围绕学习任务组织流程
流程已延伸到课前准备、现场跟随和课后复习。这些任务描述已实现的产品流程，不是正式任务研究的结论。
- 01
准备
选择课程和语言方向；按需输入识别术语，或明确带入该课程上次使用的术语。
- 02
跟随
开始录音，在同一段落中阅读原文与译文，把注意力留给课堂。
- 03
留下
标记疑点或重要内容，将课堂照片保留在对应音频位置。
- 04
找回
点击段落回听，或从标记前十秒开始，对照附近双语原文和此前的课堂照片。
- 05
复习
手动标为已复习，按课程重访录音，并用原文与原音核对结构化笔记。
28 秒产品演示
范围取舍：先为明确的小范围用户做完整 Web 产品
我选择先为个人 Mac 和 iPad 使用完成浏览器产品。仅录音与实时双语模式共用录音库；现有流程在逐段回听和学习笔记之外，增加可选课程、识别术语复用、课堂照片、疑点与重点标记，以及手动复习状态。
课程名称用于整理个人录音。术语复用由用户明确触发，取自同课程最近完成的实时录音；它不是共享词库，也不保证专业词一定识别正确。
采集仍需要页面前台与亮屏。产品提示这一条件，并处理麦克风中断。公开注册、支付和原生应用分发仍暂缓。
现场：把注意力留给内容
录音开始后，暂时无用的语言和模式设置收起；暂停、结束、学习标记和相机入口保持可达，为正在听的内容留下更多空间。
原文与译文放在同一段落中。专注模式和字号调整改变阅读方式，不改变录音状态。会话经过时间与已保存的音频时长分开，因为暂停会计入前者。
课件：让照片与讲解留在同一个位置
课堂照片保留在录音中的音频位置，显示在相关双语段落旁；没有对应文字时，使用独立图片卡。可以放大查看、回听此时，也可以调整图片位置。
照片使用独立的设备暂存队列，上传失败不直接停止麦克风。音频可能已经保存而图片仍待补传，界面明确区分；已接受的照片未齐时，不把云归档称为完成。
回听：回到难懂的那一句
段落时间戳仍是返回原音的直接入口。可以回听需要核对的那一句、调整速度和短距离跳转，不必在整节录音里反复拖动寻找。
播放跟随帮助定位当前段落，键盘焦点进入文字时暂停跟随，让主动阅读优先。照片有独立的回听入口，点击放大图片不会误触整段播放。
标记：先留下疑点，课后再回听
现场提供“没听懂”和“重要”两个快捷标记。标记依据音频采样位置保存，不绑定会随字幕排版变化的段落编号。
课后可以从标记前十秒开始回听，查看附近双语原文和最近一张此前的课堂照片。核对后手动标为已复习，可筛选待复习与已复习，也可改回待复习。“已复习”记录用户操作，不代表已经掌握内容或字幕准确。
复习：笔记与原音相互核对
学习笔记按内容概览、主题解释、细节、原文例子、明确要求与待办、需要确认的事项组织。空待办和疑点省略，提示词要求内容限定在转录原文中。
生成是用户主动请求。结果缓存，替换需要明确重新生成；请求失败或结果不完整时保留旧笔记。调整课程或复习状态不会触发 AI 调用，课堂照片也不会发送给笔记服务。
截图是同一虚构课堂的人工准备笔记。模型输出仍需结合双语原文与原音核对。
课程：知道下次从哪里继续复习
课程标签和筛选帮助整理多节课堂。课程筛选可叠加名称、日期与语言搜索；待复习筛选帮助找出仍有疑点需要回看的录音。
课程归类与手动复习状态随录音保存和归档。音频已保存、标记已复习和云端已备份保持独立，完成其中一项不会自动完成另外两项。
适应不同宽度的阅读
窄屏布局保持阅读区域与播放控制可达。学习标记列表独立滚动，播放器仍可使用；照片可放大查看，不会意外开始播放。
图片是实际组件在模拟 390 像素视口下的新截图。此前检查覆盖短屏、大字号、键盘操作和阅读位置保留；照片、标记与长课连用的实机验收仍单独进行。
有记录的迭代：问题、改动与检查
以下例子来自 9 月 29 日界面复审与隔离浏览器检查，属于具体实现修正，不是参与者表现的前后对比实验。
- 01
现场工作区拥挤
不可操作的设置仍占据阅读空间。录音时将其收起；模拟横屏 iPad 布局保留约 476px 实时正文。
- 02
次要控件挤占正文
导出详情改为浮层。浏览器检查确认展开前后正文高度不变。
- 03
切换丢失阅读位置
摘要首次打开后保留实例。32px 字号检查中，切换原文再回来后保持 374.5px 阅读位置。
- 04
搜索过度依赖当前名称
语言别名与方向代码加入检索。合成记录重命名后，仍能通过英语原文查询找到。
完成提示必须说明究竟完成了什么
结束麦克风采集、完成转录与校验云归档仍是独立阶段。照片又带来一种待保存状态，因此音频已保存时，图片可能还在等待补传。
设备持久暂存可用时，短暂上传失败可以重试，不立即结束采集。待保存队列接近容量上限，或保存无法安全继续时才停止，并保留恢复路径。识别断连单独提示，缺失区间不会自动补译。
架构：实时显示与持久保存分开
浏览器向转录服务发送 PCM，同时将 WAV 分段发送给服务器，使用序号、采样偏移和哈希核对保存。课堂照片与学习标记使用音频采样位置，照片另有持久设备队列。
课程设置、识别术语、复习状态、照片、转录、音频与笔记一起进入录音归档。云传输仍是独立任务，并回读校验。笔记服务仅接收转录文字，课堂照片不进入转录音频流或笔记请求。
恢复：验证完整录音，而不只是下载成功
恢复需要得到归属正确、附带相关材料的可用录音。此前隔离演练检查音频哈希、转录、笔记、名称与账号，并拒绝损坏文件、错误账号和覆盖已有录音的请求。
10 月 9 日针对真实私有云存储的合成演练，还在独立空目录中恢复了照片、课程与术语设置、手动复习状态和合并录音。这是有记录的存储验证，不代表真实课堂识别、iPad 长课或整机与 DNS 切换验收。
私有访问与明确的资源使用
预创建账号与服务器端录音归属检查定义访问边界。拿到录音 URL 不等于有权读取其他账号的内容。音频会发送到转录服务；音频、文字、照片与学习元数据保存在服务器和私有云中。这不是端到端加密或仅本地处理。
笔记有账号级与服务级并发限制、缓存与明确重新生成。应用区分 AI 用量估算与供应商账单；邀请制内测达到请求额度时拒绝新请求，但保留已有录音的访问。
证据：检查了什么，如何检查
真实使用、用户反馈验收与隔离故障演练回答不同的问题。我区分这些证据，而不把它们合并成一个可靠性或学习效果结论。
- 真实录音
- 记录音频 3116.456 秒、云归档完成，用户接受约一小时录音；两小时测试被用户明确取消。
- 账号与可访问性
- 用户确认两个账号互相看不到录音，并完成 iPad VoiceOver 验收；不等于完整 WCAG 审计。
- 隔离界面检查
- 9 月 29 日检查覆盖焦点、字号、搜索、阅读位置与布局；10 月 9 日合成组件检查覆盖课堂照片、标记回听、课程筛选和复习状态保留。这些检查不构成实机或学习效果结论。
- 异常与恢复
- 独立进程演练检查完整性与拒绝路径。真实云检查包括此前单条录音恢复，以及 10 月 9 日合成录音、照片和学习状态的恢复；整机与 DNS 切换仍未验证。
反思：让每一个承诺都有明确范围
最难的设计工作是决定每个状态向学习者承诺什么。看到译文、音频已保存、照片已上传、疑点已复习与云端副本已校验，是不同结果。把这些区分保持可见，才能让课堂到复习的流程更容易理解。
下一步评估应让新受邀学习者完成课前准备、标记难点、保存课件、回听并返回待复习疑点，再观察任务完成、错误与疑点是否真正被重访。这是拟议工作，不是已经开展的参与者研究。