# 05d 第 3 關（畫面關）第 1 輪：真人角色實測

- 角色：研究生／助教，晚上很累，聽力只跟得上 70%，習慣邊聽邊翻中文，想「無腦學習」，承認會偷懶。
- 做法：用 puppeteer 操作真的 Chrome（無頭）。電腦 1400×900、手機 390×800（觸控）。同一個 server（http://127.0.0.1:8770/）。音檔用假的（按 🔊 就當作聽過）。
- 截圖：`evidence/gate3-r1/`（s1-… 到 s7-…）。
- 實測時間：2026-10-04 22:56–23:07。

> **要注意：評測途中程式被改了。** `plan.js`（23:03）、`server.py`（23:04）、`store.js`（23:06）、`ui.js`（23:07）在我操作時被更新。
> 情境 1～4、6、7 跑在舊版上；情境 5 跑在「新 plan.js＋舊 store/ui」上。23:08 之後的補測拿到的是改到一半的版本，不列入問題（見最後一節）。
> **所以本報告評的是 23:06 以前的版本。最終版要再跑一輪。**

---

## 一句話總評

方法講得清楚，「先聽再看」的道理我看得懂，提早結束也沒有罪惡感。
但有三件事會讓我真的用不下去：

1. 複習時，我把又沒聽到的字再點一次，它反而被**取消**，連耳朵缺口清單也一起扣掉。
2. 每次打開都要從最上面一直往下捲，才找得到下一題和「這次完成」。
3. 完全沒聽就作答，也一樣拿到「✓ 用新方法練過」，偷懶不會被發現。

---

## 分數表

1～5 分，低於 3 分就一定要修。

| 情境 | 好用度 | 順暢度 | 方便性 | 手機介面 | 學習引導 |
|---|---|---|---|---|---|
| 1 第一次打開（電腦） | 4 | 3 | 4 | — | 4 |
| 2 很累只有 20 分鐘 | 3 | 3 | **2** | — | 3 |
| 3 通勤用手機 | **2** | 3 | 3 | **2** | 3 |
| 4 被打斷換裝置 | 4 | 3 | 3 | 4 | 3（這個情境跟引導無關，給中間分） |
| 5 做完一整次 | 3 | 4 | 3 | — | 4 |
| 6 想偷懶 | 4 | 4 | 5 | — | **2** |
| 7 找東西 | 4 | 3 | 4 | 4 | 4 |
| **平均** | **3.4** | **3.3** | **3.4** | **3.3** | **3.3** |

低於 3 分的理由：

- 情境 2 方便性 2：要捲大約 6,300 px 才按得到「這次完成（提早結束）」；接著做的下一題在 2,460 px 下面。
- 情境 3 好用度 2：複習時再點一次沒聽出來的字，反而把紀錄刪掉（問題 H1）。
- 情境 3 手機介面 2：最常要點的小字（a、in）只有 10～15 px 寬；新題在 4,692 px 下面。
- 情境 6 學習引導 2：0 遍聽、先看翻譯和詳解再作答，畫面一樣顯示「✓ 用新方法練過」。

---

## 問題清單（依嚴重度排）

