2016年2月25日 星期四

師資訓練影片: 第七課 ~ 第十課

第七課 製作遊戲




第八課 製作遊戲:進階一




第九課 製作遊戲:進階二



第十課 最後的挑戰




2016年2月20日 星期六

2016年2月18日 星期四

適合5-7歲孩子的程式工具:ScratchJr

下載網址:http://scratchJr.org 
適用年齡:適合5-7歲的孩子 
費用:免費 
使用平台:iPad或平板電腦

對於 8 歲以下、年紀更小的孩子, 他們從小就與智慧型手機或平板電腦為伍, 這些觸摸世代(Touchscreen Generation) 的電腦經驗是即時、直接而且直覺的。但是孩子都是以消費者的角度來使用觸摸式產品, 而非創造者的角度。這種單向的「使用者角度」, 對於孩子並不是一個好的開始, 家長可以有更好的選擇。

2014年麻省理工學院媒體實驗室(MIT Media Lab)、Tufts University 和 Playful Invention Company(PICO) 合作推出簡易版的 Scratch —— ScratchJr。ScratchJr 是以平板電腦為平台, 為 5 到 7 歲的幼兒所設計的:這個年齡層的幼兒「認字」有些困難, 而 ScratchJr 唯一需要輸入的文字, 是在角色說話的泡泡中輸入內容。

使用 ScratchJr 不需要上任何課程。在第一次打開 app 後,請先點選右邊的「問號」, 有一段影片示範 ScratchJr 的操作方式:如何點選積木、連接積木。點選左邊的「房子」就可以開始創作。



在進入主要的創作畫面後, 點選「問號」會出現以下畫面, 上半部的示範影片和之前是相同的, ScratchJr 也很貼心的製作 8 個範例, 讓孩子可以玩玩看, 也能加以修改。




第一個範例:Under the sea
ScratchJr 的介面比起 Scratch 簡單多了。建議家長嘗試這個方法:不干涉、不引導, 讓孩子自己探索。你會發現, 孩子原來是天生的程式設計家。讓孩子 coding for fun!


萬一遇到困難, 再參考下面的說明。

專案設計介面


1. 存擋:儲存目前的專案,回到上一層 —— 顯示所有專案。 
2. 舞台:所有的動作在這裡執行。要刪除角色時,按住角色,然後按「X」。 
3. 演示模式:將舞台展開成全螢幕。 
4. 格子:開啟或關閉 x - y 座標的網格。可以幫助使用者了解移動的距離。 
5. 改變背景:選擇或是創作圖片,做為舞台背景。Scratch 內建了許多的背景圖案如下。 


6. 加上文字:為在舞台加上標題。可以調整字體大小和顏色。

選擇字體大小

選擇字體顏色



7. 重設角色的位置:點選這個圖案後, 可以將角色拖曳到想要的起始位置。之後, 每次點選這個圖案, 所有的角色就會回到這個起始位置。 
8. 綠旗:所有使用「點一下綠旗, 然後...」積木的程式, 在你點選這個綠旗後, 就會開始執行。  
9. 頁面/頁面縮圖區:可以選一個已存在的頁面來編輯, 或是點選 ➕ 來創作新的頁面。每個頁面都有一組角色和背景。要刪除畫面時, 按住畫面, 然後按「X」。如果要重新排列畫面的順序, 把它拖到新的位置就可以了。像故事書的每一頁, 每頁都會有不同的場景與對話。這個功能讓孩子可以做一本電子故事書。 
10. 專案資訊:可以改變專案的標題、看到專案的創作時間, 還可以分享給朋友。分享的方式依據不同的平板, 可能有不同的分享方式。 
11. 回復和重做:如果做了修改, 想要回復成原先的狀態, 點選左邊的圖案可以撤銷最後一個操作, 回到原來的樣貌或狀態。點選右邊的圖案可以取消前面的回復動作。 
12. 程式:將積木黏在一起會組合成一段小程式。只要點選它, 程式就會執行。如果要刪除一個積木或是小段程式, 將它拖到程式區域外就可以了。要將程式複製到別的角色, 將程式拖到角色縮圖區就可以了。 
13. 程式區域:置放程式積木的區域。 
14. 積木表:這裡列出可以使用的積木。如何了解積木的功能呢?可以拖動一個積木到程式區域, 點擊它, 觀察它的作用是什麼。 
15. 積木類別:ScratcgJr 分為 6 類積木:事件積木(黃色)、 動作積木 (藍色)、 外觀積木 (紫色)、 聲音積木 (綠色)、 控制積木 (橙色)、以及結束積木 (紅色)。 
16. 角色/角色縮圖區:可以選一個已存在的角色來編輯,或是點選 ➕ 來創造新的角色。選好了角色,可以編輯它的程式、為 它命名、或是點選畫筆來編輯它的圖像。如果要刪除一個角色, 按住角色,然後按「X」。要複製角色到另一個頁面,請將它 拖到頁面縮圖區


