用Micro：bit做活動啟動儀式道具

謝作如　張敬云

在2017年上海創客嘉年華的教育論壇上，國內創客教師社群“貓友匯”和上海蘑菇云合作，在全國范圍內啟動“校園創客嘉年華”活動。在論壇的前一天有教師提議，應該讓啟動儀式更有儀式感，最好有特定的道具。因為“校園創客嘉年華”是一個非常有意義的活動，啟動儀式自然不能太寒酸。于是，筆者自告奮勇連夜做了一個啟動儀式道具。

創作思路

筆者最近一直在研究Micro：bit，并做了好多小項目。Micro：bit的廣播功能是它的亮點，利用廣播功能設計一個互動作品，在“校園創客嘉年華”的啟動儀式上讓更多的人參與進來，共同見證創客盛會的開啟，不僅好玩，而且有“眾人拾柴火焰高”的象征意義。

很多人參加，就需要很多塊Micro：bit板子。但這不擔心，上海創客嘉年華的主辦方DFRobot公司可以為現場的嘉賓提供足夠多的板子。至于互動作品的編程語言，筆者選擇了Processing。Processing和Micro：bit互動一直很穩定，筆者之前已經寫了好多個互動作品。

作品描述

用電腦運行Processing，顯示一個空白的窗口；一塊Micro：bit作為信號接收端，插到USB口；嘉賓們人人持一塊Micro：bit，作為信息發射端；當嘉賓同時按下Micro：bit的A、B鍵時，板子上會出現一個向上的箭頭；作為信號接收端的Micro：bit板子會閃爍一次“心”型符號，電腦屏幕隨機出現幾個大小及顏色不一的泡泡，并發出魔幻音樂。隨著嘉賓同時按下A、B鍵的次數越來越多，屏幕顯示的泡泡也越來越多。當按鍵次數達到一定的閾值時，屏幕開始進入自己播放階段，小小的像素點越來越密集，背景圖片的輪廓也越來越清晰。最后，畫面全部顯示出來，電腦播放出振奮人心的交響樂。

作品的具體流程及各階段的畫面顯示效果如圖1～下頁圖4所示。

代碼實現

這個互動媒體作品由信號發送端、信號接收端和畫面處理端三部分組成。

（1）信號發送端。用MakeCode編寫，運行于Micro：bit，當用戶按下“A+B”鍵時發送廣播信號。

（2）信號接收端。用MakeCode編寫，運行于Micro：bit，通過廣播接收用戶發來的信號。

（3）畫面處理端。用Processing編寫，在電腦上運行，通過串口接收信號接收端的信息，對畫面進行像素化處理，并播放聲音。

本作品中，Micro：bit要用到Radio（無線電廣播）模塊和Serial（串口）模塊，如圖5和圖6所示。用戶將按下的Micro：bit的A、B鍵的信號通過無線電廣播模塊發送給接收端，接收端接收到信號后，通過串口向Processing發送消息。

Processing代碼說明：運行程序，電腦屏幕呈灰色顯示。當接收到信息1時，屏幕隨機出現幾個大小及顏色不一的泡泡，并發出魔幻音樂，當接收到信息1的次數越來越多但小于預設值時，屏幕顯示的泡泡也越來越多；當接收到信息1的總次數達到預設值時，屏幕開始進入自己播放階段，密密麻麻的像素點越來越多，背景圖片的輪廓也越來越清晰，最后全部顯示出來，電腦發出振奮人心的交響樂。

因為代碼較長，以下僅提供核心代碼。

PImage photo；

import Processing.serial.*；//導入serial通信庫

import ddf.minim.*；

AudioPlayer player1；

Minim minim；

Serial myPort；//創建對象duankou

int data；//變量data作為串口到的數據

int s；

int xx， yy；//因為全屏需要計算的偏移量

void setup（） {

fullScreen（）；//全屏顯示

xx=（width-1233）/2；

yy=（height-688）/2；

photo=loadImage（"2017.png"）；

myPort = new Serial（this， Serial.list（）[1]， 115200）；

minim = new Minim（this）；

player1 = minim.loadFile（"bg.mp3"， 2048）；

}

void draw（） {

if （myPort.available（）>0）

{

data=myPort.read（）；

s=s+1；

}

if （data=='1'） {

for （int i=0； i<15； i++） {

int x=int（random（photo.width））；//隨機選取一個像素0-圖片寬度

int y=int（random（photo.height））；//隨機選取一個像素0-圖片高度

int xy=y*photo.width+x；

loadPixels（）；

float r=red（photo.pixels[xy]）；

float g=green（photo.pixels[xy]）；

float b=blue（photo.pixels[xy]）；

fill（r， g， b， 50）；

int diameter=int（random（5， 20））；

ellipse（x+xx， y+yy， diameter， diameter）；endprint

}

data=0；

player1.loop（）；

player1.play（）；

}

}

Micro：bit發送端代碼：如果按下Micro：bit的A、B鍵，則通過無線廣播模塊發送數字1，并在Micro：bit屏幕顯示“向上”的方向鍵圖標（如表1）。

Micro：bit接收端代碼：如果通過無線廣播模塊接收到的數字為1，則向串口發送字符1，并將變量t設為1，同時Micro：bit屏幕顯示“心”型符號保持500毫秒（如表2）。

效果展示

下頁圖7～圖9是“校園創客嘉年華”啟動儀式現場的照片，嘉賓們帶著無比好奇的心情參與了隆重的創客盛會啟動儀式。

活動結束后，大家對這一作品評價很高。一位老師說道：“這個啟動儀式表達了創客教育始于草根，其寓意在于眾多的草根教育創客遍布全國各地，每個人的貢獻可能只是微光如豆，但彼此努力相互取暖，最終就能換得大道持久。”

這個互動媒體作品的成功展示，讓現場的老師對Micro：bit的強大功能有了更加深刻的印象。同時，筆者將這一互動媒體作品命名為《創·聚》，讓更多人記住創客教育從零到一、聚沙成塔的過程。

直播分享地址：

校園定向教學指導：https：//www.CCTalk.com/v/15082168528781？channel=copy&platform=android

學生校園定向實踐：https：//www.CCTalk.com/v/15082183715927？channel=copy&platform=android

定向評價：https：//www.CCTalk.com/v/15082199768914？channel=copy&platform=android

定向活動頒獎：https：//www.CCTalk.com/v/15082210082145？channel=copy&platform=android

后記

我們通過直播可以清晰地看到在包老師所在學校，教師和學生在課堂上對教學APP的嫻熟運用，并看出包老師對信息化條件下項目式學習的課堂教學的設計重構，我想這對于很多希望在自己的課堂中也應用教學APP的教師來說是很值得借鑒的。由于包老師放了很多的CCTalk圖片，所以筆者對于是否推薦本文有點猶豫，但包老師的一句話打消了我的顧慮：“這是免費的，非常適合一線教師使用，好東西就要分享啊。”endprint