| 編號 | 情境 | 看到什麼（具體） | 為什麼困擾這個學習者 | 建議改法（具體到畫面上要怎麼變） | 嚴重度 | 截圖檔名 |
|---|---|---|---|---|---|---|
| H1 | 3、5 複習 | 6-2 上次點了 for、the、a。這次按「還是有沒聽出來的」以後，三個字從淡色**自動變成實心紅**。我想表示「a 和 for 這次又沒聽到」，就各點一下，結果它們被**取消**，只剩 the。耳朵缺口清單裡的 a 整個消失，for 從 ×2 變 ×1。按完也沒有任何一行字說明接下來要做什麼。 | 我最常重複漏掉的就是這些小字。越老實記錄，紀錄反而越少，缺口清單的「次數」就不可信了。而且我不會發現它被刪掉。 | 複習卡上「點字」的意思改成「這次又沒聽出來」：(1) 按「還是有沒聽出來的」後，上次的字**維持淡色**；(2) 點淡色字 → 變實心，次數 +1，不是取消；(3) 點實心字才取消，而且只取消這次，不動上次的紀錄；(4) 按下去後在按鈕下方多一行：「點這次又沒聽出來的字。淡色的字點一下＝這次又沒聽到。」 | 高 | s3-05-phone-review-miss-marked.png、s5-08-review-after-miss.png |
| H2 | 6 想偷懶 | 7-1：一次都沒按 🔊，先打開翻譯和詳解（詳解直接寫「為什麼是 volunteered」），再作答。結果題號旁出現綠色「✓ 用新方法練過」，新學 +1，連續聽也把它算進去。10 題全部亂點，也能在 10 下內讓「新學 ✓ 已完成」。卡片上的提示只有一行淺灰小字。 | 我自己說過：網頁要讓我沒機會偷懶。現在偷懶和認真拿到一模一樣的綠勾，我累的時候一定會走捷徑。 | 不加鎖、不計分，只把真實情況講出來：(1) 播放鍵旁顯示「已聽 N 遍」（作答前按了幾次）；(2) 0 遍就作答時，綠字改成灰字「✓ 已作答（還沒先聽）」，下面一行：「下一題試試先聽 3 遍再看。」；(3) 作答前打開詳解時，摘要旁加小字「先作答再看詳解」。這些都是畫面文字，要請你拍板（介面類）。 | 高 | s6-02-answered-without-listening.png |
| M1 | 2、4、5 | 做完的題目不會收起，每題 600～900 px 高。重新打開都停在最上面。電腦上接著做的 6-4 在 2,460 px，6-9 在 5,152 px；手機上 6-6 在 4,692 px。整頁沒有「跳到下一題」。從手冊或「看全部題目」回來，也一樣回到最上面。 | 我常常被打斷、換裝置。每次回來都要往下捲好幾頁，還要一題一題看「做過了沒」，很煩，也不「無腦」。 | 在「第 N 次學習」那一行右邊放一個按鈕「接著做：6-9 ↓」，點了直接捲到第一題沒做的。做完的題目收成一行（題號＋✓＋🔊 播放＋「展開」）。 | 中 | s2-01-reopen.png、s4-03-desktop-reload.png |
| M2 | 2、5 | 「這次完成（提早結束）」只在整頁最下面（電腦 y≈6,357 px，前面還有 5 題沒做加上連續聽）。三區都做完時，「這次完成 ✓」也在 y≈6,327 px。左側面板和手機底部那條都沒有這顆按鈕。 | 很累想收工時，還要捲過一大段沒做的題目才找得到。這會讓我直接關網頁，不按完成。 | 左側面板「這一次的進度」下面加一顆「這次完成」（還沒做完時用淺色小字，做完時變黑底大按鈕）。手機底部那條在三區都完成時，把「☰ 進度與設定」換成「這次完成 ✓」。 | 中 | s2-02-cont-and-early-finish.png、s5-03-all-done.png |
| M3 | 3 手機 | 最常點的小字點擊範圍很小：a 是 10×22 px，in 是 15×22 px，the 是 26×22 px。🔊 播放 69×27 px，句子拆解的 🔊 30×22 px，缺口清單 ▶ 47×22 px，面板連結高 22 px。 | 要標的正好是 a、to、in 這種小字。手指大約 9 mm，很容易點到旁邊的字，還要再點一次取消。（推測：要用真手機確認。） | 寬度 ≤520 px 時：每個字左右各加 4 px 透明點擊範圍，句子行高加大到約 2.2；🔊 播放至少 44 px 高；拆解 🔊 和缺口 ▶ 至少 36×36 px；面板連結之間留 10 px。 | 中 | s3-05-phone-review-miss-marked.png、s3-06-phone-new-card.png |
| M4 | 1 | 為了「到句子拆解聽卡住的那幾塊」打開句子拆解，每一塊下面直接寫著中文（例：「＝ 應徵顧問職位的人」「＝ 必須具備」）。 | 方法說「翻譯最後才看」，但拆解一打開就把中文送到眼前。我知道中文以後就會開始猜，正是我要改掉的習慣。 | 只改顯示方式，不改內容：在「這一次」畫面，每塊的中文那一行先收起，換成小字「看中文」，點了才展開。英文那塊和 🔊 照樣顯示。 | 中 | s1-05-6-2-done.png |
| M5 | 1、3 | 按 🔊 的時候眼睛一定要看螢幕（按鈕在右上，句子就在下面）。「先聽 3 遍」要按 3 次，每次都看得到句子。畫面上也沒有「聽了幾遍」。 | 「先聽 3 遍不看螢幕」做不到：每按一次就看到一次句子。累的時候我也記不得聽了第幾遍。 | 播放鍵旁加一顆「▶ 聽 3 遍」：連播 3 遍，中間停 1～2 秒，按鈕上顯示「第 2／3 遍」。電腦上按空白鍵＝播目前這題。（可跟 H2 的「已聽 N 遍」共用。） | 中 | s1-04-card-before.png |
| M6 | 4 | 舊分頁留在電腦上，手機做完 6-7 之後，在電腦上答 6-8。出現黃色橫幅「另一台裝置有比較新的進度，已重新載入，並把這台剛做的部分合併進去。」資料沒有掉（6-7、6-8 都在）。但是：(1) 畫面跳回最上面（原本在 6-8）；(2) 黃色橫幅一直不會消失，後面已經同步成功好幾次，還是一直掛著。 | 一直掛著的黃條讓我以為還有東西沒處理好，會擔心進度掉了。跳回頂端又要重新捲。 | 合併成功、下一次同步成功後，橫幅改成綠色「✓ 已合併，兩台的進度都在」，3 秒後自動收起；或在右邊加「✕」。重新畫面時保持原本的捲動位置。 | 中 | s4-01-stale-desktop-after-click.png |
| L1 | 1 | 第一次打開，方法卡大約 920 px 高。按「我懂了」以後畫面停在原地，看到的是「5 個新字」表的中間，看不到「第 1 次學習」和 ①②③。 | 第一眼不知道自己在哪、這一次要做什麼。 | 按「我懂了」後捲到「第 1 次學習」那一行。 | 低 | s1-03-after-ok.png |
| L2 | 3、5 | 複習卡還是顯示上次的作答結果（「✗ 錯誤 · 正解：possess」、B 框起來、「標記：不懂」）和 5 個選項。手機上一張複習卡約 750 px 高。 | 複習要驗的是耳朵，舊的文法結果是雜訊，也讓頁面更長。 | 複習卡把選項、對錯和「標記」收進一個「看上次的題目」，預設收起。卡片只留：🔊、提示、句子、兩顆按鈕、翻譯／拆解。 | 低 | s2-04-next-open.png、s3-04-phone-review-card.png |
| L3 | 2 | 按「提早結束」後出現「辛苦了 ✓」。左側面板已經換成下一次的數字（複習 0/5、新學 0/5），跟中間的「第 1 次學習」對不起來。也沒說剩下哪幾題。 | 我會想：剛剛做的 5 題算了嗎？剩下的去哪了？ | 「辛苦了」框裡加一行：「沒做完的 6-6～6-10 會排在下一次。」面板在按「現在就開始下一次」之前，先標成「下一次（還沒開始）」。 | 低 | s2-03-after-early-finish.png |
| L4 | 2 | 提早結束時，新學已經做了 5 題，連續聽可以按（「▶ 開始連續聽（這次學的 5 句）」），但結束區沒有提到它。 | 連續聽只要 1～2 分鐘，正是累的時候最划算的一步，很可惜跳過了。 | 提早結束那行改成：「還沒做完也可以先結束。走之前可以先按上面的連續聽（約 1 分鐘）。」 | 低 | s2-02-cont-and-early-finish.png |
| L5 | 7 | 手冊第 7 節「這兩天怎麼練（10/5–10/6）」還在叫我用舊的 `toeic-drill-01.html`，沒有點字就「拿一張紙寫」。手機版手冊寫「左邊點一節」，但左邊目錄藏在 ☰ 裡面。 | 新系統已經上線，看到這節會搞不清楚現在到底該用哪個網頁、要不要拿紙。 | 第 7 節刪掉，或改成收起的「（已過期）過渡期做法」。手機版文字改成「點左上角 ☰ 選一節」。 | 低 | s7-01-guide.png、s7-05-phone-guide.png |
| L6 | 1 | 新學區一開始就展開「5 個新字」表（約 550 px），第一題被推到 972 px。表上沒有說這 5 個字要怎麼用。 | 我不知道要先聽這 5 個字，還是直接跳去做題。 | 表格上方加一行：「先按 🔊 把這 5 個字的聲音各聽一次（約 1 分鐘），再開始做題。」之後再打開時預設收起。 | 低 | s1-06-top-after3.png |
| L7 | 7 | 在「看全部題目」往下捲以後，「回到這次的內容」按鈕捲出畫面，要捲回頂端才按得到。 | 小麻煩，偶爾會用到。 | 這顆按鈕在捲動時固定在畫面右上角。 | 低 | s7-03-all-view.png |

