Category Archives: Scratch

Scratch X.org Arduino 相關指令介紹

請先參考本文來聯通您的 Arduino 與 Scratch X.org 網站:

Scratch Extension for Arduino – Scratch + Arduino 的新方案

簡單來說這個解決方案看起來是比較完整且容易做到的 Scratch 網頁結合 Arduino 控制,也支援部份 Seeed Studio 的 Grove 設備,目前支援的 Grove  裝置有以下六種,除了溫度感應器之外其實不太需要買啦,就是圖個方便囉。

螢幕快照 2015-05-16 上午1.20.54

以下是在 Arduino extension 中可用的 Scratch 指令

當電腦與 Arduino 連線成功時,,執行本事件下的指令。


將 LED、按鈕或伺服機連接到指定的數位腳位 (D2, D3, D4, D5, D6, D7, D8).


將電位計、光感測器或溫度感測器連接到指定的類比腳位 (A0, A1, A2, A3).


點亮或熄滅LED


指定 LED 的亮度,範圍為0 – 100%.


以指定 % 來改變 LED 的亮度。


讓伺服機轉動到指定位置,一般來說都是 0 – 180 度。


以指定角度來控制伺服機的位置。


當指定按鈕被壓下時,執行本事件下的指令。


檢查某個按鈕是否被壓下。


當旋轉式電位計、光感測器或溫度感測器的值滿足指定條件時(<, = , >),觸發本事件下的指令。


讀取旋轉式電位計、光感測器或溫度感測器的值,回傳值為0 – 100。


將指定的數位腳位(D2, D3, D4, D5, D6, D7, D8) 打開或關閉。


設定支援 PWM 的數位腳位的值 (D3, D5, D6) 為 0~ 100,單位為 %。


當指定數位腳位(D2, D3, D4, D5, D6, D7, D8) 為開(on)或關(off)時,執行本事件下的指令。


檢查指定數位腳位(D2, D3, D4, D5, D6, D7, D8) 的狀態為開(on)或關(off)。


當指定類比腳位的數值 (A0, A1, A2, A3) 滿足指定條件時(<, = , >),觸發本事件下的指令。


取得指定類比腳位的數值(A0, A1, A2, A3).


將輸入值對應(map)到所指定的兩個數值之間,例如可以將某個類比感測器的值(0 ~ 100) 對應到動畫角色的 x 座標 (-240 ~ 240).

Scratch Extension for Arduino – Scratch + Arduino 的新方案

Arduino.cc 的 blog 有個有趣的消息: Scratch Extension for Arduino。之前的作法大多是使用本機執行的 S4A 小軟體。這一版的亮點是支援 Grove 系列感測器, 搭配 Grove Base shield 之後就能控制 Grove 的數種感測器 與 servo,另外也可以使用 picoboard 與 wedo。

英文教學: http://khanning.github.io/scratch-arduino-extension/

操作方式如下:

1. Arduino 端一樣要安裝一個小程式 : Standard Firmata,負責回應來自 Scratch 的所有呼叫。如果要使用 Processing  來控制 Arduino 也需要它喔。請確認這隻程式已經上傳到您的 Arduino 並執行。

2. 安裝瀏覽器 plugin 檔名為 ScratchDevicePlugin.msi 或 ScratchDevicePlugin.dmg, (目前有 Windows 與 MAC)。安裝完成之後開啟  http://scratchx.org/?url=http://khanning.github.io/scratch-arduino-extension/arduino_extension.js 瀏覽器會詢問是否要起動外掛, 在此要同意才能使用.

  • Firefox:

 fox1

fox2

npapi

3. 順利完成的話, 會看到畫面中間的 Arduino 字樣旁邊的小圓圈變成綠色, 代表連線成功.

005

指令來看是差不多的, 在[更多積木] 之下有Arduino 相關的指令, 之後會專文介紹

 

005

這就是讓 #D13 LED 亮滅的小程式, 您完成了嗎?

006

 

Scratch設計:射擊遊戲:火龍鬥勇者

這次分享的是之前製作的專題-火龍鬥巫婆,這次讓這個射擊遊戲增加了主角可以累積必殺技量表,發射必殺技

圖片2

除了發射必殺技之外,火龍的攻擊也有普通攻擊,每擊敗一隻巫婆就可以一點累積能量表

圖片1

累積量表是使用Scratch的畫筆功能,在想要的座標點上面往右邊畫一條線,每每積一點就畫一截

累積滿五點的時候,必殺技量表彙編成紅色的,並且不會再累計能量表

圖片3

圖片4

 

火龍按下鍵盤的上移鍵發出大絕招