繪圖編輯器


  1. 回復:回復上一次所做的改變。
  2. 重做:將上一個回復給取消。
  3. 形狀:選擇繪製的形狀:直線、圓/橢圓、長方形或三角形。
  4. 角色名稱:編輯角色的名稱。
  5. 剪下:先選擇剪下工具,然後點選角色或形狀,將它從畫面刪除。
  6. 複製:先選擇複製工具,然後點選角色或形狀,就可以複製相同的圖案。
  7. 旋轉:先選擇旋轉工具,然後點選角色或形狀,就可以讓它繞 著圖案的中心旋轉。
  8. 拖曳:先選擇拖曳工具,然後點選角色或形狀,就可以拖動它。如果你點擊一個形狀,可以拉動出現的點來編輯這些形狀。

步驟一:點選拖曳工具 步驟二:點選要修改的形狀,會出現幾個點。 步驟三:拉動最右邊的點,原始的形狀變化成新圖案。
步驟二:點選要修改的形狀,會出現幾個點。 步驟三:拉動最右邊的點,原始的形狀變化成新圖案。
  1. 完成:儲存所做的改變,然後離開繪圖編輯器。
  2. 填滿顏色:先選擇填滿工具,然後點選角色或形狀,就可以讓角色或形狀填滿目前所選取的顏色。
  3. 照相機:先點選照相機工具,然後點選角色或形狀, ScratchJ 會將照相機所拍到的畫面填滿這個角色或形狀。

步驟一:點選內圈橘色區域。步驟二:點選照相機工具,然後拍照。 
    12. 調色盤:挑選畫筆的顏色。
    13. 線條粗細:挑選畫筆的粗細。

事件積木



動作積木




外觀積木




聲音積木




控制積木




結束積木



2016年2月12日 星期五

高一自學生 Adrian 的故事

Adrian 在小學時期對程式設計沒有任何興趣,即使他的父親是資訊領域的佼佼者,也曾試著教他程式,但他覺得寫程式是很無聊的事。因此在小學時期,和多數的孩子一樣,Adrian 只是「電玩遊戲」的愛用者。

Adrian 在其他才藝上表現傑出。他曾參加公視節目「加油!小廚師」,製做料理時表現出沈穩與精緻度,得到了冠軍。他也在新唐人亞太電視台舉辦的「兒少盃鋼琴大賽」全國賽得到第二名。

在升國中一年級的暑假有了學習 Scratch 的機會。他父親在上課前直覺的反應是:「他應該不會喜歡的!

這是我們第一次以 ScratchEd 的課程來嘗試教學。這個教學以創意為出發點,不給孩子限制與框架,並且藉由好玩的活動來啟發孩子對程式的觀念。所以和班上多數孩子的一樣,Adrian 也創作了自己的程式,開啟了他對程式的熱情。

第一個進行的專案是「自我介紹」。Adrian 回憶,當初他被 Scratch 吸引的原因是,「角色可以飛來飛去,超酷的!」他花了兩天,為這個專案設計動畫,打籃球、彈吉他,腳還會打拍子,也在專案中放進了自己喜歡的音樂做襯底音樂。

Adrian的第一個程式—— 自我介紹。


之後每個星期的課程,更讓他愛上寫程式。他也在 Scratch 網站上探索有趣的專案,他形容:「雖然剛開始時,不曉得別人的程式是如何寫的,但是試著改變程式裡的數字,發現角色亂飛或變得很奇怪,都覺得非常好玩。」「每次上課分享作業時,很享受那種炫耀的感覺。所以,每次都會花上更多時間來寫程式。