---

## 做得好的地方（保留）

- **方法卡講道理，不講規則。** 「多益每秒大約 3 個字……你在腦中翻中文時，後面的話已經過去了」我一讀就懂為什麼要改。四個習慣和「什麼時候可以看」表格很清楚。
- **答案不會先洩漏。** 作答前空格顯示「______」，播的是空格版錄音；句子拆解要作答後才出現。
- **每一區都有一句「為什麼」。** 例：「目的是跟上速度，不是每個字都懂。」讓我知道這一步在練什麼。
- **提早結束沒有罪惡感。** 「還沒做完也可以先結束，沒做完的會留到下一次。」是灰色小字，不會叫我做完。
- **複習的那句話很好。** 「老實按就好，沒有分數。猜出來的不算聽出來。」不說教，又點出重點。
- **淡色和實心標記一眼分得出來。** 上次的字是淡紅底，這次的是紅底白字。
- **連續聽很順。** 按一次就播完 5 句，會顯示「正在播第 1 / 5 句」，可以停；播完打勾，「想再聽可以再按」。
- **完成狀態清楚。** 每區的綠色「✓ 已完成」、左側面板的 x / y、手機底部那條摘要，一眼就知道還剩什麼。
- **換裝置接得上。** 手機做的 6-7（含點的字）回到電腦都在；舊分頁沒重新整理就作答，也沒有蓋掉手機的進度。
- **手機版面沒有跑版。** 沒有左右捲動；底部面板改語速後不會自己關掉；耳朵缺口清單在手機上好讀。
- **用「次」算，不用日期。** 畫面上看不到任何日期，休息幾天也不會堆積。

