讓孩子忘記自己在學習：玩樂學的起點

玩樂學的起點是一個很直接的問題：為什麼孩子能在遊戲裡專注幾個小時，寫作業卻撐不過十分鐘？

答案不是孩子懶。是回饋速度不一樣。遊戲裡做對一件事，立刻有反應——分數跳動、動畫播放、關卡過了。作業做完，明天老師才告訴你錯幾題。

這個觀察變成玩樂學的設計原則：學習的回饋要快到讓孩子分不清楚這是在玩還是在學。

從「湊十法」開始

第一個做的遊戲是湊十法——小學加法的基礎技巧，把兩個數字拆開湊成 10 再加剩下的部分。概念簡單，但如果沒有建立直覺，之後更難的計算就會很吃力。

我們把它做成了重力滑動消除遊戲：6×6 格子，數字方塊因重力下落，滑動方向讓方塊移動，相加等於 10 的組合自動消除。5 種配對（1+9、2+8、3+7、4+6、5+5）各有獨立的動畫劇情。

孩子在玩的過程中，腦子其實一直在算「這個數字還缺幾才能湊十」，只是他感覺自己在玩消除遊戲。

現在的 11 個遊戲

目前上線的遊戲跨越數學和英文兩個領域：

數學類

• 湊十派對（湊十法，重力消除版）
• 湊十交換（湊十法，交換消除版）
• 顏色工廠（顏色混色概念）
• 數學塔防戰（減法、除法、因數、質數）
• 數字刃（Number Blade）
• 10×10 挑戰

英文類

• 英文書寫練習
• 打字 ABC
• 第三人稱單數（文法）
• 單字閃卡
• 反義詞

數學和英文各有側重，但底層邏輯一樣：把學習的動作包裝進遊戲機制裡，讓錯誤本身變成學習的一部分，而不是讓孩子覺得「我又做錯了」。

以數學塔防戰為例：殭屍帶著數字下落，孩子放減法塔（左）或除法塔（右）。除法不整除就閃避——孩子立刻知道「這個除數不對」，比老師說「這題要找因數」直接多了。

架構的選擇

玩樂學用的是混合式架構：Next.js 14 入口網站 + 純 Vanilla JS 遊戲。

每個遊戲是一個獨立的 HTML 檔案，放在 public/ 資料夾下，沒有框架依賴。原因很實際：遊戲需要幀率流暢和觸控即時回應，Pointer Events API 配合純 CSS 動畫就能做到，不需要 React 的 virtual DOM 介入。

入口網站（Next.js）負責遊戲清單、篩選邏輯（按年級、學科）、SEO、未來的帳號系統。遊戲本體（Vanilla JS）負責玩法、動畫、音效。兩邊各做各擅長的事。

新遊戲的上架流程也因此很簡單：把 HTML 放進 public/，在 src/data/games.tsx 的遊戲清單裡加一筆資料，就完成了。

下一步

目前正在申請 Google AdSense，接下來會加入登入功能和藍新金流的付費機制。

Facebook 社群 @playjoylearn 有新遊戲上線的消息。