ロボット教材つくるよ！

小学１年生の息子をロボット格闘技「ロボワン」の予選に連れて行ったら、すっかりロボットの魅力にとりつかれてしまったよ　彼のお気に入りロボは「シンプルファイター」とのことで、家でも弟を相手にロボットになりきってロボワンごっこざんまいだ。
「自分でもロボットをつくって岡本先生に弟子入りしたい！」というので、親としては「LEGO マインドストーム」でも買ってあげようかな？とも思ったけど、、、まずは親がDIYの姿勢を見せるべく、家にあるもの(＋α)で、お手軽なロボット教材を作ってみることにしたよ。 I STEM!!

使うもの・作るもの

少し前に「はじめてのプログラミング」という本を息子に買ってあげたので、なんとなくScratchには興味を持っているようだ。また、過去に衝動的に２本も買ってしまったIoT乾電池「Mabeee」が机の引き出しに眠っているので、これも使うよ！

プログラミング教材 Scratch2.0(オフライン版）
IoT乾電池 Mabeee ２本

また、みんな大好き100円ショップで以下のものを揃えたよ！
* プチ電車　２台（モーター付きの駆動車）
* リモートシャッター

プチ電車は台車部分（モーター＆ギア＆タイヤ）が欲しいだけなので、裸にしたよ。（図右下）

これらを使って、「Scratchでプログラミング可能なロボットカー」を作るよ！

仕組み

ScratchにはHTTP拡張機能があり、これを使うとHTTPリクエストを投げるブロックが簡単につくれるんだ。また、MabeeeはMac向けにREST APIでMabeeeが操作できる「MaBeeeMacApp」を提供しているよ。これを連携させればScratchからMabeeeを制御することができそうだね。
さらに、「わずか300円でIoTボタンを作る方法」に書いた方法と組み合わせることでリモートシャッターとScratchも連携できそうだ。

これらの連携により、「リモートシャッターのボタンを押す→Scratchでかいたプログラムが実行→ScratchのプログラムでMabeeeを制御してロボットカーが動作」ということをするよ。

なお、Scratchから直接MabeeeMacAppにリクエストを投げるにはメッセージ形式などが違うので、ScrathとMabeeeMacAppの間にAPIサーバを立てるよ。APIサーバはMabeeeの初期処理（スキャン、接続）も担当するよ。

つくりかた

Scratchにオリジナルブロックを追加

Qiita記事「Python で軽量サーバを作って Scratch 2 のHTTP拡張を待ち受けてみる」を参考に、以下のファイル(mabeee.s2e)を作成するよ。

{
    "extensionName": "cheap IoT",
    "extensionPort": 12345,
    "blockSpecs": [
        [" ", "でんち %m.mabeeeId をうごかす", "start", 1], 
        [" ", "でんち %m.mabeeeId をとめる", "stop", 1], 
        [" ", "でんち %m.mabeeeId のはやさを %n にする", "setSpeed", 1, 50],
        ["b", "準備ができた", "ready"],
        ["b", "ボタンがおされた", "push"],
    ],  
    "menus": {
        "mabeeeId": [1, 2], 
    },  
}

extensionPortにはAPIサーバのポート番号を設定するよ。ScrachのHTTP拡張はAPIサーバの/pollに対して定期的にリクエストを投げてポーリングする仕様なんだ。下はコメント付きの抜粋だよ。詳細はこちらの解説PDFを参照だ。

[ " ",  // 種別：ScarachからAPIに対してリクエストを送信するブロック
  "でんち %m.mabeeeId のはやさを %n にする", //%mは"menus"からプルダウン選択、%nは数値入力
  "setSpeed", // APIのパス。この場合、localhost:12345/start/%m/%n　にリクエスト。
  1, 50 // %m、%nのデフォルト値
],
[ "b", // 種別：ポーリングのボディに含まれる値(boolean)を取得するブロック
  "準備ができた", 
  "ready"　// ポーリング時に取得する名前
],

作成したファイルをScrachに読み込むよ。左上のメニュー「ファイル」をShiftキーを押しながらクリックすると、裏メニュー？的に「じっけんてきなHTTPかくちょうをよみこむ」が表示されるから、ここから作成したファイルを読み込もう。すると、「そのた」ブロックとして定義したブロックが表示さるよ。

MaBeeeMacAppを準備

こちらのサイトからダウンロードしてね。解凍してダブルクリックするだけで実行できるよ。実行後はステータスバーに電池マークが表示されるよ。時々おちるから、ステータスバーを確認しよう。

ScratchからのリクエストをMabeeMacAppにわたすAPIサーバー

APIサーバでは主に３つのことを担当するよ。

ScratchからのAPIリクエストを変換してMabeeeMacAppに送信
初期処理（MabeeeMacAppとMabeeeとの接続など）を実施し、完了をScratchに通知
リモートシャッターのボタンが押されたことをScratchに通知

APIサーバでは、起動時にMabeeeデバイスのスキャン・接続を行うよ。接続が完了するとScratchからのポーリングに対して変数readyをtrueで応答するようにしているよ。これでScratchの「準備ができた」ブロックを監視してMabeeeとの接続処理が完了したか判定できるね。
また、リモートシャッターからAPIリクエストが来た場合は、ポーリングに対して変数pushをtrueで応答するよ。同様にScratchの「ボタンがおされた」ブロックを監視してリモートシャッターのボタンが押されたかどうか判定できるね。

ポーリングに対する応答は具体的には下記のようなコードになるよ(Node.js + Express)。

// Scratchによるポーリングへの応答
app.get('/poll', function (req, res) {
    // レポーターブロックへ値を返す
    res.send(`ready ${isReady}\npush ${isPush}`);
});

APIサーバー全体のソースコードはGistに上げておくよ。

リモートシャッターのボタン操作をScratchに通知する

わずか300円でIoTボタンを作る方法」で、リモートシャッターのボタンを押すとHTTPリクエストをなげる方法をかいたね。先ほどのAPIサーバにリクエストを投げて、APIサーバではポーリングに応答する値を変えるため、isPush変数をtrueにしているよ。

完成！Scratchでプログラムできるロボットカー！

うごかす車体は100円ショップで買って来たプチ電車を裸にして、適当に切ったダンボールにはめ込めば完成だ。左右の電車をバラバラに制御できるから、方向転換も自由自在だ。

あとは、Scratchでお試しプログラムを書いてみるよ。はじめてScratchを使ったけど、雰囲気でなんとなくかけちゃうよ。Scratchすごい！

実際に動かした様子！再起動とか不要でScratchに書いたプログラムがすぐにロボットカーに反映されるのでとっても楽しいです

Scratchでロボットカーpic.twitter.com/Pqq8bEwod7
— sagara (@vimyum) October 22, 2017

とってもお手軽なロボット教材を作るよ（Scratch + Mabeee)