圖片6

當巫婆碰到火龍的普通攻擊或必殺攻擊就會被消滅

圖片5

 

 

下載的檔案在這邊-火龍鬥巫婆

下次再繼續分享相關的功能~~~

[Scratch2.0]小遊戲製作-場景篇:計時器、血量條

前二個禮拜人物的基本設定完成後,緊接著要來加入場景,我們需要一張背景圖、計時器、血量條、頭像,完成後會長得像這樣:

血條計時器1

看起來是不是愈來愈有遊戲的感覺呢?只要幾個步驟,您也可以輕鬆做出這樣的效果喔!

首先製作背景圖片,您只需要上網找一張自己喜歡的背景圖片,並在舞台->背景->上傳背景檔案,將第一張空白的刪除,若需要調整大小,請按下選擇,按住滑鼠左鍵拖曳選取整張圖片後,即可調整大小。

2

接著我們需要頭像、計時圖、血量條黑底圖、血量條框,可自行上網下載或使用繪圖軟體繪製即可。進入程式,在血量的設計上,會用到「畫筆」的功能,藉由下筆和停筆來進行血量的調整。

Step1:新增一個空白角色。

Step2:在程式區裡,加入無窮迴圈,設定畫筆顏色及大小,以及下筆、移動10步、停筆、移動-10步,您會看到畫面出現一小段色塊。

3

Step3:設定二個變數分別為blood1、blood2,並在背景區的程式裡將變數的值設定為100,變數的作用在於讓血量能夠隨著變數的變動而變動,起始值為滿血的狀態。

4

Step4:在血量圖的程式區裡,移動步數內加入blood1和blood2變數,在此可自行調整數值至滿意的長度。加入變數的目的在於當受到攻擊時,血量可以經由blood變數的改變而減少。

5

Step5:在站立挨打的程式中,加入「將變數blood2的值改變-2」,如此一來,當角色受傷,上方的血條也會跟著減少。

6

最後只要將血條的位置移到計時器旁邊即可。計時器的設置我們需要0-9的數字圖片,透過換圖片的方式來達到倒數的效果。

Step1:匯入0-9以及0-6的圖片。

Step2:設定大小、位置並分別將起始數字設定6和0。

Step3:在偵測裡找到計時器,加入條件「直到計時器>60前都不斷重複」,重複動作為換造型、等待秒數,倒數結束後將造型設定為00。

(個位秒數設定)

7

 

(十位秒數設定)

8

最後要注意的是,迴圈裡的等待秒數可自行調整,關鍵在於個位秒數從0變為9時,十位秒數也要同時減1。附上檔案供下載,希望大家能做出自己喜愛的背景。

[Scratch2.0]小遊戲製作-人物篇(二)攻擊、受傷動作

在上禮拜的文章教學中,有教大家做出讓自己的角色前進、後退、跳躍、蹲下的動作,這禮拜要來教大家做出攻擊、受傷的動作。

攻擊的動作有輕拳、重拳、輕腳、重腳攻擊,程式設定的方式與上禮拜的教學大同小異,重點在於按下二個按鍵時不會有同時出現二個攻擊動作的現象,以及攻擊時就不移動。

10

設定四個攻擊動作的變數並且在背景中設定按鍵不衝突(a、s、d、f分別為輕拳、重拳、輕腳、重腳)

1

輕拳攻擊

2

重拳攻擊

3

輕腳攻擊

4

重腳攻擊

5

最重要的等待動作也要設定隱藏的時機

6

新加入另一名角色後,分別建立等待及受傷動作,接著設定受傷的動作,概念是「當被攻擊到時,則播放受傷動作」

step1:先設定兩個變數分別為「hurt1」「站立挨打」

step2:在輕拳攻擊中設定當攻擊時hurt=1,攻擊完後hurt=0

7

step3:在「站立挨打」裡設定,當hurt=1且角色x座標距離靠近時(大於144),將「站立挨打」變數=1並播放受傷動畫,播放完將hurt設為0。

8

step4:在新建立的角色等待中設定如果「站立挨打」=1就隱藏,否則顯示等待動作

9

最後執行程式並按下輕拳攻擊,你看!加了受傷的效果看起來是不是更有趣,您還可以在其它三個攻擊動作中分別加入不同的受傷動作,讓遊戲玩起來更豐富喔!附上檔案供下載

[Scratch2.0]小遊戲製作教學-人物篇(一)移動

最近接觸了Scratch這款軟體,花了一些時間熟悉之後,發覺在製作2D平面遊戲時還滿方便的,網路上也有豐富的資源可以應用、參考,基於對遊戲的熱愛,便想做一款格鬥遊戲。講到格鬥遊戲,我腦中第一個浮現的不是Street Fighter,而是KOF,畢竟玩KOF的時間較長,技能也較華麗。

