NCE1 影子跟读工作室

一个基于新概念英语第一册（72 课）的纯静态 Web 跟读练习应用，无需构建、无需后端，本地服务器即可运行。

预览链接

链接：https://boommanpro.cn/preview/nce1-shadowing-studio/

产物：nce1-shadowing-studio.zip

核心数据

• 内置 72 课配置（nce1/2.json ~ 73.json），含 base64 编码的音频 URL、英中字幕、时间戳

• 音频走 courseband CDN，浏览器原生播放

三大练习模式

A/B 角色智能分配

三层启发式自动识别：

1. 前奏识别：标题问句、Listen to the tape、问题提示 → 旁白

2. 自称名字锚点：识别 "My name's X / I'm X"，按名字分配 A/B，锚点后保持一句再交替

3. 高频结识回应：介绍体课文（如 Lesson 5）中 "Nice to meet you" 归 B，介绍句归 A

手动修正：点行末字母循环 A/B/N；长按 = 设为与上一句同角色（修正连说两句，带触感震动）。修改按课存 localStorage。

音频控制

• 速度 0.5×–1.6×（滑杆 + 5 档预设）

• 主音量 + 影子模式专属背景音量

• 单句循环、跟读停顿（每句后留 0.5–6s 复述时间）

• 逐句上一句/下一句、点击字幕跳转、进度条拖拽

界面

• 桌面：三栏布局（课程列表 / 字幕工作区 / 控制面板）+ 底部播放栏

• 移动端：侧栏抽屉 + 控制面板底部 sheet + 固定当前句卡片，触摸友好（大滑杆、安全区适配、禁止缩放）

• 中英显隐独立开关、72 课搜索

• 快捷键：空格播放/暂停、←/→ 切句、Esc 关闭浮层

技术栈

纯 HTML + CSS + 原生 JS，无任何依赖，三个文件共约 30KB（不含课程数据）。