第1548回-運算思維-MakeCode Arcade-01-第一節課

-
9/22 我看到創客一哥邱文盛的臉書貼文，他說：Makecode Arcade 是好東西，重點是開發的理念，不是在玩程式技術或是追新硬體，而是充分將運算思維結合教育理論的教學模式。

對文盛哥致敬與深表認同，這開啟了我對 Makecode Arcade 的好奇心。簡單說，Makecode Arcade 是用來學習如何製作掌上型遊戲機的遊戲，可以用積木來堆積程式，也可以用程式語言來撰寫。

我還去看了一個演講，做遊戲比玩遊戲好玩 TEDxTaipei - YouTube，主講人是高中二年級的賴睿麒，他談到開發 WiFiBoy 的歷程，他的構想是：做一台最簡單的學習型遊戲機，能用最簡單的程式做出小遊戲，更容易入門進階程式語言。
MakeCode Arcade 的網址是 arcade.makecode.com，首先吸引到我的注意力的是「教程」，一共有八個，我想這應該會是我學習 MakeCode Arcade 的起點。我玩了第一個教程 Chase the Pizza 追逐披薩之後，相當滿意其在教學上的可行性，於是我就規劃了教國小五年級學生 MakeCode Arcade 的第一節課。

教學活動設計 9/27 

  1. 看影片：做遊戲比玩遊戲好玩 
  2. 玩一玩： 追逐披薩 Chase the Pizza 
  3. 想一想： 一起討論遊戲中的要素
  4. 做一做：模仿老師、各自探索、彼此觀摩

1. 看影片

  • 想節省一點時間，所以用 1.5倍速播放，
  • 我在特定的時間點停下來講一講我的看法，並為今天的教學活動做鋪墊。

2. 玩一玩

  • 給學生三分鐘的時間玩玩看
  • 邊玩邊想怎樣做出這個遊戲

3. 想一想

  • 我給學生一個框架來思考這個遊戲中的要素：角色、背景、事件
  • 我請學生發表並討論，然後我修飾一下學生的文句並作紀錄：

老師開一個純文字文件來紀錄大家的發言：
  1. 要有一個主角
  2. 要有背景
  3. 要有食物 food
  4. 要能用按鍵控制主角的移動
  5. 披薩被吃到後會隨機出現在另外一個地方
  6. 要有記分板，每吃到一片披薩就加一分
  7. 三秒內沒吃到就 GG (Good Game) Game Over 了
  8. 輸了有音效
我們還討論了這遊戲缺少什麼？ (為下一節課做鋪墊)
  1. 沒有遊戲說明，玩家一開始不知道要怎麼玩
  2. 想要有敵人來搶食物
  3. 目前 AB鍵沒有功能
  4. 吃到披薩要有音效
  5. 主角碰到牆壁會反彈

4. 做一做

  • 我以寫作文來比喻，把腦中想的東西寫出來就是作文。
  • 我們在 arcade.makecode.com 中，逐一把以上八點用程式積木堆起來，就可以完成玩戲。

4-0 新增專案與命名

4-1 要有一個主角

  • 老師示範，點開角色類積木盒，找到創建角色的積木，拖出來放到「當啟動時」積木裡面。
  • 可以自己在 Editor 中畫出主角，也可以到 Gallery 去選一個現成的

4-2 要有背景

  • 老師讓學生自己去找，當有學生找到時，請他告訴全班，可以在哪裡找到設定背景的積木。

4-3 要有披薩 pizza

  • 老師示範，用創建角色的積木，但是類別要選 food 食物

4-4 要能用按鍵控制主角的移動

  • 老師讓學生自己去找，當有學生找到時，請他告訴全班
  • 當學生能用方向鍵控制主角移動時，都感到非常興奮
  • 也有的學生很能類推，不是主角移動，而是披薩跑來跑去，相當搞笑

4-5 披薩被吃到後會隨機出現在另外一個地方

  • 老師讓學生自己去找，沒有人找得到
  • 老師解說，是用角色類積木中的「重疊」事件積木
  • 等學生做不出來，請會做的學生去協助，或是老師自己出手
  • 披薩隨機出現在別的地方，這節課還沒做，下節課做。

4-6 要有記分板，每吃到一片披薩就加一分

  • 老師讓學生自己去找，有人找到了，趕快告訴別的同學吧！

下課了...

  • 一節課 40分鐘很短，與其趕著上完老師預定的進度，還不如讓學生有點時間可以盡情探索，所以剩下的下一節課再做吧，意猶未盡的感覺也很有後坐力。

延伸閱讀

關於 MakeCode Arcade，我曾經寫過：

關於運算思維，我曾經寫過：

留言

張貼留言

這個網誌中的熱門文章

第1918回-師師有法寶-4-雄-筆順練習-南一-康軒-翰林-國小國語- QR Code 大合集

