Showing posts with label Kid Programming. Show all posts
Showing posts with label Kid Programming. Show all posts

Jun 10, 2013

小朋友寫程式 (1-3):SCRATCH Sprite物件複製與程式修改

複製Sprite物件並逐步修改新物件的程式,這方法也太dirty work,若你身為一個優秀的programmer,還常常很笨的做dirty works,說你有多厲害我也不信!但是「一切從基礎做起」,還是要一步步修改給你參考 (不然要我現在跟新手解說 物件導向由class宣告產生同類別的相似objects 嗎?)。

  • 複製Do以便修改為Re物件。

複製Sprite物件



  • 新複製的Sprite物件必須拖拉到正確位置,並在程式碼修改為對的位置。 
Sprite物件拖拉到正確位置,並更名

設定新Sprite物件的新位置

分割程式區塊:滑鼠click所選 (含) 指令以下為新區塊

  •  分割程式區塊技巧:熟悉操作就對了。



  • 最後再改聲音就完成了。

觀察Play sound值與範圍,並設定新值 (D就是Re的音)
其他琴鍵可以依此類推,自己玩看看吧!現在還不是教「自己設計模組 More Blocks/Make a Block」。



小朋友寫程式 (1-3):SCRATCH Sprite物件設計與程式撰寫

寫程式先從What You See, What You Design開始。加上物件模組設計概念,鋼琴當然由琴鍵開始。先完成琴鍵UI物件,撰寫物件程式碼 (也就是物件導向的class codes),最後完整程式就可以由小模組整合完成。
  • 建立新專案 (Piano):刪除原先的貓咪UI物件,自行設計琴鍵。


  • Paint new sprite:click之後就可以自己畫新的UI物件 (Sprite1),用矩形當琴鍵,並用 "Fill with color" 填滿白色,並命名為 "c1"。之後,立刻複製 (duplicate) 另一琴鍵,並填滿灰色,以做為琴鍵按下時的陰影顯示。



  • 更改UI物件 (Sprite1) 名稱為 "Do",物件變數命名要清楚有意義:點選左上角 i 小icon,就可以修改物件名稱。

  • 撰寫UI物件 "Do" 的程式碼:點選 Scripts 就可以切換到物件的程式碼,以不同顏色分類指令類型,清楚理解指令動作和參數。如下圖,指令由上到下依序為「當click此物件Do」、「到此物件座標,注意:在拖拉move指令前先調整好物件位置」、「將物件裝飾換為c2 (製造按下去的陰影效果)」、「等0.1秒 (這樣才看得到按鍵效果)」、「將物件裝飾換為c1 (還原琴鍵)」、「設定樂器到which instrument的值」、「播放聲音0.5拍」。
原Piano琴鍵程式碼:set instrument to "which instrument"

我的程式碼還沒有將變數與樂器做data binding
  • 設定變數值,並與物件屬性值連結 (data binding):Scripts/Data/Make a Variable,產生一個變數命名為 "instrument#" 樂器編號,並在此Sprite物件點選右鍵,設定為 "Slider" 並設定最小值和最大值 (Min, Max)。最後拖拉 instrument# 物件到樂器物件的屬性,以便做data binding。 
Scripts/Data/Make a Variable:建立變數,設定為滑桿 (slider)

觀察instrument值的範圍 
限定範圍 (min, max)

拖拉變數值和物件屬性值連結 (data binding)

完成之琴鍵程式碼

小朋友寫程式 (1-2):由SCRATCH先參考別人作品開始

寫程式先從參考別人作品開始,不然可能永遠不知道學一堆指令能做什麼事?登入Scratch後,直接click 「Try out starter projects」,就可看到幾個由「SCRATCH社群網友」所分享的專案。



Here are example projects that you can play with and change. 所以,大家不只可以參考範例,還可以改範例再度分享,這也是Scratch的開源精神。想向一堆小朋友從小就知道分享、開源、在社群「同儕學習」,這些在十幾二十年後,會有多大影響。


