舊版與新版設計

今天繼續優化 App 的 UI，主要處理「選擇練習時間」。在第一版 UI 中，只有 5／10／15 分鐘三個固定按鈕，當初是為了先求能用，按一下就能開始練習。但實際使用一段時間後，我有時會想練久一點，例如 20 或 30 分鐘，固定的三個選項就滿足不了這個需求。

為了讓時間選擇更有彈性，也想嘗試做一些微互動，我選用水平滑動的刻度尺：左右滑動，時間會動態跟著改變。

微互動條件定義

實作方式是先把參考圖丟給 Claude，接著請 Claude 訪談我，一起討論需求，定義操作行為。

給 Claude 的示意圖

操作行為定義

• 左右滑動調整時間： 每一格代表 1 分鐘，範圍是 5 到 60 分鐘，預設維持 10 分鐘。上限設在 60 分鐘，是因為我自己最久練過 60 分鐘，雖然次數很少。
• 每 5 分鐘一條長刻度： 保留舊版 5／10／15 的整數感，想選整數時，眼睛可以很快對到位置。
• 放手後自動吸附： 停下時會自動對齊最近的整數分鐘，不會停在兩格之間。
• 數字滾動變化： 滑動時，下方的數字會跟著滾動跳動，手指的動作和數字同步，清楚感覺到自己正在調整時間。