-
圖片
雄筆順練習 QR code 南一-康軒-翰林-國小國語 112學年下學期 112下 南一 國語生字 QR Code 雄筆順練習 Google 簡報 、 PDF 112下 翰林 國語生字 QR Code 雄筆順練習 Google 簡報 、 PDF 112下 康軒 國語生字 QR Code 雄筆順練習 Google 簡報 、 PDF 112學年上學期 TPET-生生用平板-師師有法寶-筆順QRCode-南一國語112上-分享用 TPET-生生用平板-師師有法寶-筆順QRCode-翰林國語112上-分享用 TPET-生生用平板-師師有法寶-筆順QRCode-康軒國語112上-分享用 111學年 TPET-生生用平板-師師有法寶-筆順QRCode-南一國語111上-分享用 TPET-生生用平板-師師有法寶-筆順QRCode-南一國語111下-分享用 TPET-生生用平板-師師有法寶-筆順QRCode-康軒國語111上-分享用 TPET-生生用平板-師師有法寶-筆順QRCode-康軒國語111下-分享用 TPET-生生用平板-師師有法寶-筆順QRCode-翰林國語111上-分享用 TPET-生生用平板-師師有法寶-筆順QRCode-翰林國語111下-分享用 前情提要 第1913回-師師有法寶-1-QrCode 三分鐘 第1916回-師師有法寶-2-如何製作QR Code？以生字筆順為例 第1917回-師師有法寶-3-雄-筆順練習- 三分鐘內秀出 QR Code 給學生掃 本回開始 製作歷程 (以下內有興趣再看即可，祝您備課愉快！) 20221120 第1913回-師師有法寶-1-QrCode 三分鐘 20230222 第1916回-師師有法寶-2-如何製作QR Code？以生字筆順為例 20230223 第1917回-師師有法寶-3-雄-筆順練習- 三分鐘內秀出 QR Code 給學生掃 晚上雄哥做出 QR Code 快速產生器，我超級興奮的！ 20230224 週五我用 TPET-生生用平板-師師有法寶-筆順QRCode樣版 試著做做看南一國小國語一二年級下學期每一個的生字，順利完成。 20230225 和范范老師用 TPET-生生用平板-師師有法寶-筆順QRCode樣版 來練習做康軒版國小國語二年級的生字筆順練習 QR Code，原本預計十分鐘做完，做完發現是100分
閱讀完整內容

第1670回-自主學習-如何印出中英對照的 TED 演講逐字稿

-
圖片
昨天在做 第1669回-我家私塾-英文單字-部件組合 時，我發現兒子很多中文字不太會寫，我覺得可能的原因是：平常中文字寫太少。我想要求他每天抄寫100個中文字，可是要抄什麼呢？ 兒子平常不太看書，這兩三個月來我放棄要求他多看書，改成看電影，而且最好是外語發音的影片，這樣他就非得閱讀字幕不可了。我家有訂 MOD 電影199，所以影片資源不是問題。兒子覺得若是英語發音的電影，最好是有中英文字幕並列，這樣還可同時增進英語的語感。 基於上述兩點，若要每天抄寫100個中文字，我第一個想到的是  TED  的演講影片。首先找到他有興趣的影片，在看過影片後，我把  TED  演講影片的逐字稿印出來給兒子看，他閱讀時用螢光筆標注他覺得值得抄寫的句子，然後每天抄一百個字。也許也可以中英文都抄，哈！可能我太貪心了。 好，所以現在問題縮小為：如何印出中英對照的 TED 演講逐字稿？ 如何找到有中文逐字稿的 TED 演講影片？ 我幫各位準備好這個連結： 有中文逐字稿的 TED 演講影片列表 ， 有中文字幕，且以觀看人次排列。 如何印出 中文的 TED 演講逐字稿？ 例如，我瀏覽  有中文逐字稿的 TED 演講影片列表 ，我挑選了  Colm Kelleher: What is Zeno's Dichotomy Paradox? | TED Talk  這部影片，點一下在影片下方的「Transcript」，選擇「中文繁體」，然後您就可以取得中文的 TED 演講逐字稿了！ 您還可以複製貼上到文書處理器中調整一下排版，這樣閱讀起來會更舒適。 如何印出 英文的 TED 演講逐字稿？ 同上述的方法，點一下在影片下方的「Transcript」，選擇「English」即可 如何印出 中英對照 的 TED 演講逐字稿？ 這裡是本篇網誌的重點喔！ 1. 其實你已經有中英對照的 TED 演講逐字稿了 怎麼說呢？啊既然你已經把 中文的 TED 演講逐字稿印在一張A4紙上，也把 英文的  TED 演講逐字稿印在一張A4紙上，把兩張紙擺在桌上，不就是 中英對照 了嗎？ 2. 我想要的是「逐段並列」的中英對照 逐字稿 例如，我瀏覽  有中文逐字稿的 TED 演講影片列表 我挑選了  Colm Kelleher: What is Zen
閱讀完整內容

第1804回- Google 文件如何一次看兩頁？

-
圖片
今天在使用 Google 文件跟學生共同創作一個用餐禮儀短劇的劇本時，編寫到差不多的時候，想要一次展示兩頁給學生看，但發現 Google 文件在現階段沒有這個功能。 在 Google 文件中一次只能看一頁，真不方便！有沒有可能兩頁左右並排來觀看文件呢？ 下班回家吃過晚餐、飯後散步時又想起這件事，回家後打開 Chromebook 上網查了一下資料，有找到一個方法，可以讓 Google 文件 像電腦的文書處理軟體或是PDF檢視器那樣，可以兩頁並排顯示。 我是用關鍵字  2-page view in google docs - Google 搜尋  找到這篇 2-page view in Google Docs (Example)  但我看不懂要怎麼使用這一串指令？ 不死心又繼續找，找到這篇， view 2 pages at once in google docs. ，在註解中有提到： Use this JS in your google doc browser console，我就根據這個線索，在 Chrome 瀏覽器右上方三個點那邊選「更多工具」，然後選「開發人員工具」，點一下「Console」然後把以下這一串指令複製貼上： // Use this JS in your google doc browser console // Courtesy https://coderwall.com/p/qvdxia/2-page-view-in-google-docs (function(d, t, z, s) {     s = d.createElement(t);     s.innerHTML = z + '-outer{left:0px !important;}' + z + '-outer,' + z + '-inner{width:100% !important;}.kix-page{float:left; width:48% !important;}';     d.getElementsByTagName(t)[0].parentNode.appendChild(s); })(document, 'style', '.kix-zoomdocumentplugin'); 複製貼上後
閱讀完整內容