期末作品。這是一個模仿「馬力歐」的遊戲。 

在學完 Scratch 之後,Adrian 開始學習 Udacity 的電腦入門課 CS101:「Introduction to Computer Science:Building a Search Engine」,由美國維吉尼亞大學的 Dave Evans 教授主講,他曾獲得維吉尼亞州大學教師的最高榮譽。課程內容包括電腦硬體、軟體、以及網路的運作方式。其中軟體的部分,以製作搜尋引擎為目標,使用Python程式語言作教學,帶領學生進入程式設計的殿堂。 


這個課程有別於一般的課程,甚至與其他 MOOCs 的進行方式也很不一樣。課程分割成許多小單元,每個小單元以 1 ~ 6 分鐘的影片進行教學,中間穿插著許多的小測驗(如下圖)。


學生在瀏覽器中寫程式,「提交作業」(submit),執行結果馬上秀在右上角。如果答對了(Correct),進度表上的白點就會變成深藍色,學生可以自行檢視上課進度。遇到不會做的習題怎麼辦呢?只要點選「繼續回答」(Continue to Answer),老師會在影片中做詳細的解說。因為是線上課程,所以學生可以反覆點閱影片自我學習,適合學生在任何時間上網自學。 

這樣的學習方式對 Adrian 來說真是太好玩了,就像玩闖關遊戲,當進度表的藍線向右不斷地增長,一個一個的白點變成藍點,是充滿動力與成就感的。萬一遇到問題,每週還能透過 Skype 與小組討論,很快地,大約三個月 Adrian 就拿到了第一張 Udacity 的證書。

Udacity CS101 證書

在這期間,Adrian 對程式充滿了狂熱。白天要去學校上學,所以早上五點起來學程式,甚至養成了早睡早起的習慣。因為在這之前,上學可是常遲到的!

Udacity 是以英文教學,為了讓學生在學習初期降低來自英文的壓力,所以筆者為 CS101 翻譯了中文字幕。Adrian 回顧這個學習過程:「當我看到比較有趣的內容,我會多看幾次。第一次會先看中文字幕,第二次看英文字幕,第三次再把字幕拿掉,聽老師用英文講解。

就這樣,Adrian 逐步地克服了英文,英文能力不斷地進步,讓他在後續的課程中可以直接以英文來學習。

Udacity 的課程強調實作,即使是理論課程,也是透過寫程式來確認學習成效。雖然我們給了 Adrian 一些學習的方向,但在 Udacity,他探索到許多吸引他的課程,所以在短短第一年三個月內又收集到這些課程的證書:
  • Web Development: How to Build a Blog (2013/4/2)
  • Programming Languages: Building a Web Browser (2013/7/17)
  • HTML5 Game Development: Building High Performance Web Applications (2013/8/1)
  • Interactive 3D Graphics: Creating Virtual Worlds (2013/8/17)
  • Artificial Intelligence for Robotics: Programming A Robotic Car (2013/9/24)
  • Design of Computer Programs: Programming Principles (2014/4/11)

了解資訊領域的讀者可能會感到訝異,一個國二的孩子竟然有這個能力完成這些課;有些課程甚至到了資訊系大學三年級的程度。

Adrian 國三時選擇了自學,有更多的時間投入程式設計領域。他已經會寫這些語言:Python、JavaScript、CoffeeScript與R。也積極的參與社群:Taipei.py、Taipei Javascript Enthusiasts、PyData、Taiwan R User Group / MLDM Monday、和 Meteor Taipei。也與社群中的朋友一同創業。

Adrian 在 2015 的 PyCon APAC/Taiwan 會議中,還以英文主講「The Implementation of Rubik's Cube Formula in PyCuber」,以 Python 語言自動解魔術方塊,JavaScript 來做動態顯示。


Adrian 現在高一自學,寫程式累了就彈鋼琴,完全沈浸在程式與音樂的樂趣中。目前也是我們「摳頂俱樂部」的大將,負責引領學弟妹的程式學習呢!