首先從人物下手,網路免費資源豐富,圖檔隨手可得,本篇的人物圖檔為GIF,GIF的特色為一連串的連續動作圖片所組成的單張動畫圖,會選擇GIF是想讓人物增加可玩性和可看性。

 

本篇要做到能夠控制人物左右移動、原地跳躍和蹲下的基本動作,首先開啟Scratch2.0,在下方角色欄點擊上傳角色檔案,將五個基本動作圖都匯入。(Scratch2.0的好處為中文檔名不會有亂碼,且當匯入GIF時,在造型區會列出該圖的連續動作圖片,非常方便)

1

接下來進入到程式區,定位起始點,選擇角色區裡的等待,拖曳角色至左下角適當的位置,點選動作,並將X、Y座標勾選,便可看到該圖片的座標位置,最後放入程式積木,概念是:執行程式時,顯示角色並移到起始位置,後面的四個動作圖片也以同樣的方式放入程式。

2

 

接著要讓圖片先在原地動起來,除了等待外,其他四張圖片分別在按上、下、左、右鍵時能動起來。在背景裡的程式區定義四個動作的變數並設為0,按下特定按鍵讓特定動作的變數變為1。然後在角色裡的程式區設定變數為1就換「下一個造型」。

3

4

再來讓我們的角色能夠往前移動,加入「移動10步」(後退則「移動-10步」),並放入IF…ELSE設定在接近邊緣時,將X座標設為200,這樣可以做到不超出邊緣的效果。

5

到這邊會發生一個問題,也就是當同時按下二個按鍵時會有分身的情況,要解決這個問題,需將條件設定嚴格一點「如果其中一個變數為1且其它變數為0時,才顯示造型」,背景程式區也要更改為「按下按鍵時,該變數為1,其它為0」。

6

7

在等待的設定,人物不動的時候顯示等待,如果前進、後退、蹲下、跳躍才隱藏。前進和後退都會改變圖片的位置,所以當前進或是後退時,等待的圖片都要移到該位置才行。

9

最後,跳躍的設定較為特殊,因為當按一下按鍵時,就要播放完整的跳躍動畫,而在這過程當中,跳躍變數都要設為1,直到動畫結束才將變數設為0。

8

到這邊您的人物已經可以前進、後退、跳躍、蹲下了!!並附上sb2檔供參考下載。

Scratch Board專案設計:觸碰感應手指 小小音樂家

今天要介紹的是使用Scratch軟體與Scratch Board製作的觸碰感應手指,小小音樂家。

14-51 14-52

 

這是這次使用的模組是專為Scratch所設計的開發版Scratch board

14-1

 

製作感應手準備的材料

十分容易取得,剪刀、導電膠帶、單面魔鬼氈、錫箔紙、Scratchboard

第一次聽到導電膠帶的讀者,導電膠帶在電子材料行就可以買到了。

14-2

 

製作感應指套:

首先將導電膠帶繞自己的手指一圈,將繞自己手指一圈的長度做上記號,並將這個記號加上一公分的長度後剪下來

14-3

接著將魔鬼氈與導電膠帶的另一面撕下來,如果買的是跟我一樣的人,導電膠帶和魔鬼氈撕下來之後繪有雙面膠,將導電膠帶與魔鬼氈雙面膠的部分互相粘再一起,如果魔鬼氈比導電膠帶寬,請再貼上一個導電膠帶,讓魔鬼氈另一面佈滿導電膠帶。

14-13

接著將另一面毛茸茸的魔鬼氈剪下一小塊,將魔鬼氈四分之一的部分與剛剛的魔鬼氈粘再一起。接著反折,將下方毛茸茸的魔鬼氈,粘在上方粗糙部分的魔鬼氈,這樣指套就完成了

14-15

重複上面的動作就可以做出四個感應手指囉

14-17

製作感應版

請準備錫箔紙與一塊板子,錫箔紙使用一般超市買的錫箔紙即可,為了不讓容易破的錫箔紙一下子就壞掉,我們需要準備一塊板子將錫箔紙貼上去,板子是什麼材質都沒關係,大小至少要一個手掌大

14-19 14-20

 

與Scratchboard連線

首先拿出Scratchboard附贈的線,將四個紅色的夾子分別夾在感應手指上,黑色的夾子夾在感應版上

14-21

接著將食指的線插在Scratchboard標示A的孔,中指插在B的孔,無名指插在C的孔,小指插在D的孔,請確實插入孔內,不然會讀取不到數值。完成之後可以在 Scratch 中看到狀態變化