---

## 不確定、需要真人確認的事

1. **真的聲音。** 無頭 Chrome 聽不到。空格版錄音念起來怎樣、70% 聽起來順不順、句子拆解每一塊的音檔切得準不準，都要真人聽。
2. **真的手指。** 10～15 px 寬的小字，用手指點會不會點錯（M3 是推測）。iPhone 和 Android 的瀏覽器底部工具列，會不會蓋住底部那條。
3. **「已練幾分」。** 每段腳本都不到 1 分鐘，畫面一直是「0 分」，屬正常。切到別的視窗會不會暫停，這次沒驗到。
4. **評測中途程式被改（重要）。** 23:08 以後的補測拿到的是改到一半的版本：新的 `store.js` 呼叫 `/api/events?after=0`，但正在跑的 server 回 404。結果手機頁面直接變成「本機模式」，顯示「第 1 次學習」，方法卡又跳出來，看起來像進度全不見（截圖：x-midchange-phone-local-mode.png）。這不算在本輪問題裡，但有兩件事要確認：(a) 新版前端一定要搭配重新啟動後的 server；(b) 前端拿到 404 時，應該顯示「連不上 server」，不要默默改成本機模式。否則換版那天，我會以為進度被清空。
5. **情境 4 的手機同步。** 手機答完 6-7 後等了 8 秒，狀態都沒有出現「已同步」。下一次打開手機時跳出合併橫幅，資料最後沒有掉。原因不確定（推測：電腦那邊同時在背景存檔，兩邊撞到）。
6. **手機第一次打開時的方法卡。** 因為「我懂了」會跟著進度同步，手機沒看到第一次的方法卡。原本想用「重看方法」補看，但程式已經被改，沒有補測到。

本報告的每一項判斷，都來自實際操作畫面、量元素尺寸和看截圖；標「推測」的除外。