非同步學習 · 免費方案 · 零伺服器維護
💡 從「即時同步」走向「多元非同步」的教學拼圖
之前我曾分享過針對課堂即時互動設計的「剛好學」,協助老師在課堂上透過大螢幕與學生即時問答、抽籤與互動。然而在日常教學中,除了講台上的熱烈即時互動,學生也需要按自己的節奏探索教材、做實驗、畫圖、寫心得與完成測驗。
因此,我開發了這套專為非同步教學設計的「剛好系列-課堂任務通」。現在更進一步將它改寫為 Cloudflare 版本,讓老師們不必受限於雲端硬碟權限或經費門檻,擁有一個完全屬於自己的線上課堂基地。
軟體由來:為什麼從 GAS 改寫為 Cloudflare 版?
課堂任務通最初的版本是架構在 Google Apps Script (GAS) 搭配 Google 試算表與 Google 雲端硬碟。雖然對熟悉 Google 生態系的老師很親切,但在實際教學場景中,隨著上傳的作業檔案、照片與圖畫增多,常會遇到執行超時、檔案權限管理繁瑣,以及學校帳號雲端空間容量受限等挑戰。
⚡ 架構升級:基於現代化 Cloudflare Workers 邊緣運算架構
在這次釋出的新版本中,我將系統核心完全重構,轉移到現代化的 Cloudflare Workers 無伺服器邊緣運算平台:
- 零伺服器維護負擔:程式直接在邊緣高速運行,免除以往繁複的後端設定與維護困擾。
- 擺脫 Google Drive 依賴:所有學生的作業圖片、手繪作品與檔案,由系統集中安全管理,無須繁瑣設定硬碟共用權限或擔心存取被擋。
- 100% 免費方案即可運作:不需要購買伺服器,不需要綁定信用卡,完全使用 Cloudflare 免費額度即可順暢支援全班上課。
- 平滑無痛更新:日後只要在終端機輸入一行指令更新程式,既有的學生名單、作業與成績資料完全保留不遺失。
🌱 教育工具的初衷:工具應該為教學服務,而不是增加老師的資訊技術負擔。這套軟體讓每位老師都能以最少的時間成本,建立高自主性、高隱私且穩定耐用的教學平台。
功能總覽:走廊教室入口與 9 種互動任務
部署完成打開網址,映入眼簾的是溫馨直覺的「學校走廊」首頁:左側是老師專屬的「教師辦公室」,右側是孩子們的「學生教室」。
🏫 貼心專為師生設計的友善管理
- 首次設定管理者:第一位進入教師辦公室的老師設定密碼即成為管理者,確保操作安全。
- 學生名單批次匯入:直接貼上一行一位的姓名與密碼即可快速建檔。
- 國小友善「免密碼登入」:針對國小低中年級學生,可開啟免密碼模式,學生只要在教室門口點選自己的座號姓名就能輕鬆進入。
- 五大管理分頁:進入課堂後,具備「單元內容」、「學生名單」、「批改與總覽」、「作品藝廊」及「課堂設定」清晰分頁。
九種多元任務類型,滿足全方位學習情境
在「單元內容」中,老師可以依照章節自訂分類(如「水的三態變化」),並派送豐富的任務:
1. PDF 講義互動
上傳教材自動將每頁轉為圖片,學生可直接在網頁上劃記、圈選與寫筆記。
2. YouTube 隨堂考
搭配影片觀看進度派送題目,支援 CSV 匯入與內建 AI 提示詞一鍵產生試題。
3. 圖文回應
學生可拍照上傳實作成果、實驗現象,並填寫文字觀察與心得回饋。
4. 手繪繪圖板
學生可用手指或平板觸控筆直接線上自由作畫、繪製心智圖或設計圖稿。
5. Markdown 文件
呈現排版精美的線上講義與學習單,並支援學生匯出成圖片或 PDF 存檔。
6. 外部連結
整合外部優質線上資源、教學遊戲或參考網站,集中於同一任務節點。
7. 分享檔案
直接分發補充資料、學習單範本或簡報檔案,供學生自主下載瀏覽。
8. 自動閱卷測驗
是非、單選等題型,系統提供即時自動評分,學生繳交立即掌握理解成效。
9. AI 網頁加截圖回傳
最強核心亮點!無縫整合 AI 生成的互動 HTML 網頁,完成後一鍵截圖繳交。
🌟 重點推薦:生成式 AI 互動教材 + 截圖回傳機制
現在使用 Gemini Canvas、ChatGPT 或 Claude 等生成式 AI,只要輸入一段提示詞,就能在幾秒內產出功能完整的單一 HTML 互動教材。
💡 實用範例提示詞:「請設計一份國小三年級『水的三態變化』互動學習單,要有溫度實驗滑桿、配對練習、小測驗,還有寫下觀察的地方,做成單一 HTML 檔案。」
以往老師拿到這類酷炫的 HTML 檔案,往往苦惱於「不知道該如何派送給學生,更不知道學生操作完後該如何繳交收作業」。課堂任務通完美解決了這個斷點:
- 安全沙盒隔離(Sandbox):網頁在受保護的沙盒容器中執行,完全不會讀取到平台後台資訊,安全無虞。
- 智能截圖回傳:學生在互動網頁中拖拉實驗、填答完畢後,點選右下角「截圖回傳」,可自選「整頁截圖」或「當前畫面」。系統會自動過濾淡入淡出動畫,完整捕捉作答全貌。
- 縮圖牆批改作業:老師在後台可以直接看到全班學生的截圖縮圖牆,點開即可精準給予評分與指導評語!
課堂教學應用:課前、課中、課後完整實踐
結合非同步學習與課堂面授,課堂任務通能夠靈活融入各種教學節奏:
🖼️ 打造班級的「作品藝廊」與家長親師連結
學生的圖文報告與手繪畫作,不再只是躺在後台的作業檔。老師可以將優秀作品一鍵發布至「作品藝廊」:
在班級內部,同學之間能互相點讚、給予溫暖正向的留言評語;若設定為「完全公開」,系統還會自動生成專屬分享連結與 QR Code,讓家長在親師會或家長日也能透過手機欣賞孩子的學習成果。
四步部署:只要 5 分鐘,免信用卡架設上線
課堂任務通採用現代化 Cloudflare Workers 架構,整個部署流程極其精簡:
註冊帳號
授權認證
完成上線
🎬 軟體部署及功能介紹影片
如果不確定操作細節,可以直接觀看完整教學影片。從專案下載、Node.js 安裝、Cloudflare 快速部署,到九種課堂任務功能與教室實際應用,跟著影片邊看邊做更輕鬆:
下載程式並解壓縮
前往 GitHub 開源專案:https://github.com/kentxchang/classtask_cloudflare。
點選右上角綠色的 Code 按鈕,選擇 Download ZIP。下載完成後解壓縮,打開資料夾,確認能看見 wrangler.jsonc 設定檔那一層。
準備 Node.js 環境與 Cloudflare 免費帳號
前往 Node.js 官方網站,下載 Windows 版本的 LTS 安裝程式,點擊下一步完成安裝。
前往 Cloudflare 官方網站,註冊一個免費帳號。免費方案即可滿足日常教學需求,完全不需要填寫或綁定信用卡。
開啟命令視窗並登入 Cloudflare
在剛才解壓縮的資料夾中(看得到 wrangler.jsonc 那一層),點一下檔案總管上方的路徑網址列,輸入 cmd 並按下 Enter,即可在該目錄快速開啟命令提示字元。
在終端機中輸入以下登入指令:
npx wrangler login若系統詢問是否安裝相關套件,輸入 y 繼續。接著瀏覽器會自動彈出授權視窗,點擊 Allow 允許。當命令列出現 Successfully logged in 時,即代表登入成功!
一行指令完成部署上線
最後在命令視窗中輸入部署指令:
npx wrangler deploy若您是第一次使用 Cloudflare Workers,系統會提示您設定一個 workers.dev 的子網域名稱(取個英文名稱即可)。部署完成後,畫面最下方會直接印出您的專屬網站網址,點擊打開即可開始使用!
💡 需要繁雜的系統設定嗎?完全不用!
設定檔已經全部預先配置妥當。在執行 npx wrangler deploy 時,Cloudflare 會自動建立完整運作環境,開箱即用。
若想自訂專屬的網址名稱,只要在部署前修改 wrangler.jsonc 裡面的 name 欄位即可;日後程式版本更新,也只要再次執行 npx wrangler deploy,既有的學生名單與教學資料都不會被覆蓋或清空!
課堂維護:空間管理與課程備份機制
為了確保免費方案能夠長久穩定運作,系統內建了貼心的「空間管理」工具:
📊 直覺容量長條圖與一鍵備份還原
- 空間視覺化監控:後台透過長條圖清楚顯示每門課程佔用的儲存空間。Cloudflare 免費方案提供高達 1GB 的儲存容量,對於一般班級的圖片與作業而言相當充裕。
- 學期結束備份封裝:每當學期或課程結束,老師可以在後台一鍵下載課程的完整備份封裝檔,再將課程自線上刪除以釋放空間。
- 完整匯入還原:日後若需要調閱往年學生作品或重新複習,隨時可將備份檔匯入還原,兼顧資料保存與雲端資源的最佳化運用。
常見問答(FAQ)
讓每個班級,都能擁有專屬的智慧任務基地
從即時互動的「剛好學」,到非同步探索的「課堂任務通」,
我希望能為教育現場提供低門檻、高效能、且資料自主的工具選擇。
歡迎各位老師下載體驗,一起探索生成式 AI 與多元互動帶來的教學新可能!
沒有留言:
張貼留言