選擇 "Piano" 專案,開啟後就可以按旗子執行。按右上角的 "See inside" 就可以看到原始程式碼。


 在網頁最上方也可以 click "Explore" 探索其他人的專案 (Projects),或是多人所組成的工作是 (Studios)。個人帳號也可以建立Studio,吸引其他同好加入某一主題創作。

新增說明文字



回到Piano專案的程式碼來學習吧!這是一個很棒的模組化專案,由鋼琴琴鍵說明一個個模組,可以組成一台鋼琴。每個琴鍵 (這台鋼琴共13個琴鍵) 為獨立模組有自己的程式碼,如同class內所定義的methods (稍後說明)。


在 "Sprite (物件角色)" 視窗範圍內,就是顯示程式用到的UI物件 (如同class所產生之object,擁有程式碼控制UI和I/O),可以自行創作。選擇琴鍵後,click "Costumes (造型)" 來設計UI物件,鋼琴的第一個琴鍵命名為c1, c2 (注意:這是物件變數名稱,程式會用到),就是要代表 "Do" 琴鍵 (c1) 以及按下去後要顯示琴鍵陰影 (c2設為灰色)。第二個琴鍵如以下第二、三張圖,是升記號#鍵,分別是物件:c#1, c#2。所有琴鍵當然可以用copy-and-paste快速產生。




看完範例後,很容易懂對不對,但這不代表你會做了。學院派當然很懂理論,但MIT強調創新、技術、實作,不動手做,永遠只能說說而已!下一篇再解說每個琴鍵的程式碼。




Jun 5, 2013

小朋友寫程式 (1-1):MIT的SCRATCH初體驗


Scratch是MIT Media Lab (這間全世界頂尖的實驗室,對人機介面技術貢獻太大了) 的Lifelong Kindergarten Group (LKG) 所開發的圖形視覺化的程式設計軟體。雖然建議8-16歲學習 (Who Uses Scratch?),但應該懂英文6歲以上的小朋友就可以開始學習程式設計的邏輯思考模式。平台提供程式模組,透過流程操作設計遊戲、音樂、故事、動畫等多媒體應用程式,可以將創意透過平台分享全世界。先看看LKG leader Mitch Resnick在TED的演講吧!要是你的小孩有此成就,應該比他幫妳過母親節更快樂。


在現在與未來極度依賴資訊科技的時代,競爭力來自對資訊的掌握,順便看看各位大師和成功人事對coding的想法。


先從這裡開始吧。

Learn how to make a project in Scratch

這是我做好的第一個測試程式。讓貓咪按「執行旗幟」後,先等0.5,say "Hello",重複10次移動、旋轉兼播打鼓聲音。藉由SCRATCH的「簡單快樂學習」過程中,我想逐步帶入寫程式的觀念。
  • 設定物件角色初始狀態 (程式宣告物件或變數要給初始值,也就是在constructor的程式碼或是初值):先調整主角 (Cat) 的位置和狀態,可以直接drag-and-drop到想要的位置,或是直接點選右邊指令執行,以修改角度 (turn)、位置 (move) ...

  • 要懂得看程式軟體的Help or Tips,這是學寫程式的基本:畫面右邊有一步一步的教學,先做一次感受一下先做一次感受一下。

  • 學寫程式,務必提升English Reading能力,第一手文件絕對是英文,你不希望每次都等中譯本出版,才能學新東西吧。Learning from the Web。真的不行,請把UI設定為中文。但是,你又再次逃避問題了!

  • 每一個像樂高積木模組的圖,就是指令內含參數 (程式指令說一不二,該移動10步,絕不會有誤。所以,你如何控制程式指令,撰寫的程式碼,就代表個人品質 (都是積木,不同個人疊出來的就是差別很大)。笨App就是笨蛋寫的!)。由上到下,指令依序為:Run, Message, Loop(Move, Play sound, Turn, Move, Play sound)。每個指令都有內部數值可以修改,就如同class內所定義的attributes

  • 按「執行旗幟」Run Program.


Enjoy your first SCRATCH program! To be continued ...