design: 新增播放页与课程列表 UI 效果稿（HTML/CSS）

- design_mockups/play.html：播放页，含逐句字幕高亮 + 点句跳转 + 播放器，用 ep1 真实台词；CSS 变量化，可迁移进 go-app - design_mockups/list.html：26 集课程列表，含进度环、Act 音频状态、 ep18+ 无音频降级态；用真实集标题 - design_mockups/README.md：设计语言与文档对应说明 - 06-tasks：新增 Phase D / T-200 设计任务 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-21 15:29:36 +08:00
parent 673b3a323a
commit d37b83011a
4 changed files with 398 additions and 0 deletions
@@ -43,6 +43,14 @@

 > 对应需求验收：02-requirements 第五节"逐句同步"。这是 P0 核心，务必先单独跑通。

+## Phase D · 设计（先于 Phase 2 的 UI）
+
+| ID | 任务 | 依赖 | 验收要点 | 状态 |
+| --- | --- | --- | --- | --- |
+| T-200 | UI 效果稿：播放页 + 课程列表（HTML/CSS） | — | 中保真稿覆盖逐句高亮/点句跳转/进度/无音频降级；用真实数据；CSS 可迁移 go-app。见 `design_mockups/` | DOING |
+
+> 设计 spike，不是生产代码。产出在 `design_mockups/play.html`、`list.html`，作为 T-201/T-203 的视觉依据。
+
 ## Phase 2 · 课程列表 + 播放页

 | ID | 任务 | 依赖 | 验收要点 | 状态 |