14-22

 

14-24

設定Scratch主要程式

產生變數,請按變數選項,產生變數「手指偵測」、「食指」、「中指」、「無名指」以及「小指」

14-29

 

點選舞台,設定程式一開始的狀態,將手指偵測數量設為0、音量設為50、選擇一開始遊戲的背景。

新增廣播事件,在廣播按鈕中選擇「開新檔案」,並新增「音量調整」、「手指偵測」、「一隻手指」、「兩隻手指」四個檔案

14-35

 

請在舞台中設定,我們將電阻感測「A」設為食指、[B]為中指、[C]為無名指、[D]為小指,

如果數字小於50,代表手指有碰到錫箔,將食指變數設為1,感測值大於50則代表沒有碰到錫箔,將食指變數設為0

14-39

 

設定一隻手指頭出現音符,「Do」、「Re」、「Mi」、「Fa」

14-43

 

設定兩隻手指出現音符「So」、「Ra」、「Si」、「Do」

14-47

點選小貓後,從「聲音」選項中,拉出「音量設定」積木,並從「」將「滑桿的偵測值」放進去,點選小貓後,從「外觀」選項中,拉出「將大小設定」積木,並將「滑桿的偵測值」加數字100放入,「將大小設定」積木中,這樣音量越大聲,貓也會變得越大喔

14-49

啟動小小音樂家

寫完程式之後,就可以開始期待已久的試玩囉,首先請確認活動一的是否完成了,完成之後,

使用你的感應手指,與你的Scratch一起玩音符吧

14-57 14-58

14-59 14-50

14-51 14-52

14-53 14-54

14-55 14-56

 

 

感應手指還可以應用在許多地方喔,歡迎大家與我一起討論

140608 Scratch 趣味互動研習 課程花絮

本周日請到花蓮邱老師來主講Scratch 趣味互動研習,還搭配 Scratch board 來練習許多有趣的互動效果,包含按鈕、光、麥克風與自製導電接點等等。來賓都可以帶一片 Scratch board 回家,期待大家都能樂在其中喔

2014-06-08 16.44.58

Scratch board 簡介

2014-06-08 13.16.24

2014-06-08 13.16.18

邱老師一直很客氣地說,只是國小的玩意,但我們認為能得到老師們第一線教學上的應用也是非常寶貴的經驗。畢竟 Scratch 就是要給小朋友用的,如何站在小朋友的角度來思考也是很重要的。

事實上用起來才知道也不簡單呢,很多重要的程式概念例如物件導向(objet orientation)與事件(event)等等,Scratch 都有很好的呈現來讓小朋友不知不覺中就具備了這些重要的程式概念呢!

2014-06-08 13.43.17

一個橫向卷軸射擊遊戲很容易就完成了耶!

2014-06-08 14.19.26

 

Scratch board – 讓 Scratch 感測實體世界,還可直接與 Raspberry Pi 搭配使用

Scratch 大家都熟悉, 今天要介紹的是 Scratch PICO board, 這是一塊簡單的互動板, 只要接上電腦就能直接用 Scratch 中的偵測指令來製作各種有趣的互動專題

我們 6/8 的 Scratch 趣味互動研習營就會教各位如何使用這片板子來製作有趣的互動專題,研習結束就可以把這片板子帶回家,還有《程式設計邏輯訓練:使用Scratch 》教學書籍喔!如果要單獨購買也是可以的,我們延續 Maker Faire 展場特價,一片是 $600元

來看看板子上有什麼:左側四個鱷魚夾接點,左下方一個麥克風,黃色的按鈕以及上方的滑桿。

2014-06-05 14.43.22

盒裝中有附四個鱷魚夾,連接到 ABCD 四個其中接點之一,只要鱷魚夾所夾的東西能夠導電,就可以被偵測到。很容易就能做出例如水果鋼琴等趣味效果。

2014-06-05 14.43.44

來寫個簡單程式吧,拉動滑桿就可以讓小貓左右移動,如果按下黃色按鈕的話,小貓就會開心地原地旋轉。這兩件事情可以同時發生喔,寫程式是不是簡單多了呢?

scratch001

在 Scratch 的偵測指令下,就能直接抓到板子的狀態,請看下圖

scratch003 scratch002

 

當然, Rasperry Pi 也是可以直接使用 Scratch Board 的!只要如以下連線就可以了。Raspberry Pi 的 Raspbian 系統就有 Scratch,馬上就可以讓您的 Pi 變成行動學習中心喔

2014-06-05 14.43.08