当サイトは2020年小学生のプログラミング必修化に向けて、関連する情報を纏めています。サイトリニューアルしました。

Scratch(スクラッチ)3とMicro:bit(マイクロビット)をつないでみる

Scratch(スクラッチ)3とMicro:bit(マイクロビット)をつないでみる

ベータ版ではありますがScratch3にMicro:bit用の拡張機能が追加されていますのでWindows10 での手順を紹介します。Micro:bitからスクラッチのキャラクターを動かしたり、スクラッチからマイクロビットにメッセージを表示したりできます。ただし、ブラウザーはGoogle Chromeが必要です。

 

2019/1/2更新:正式版Scratch3.0がリリースされました。Micro:bitとのブルートゥース接続方法が変わりました。この記事の手順ではなく、今後はこちらの記事を参照してください。

 

1.Windows10 Google Chromeの準備

 

1.Windows10 Google Chromeの準備

この手順では、Google Chrome に ブルートゥース 用の拡張機能である『Windows 10 Web Bluetooth Polyfill』を導入します。手順の原文はこちらの記事になります。(注:私はMacを持っていませんので確認できませんが、Macでは簡単にMicro:bitと接続できるようです)

A.Windows10 の前提バージョンを確認する

A-1.Windows10 が version 1703 / build 15063 以上である事を確認します。左下のウインドウアイコンを右クリックします。
scratch_microbit4

A-2.以下のようなメニューが表示されますので、『ファイル名を指定して実行』をクリックします。
scratch_microbit5

A-3.以下のようなウインドウが開きますので、『cmd』と入力してOKをクリックします。
scratch_microbit6

A-4.以下のようなウインドウが開きますので、『winver』と入力してエンターキーを押します。
scratch_microbit7

A-5.以下のように、ウインドウのバージョンが表示されます。この例はversion 1803 / build 17134 ですので、version 1703 / build 15063に比較して数字が大きいので次のステップにいけます。そうでない場合は、動きませんのでウインドウのアップデートを先にしてください。(マイクロソフトからの自動アップデートを毎月やっていれば1703以上になっていると思います)
scratch_microbit8

B.Visual C++の再配布可能パッケージを導入

今回の拡張機能はこのパッケージが必要です。私はVisual Studio 2017を導入済みでしたので、『Visual Studio 2015 の Visual C++ 再頒布可能パッケージ』を導入しなくても問題ありませんでしたが、一般的には導入が必要です。他のソフトを導入したときに同時に導入されているかもしれませんので、不明な場合は導入してみてください。既に導入済みであれば、そのメッセージが表示されますので、そこでキャンセルすれば良いです。

B-1.Visual Studio 2015 の Visual C++ 再頒布可能パッケージはここにあります。以下のようなメニューが表示されますので、ダウンロードをクリックします。
scratch_microbit9

B-2.以下の画面が表示されますので、vc_redist.x86.exeに☑をして『次に』をクリックします。
scratch_microbit10

B-3.ダウンロードが完了すると以下のような画面になります。ダウンロードした『vc_redist.x86.exe』を実行してください。
scratch_microbit11

B-4.以下のようなライセンス同意メッセージが表示されますので、同意するに☑して『インストール』をクリックします。この先は表示されるメッセージに従い導入してください。導入済みのメッセージが表示されたらキャンセルしてください。(申し訳ありませんが、私の環境では既に2017版が導入されているので導入できないため実際の画面をお見せすることができません)
scratch_microbit12

C.Windows 10 Web Bluetooth Polyfill の入手と設定

C-1.このサイト(Github)開いてください。以下のような画面が表示されますので、右側にある『Clone or   download』をクリックして開いたメニューから『Download ZIP』をクリックします。
scratch_microbit13

C-2.ファイル名『web-bluetooth-polyfill-master.zip』がダウンロードフォルダーにありますので、右クリックして適当なフォルダーに解凍してください。
scratch_microbit14

C-3.解凍先に指定したフォルダーに『web-bluetooth-polyfill-master』というフォルダーが出来上がっていますので、このフォルダーを選択して右クリックで『名前を変更』を選択し、名前を『Web Bluetooth Polyfill』にして下さい。大文字小文字スペースも含めて同じにしてください。この名前が間違っていると動きません。

C-4.名前を変更したフォルダーをドラッグして、C:\Program Files (x86)にドロップして移動します。C:\Program Files という似た名前がありますので、間違えないようにしてください。注:この作業中に管理者権限が必要ですとメッセージが表示された場合は、一旦続行をクリックします。それでもダメな場合は管理者(ご家庭の場合は、保護者の方)に作業をお願いしてください。
scratch_microbit15

C-4.Google Chromeを立ち上げて、右上のメニューをクリックして『その他のツール』→『拡張機能』を選択します。
scratch_microbit17

C-5.拡張機能のメニューが表示されますので、右上の『デベロッパーモード』をONにします。
scratch_microbit18

C-6.新しいメニューが追加されますので、『パッケージ化されていない拡張機能を読み込む』をクリックします。
scratch_microbit19

C-7.『拡張機能のディレクトリー(フォルダーのこと)を選択してください』メッセージが表示されますので、先ほど移動した『C:\Program Files (x86)\Web Bluetooth Polyfill』の中にある『extension』フォルダーを選択して、OKをクリックします。
scratch_microbit20

C-8.以下のように拡張機能が追加されますので、『詳細』をクリックします。
scratch_microbit21

C-9.今追加した拡張機能の詳細が表示されますので、その中にあるIDが後で必要になります。後のDの手順で必要になった時この画面を開いてIDをコピーしてください。
scratch_microbit22a

2.BLESrever の入手と設定

 

2.BLESrever の入手と設定

2-1.BLEServerのサイトを開くと、以下の画面になりますので、『BLEServer-0.4.0.1-b867fe1.zip』をクリックしてダウンロードします。注:随時修正されているようですので、ファイル名は異なっている場合があります)
scratch_microbit23
2-2.ダウンロードフォルダーに『BLEServer-0.4.0.1-b867fe1.zip』がありますので、右クリックして適当なフォルダーに解凍します。

2-3.解凍先に指定したフォルダーに『BLEServer-0.4.0.1-b867fe1』フォルダーがありますので、開きます。(解凍が終わると、自動的に開きますが、開かなかった場合)以下の4つのファイルがありますので、その中の『manifest.json』をいつも使っているエディターソフトで開きます。
scratch_microbit24

2-3.エディターで開くと7行目の『chrome-extension://joeddpfhohdknijmlmomdhealbjfbgem/』赤字部分を、先ほどのC-9手順で調べたIDでこの部分に書き換えて保存します。
scratch_microbit25

2-4.『BLEServer-0.4.0.1-b867fe1』フォルダー内の4つのファイルを選択しドラッグして、前のステップで作った『C:\Program Files (x86)\Web Bluetooth Polyfill』に移動(もしくはコピー)します。作業中に次のメッセージが表示される場合があります。
scratch_microbit26

2-5.前のステップで以下のメッセージが表示された場合は、続行をクリックします。それでダメな場合は、管理者(ご家庭なら保護者の方)に作業を依頼してください。
scratch_microbit27

2-6.『C:\Program Files (x86)\Web Bluetooth Polyfill』フォルダー内にある、『register.cmd』をダブルクリックして実行してください。一瞬、黒い画面が表示されすぐ閉じてしまいます。これで、Googl Chromo側の作業は完了です。確認のため、一度Googl Chromeを閉じて終わって下さい。
scratch_microbit28

2-7.再度、Googl Chromeを立ち上げて、右上のメニューをクリックして『その他のツール』→『拡張機能』を選択します。
scratch_microbit17

2-8.今回追加した拡張機能の『バックグラウンドページ』をクリックします。
scratch_microbit29

2-9.下のような画面が表示されますので、『Connected to server』と表示されていればOKです。そうでない場合は今までの手順を見直してください。
scratch_microbit30

3.Micro:bitの準備

 

3.Micro:bitの準備

ここでは、マイクロビット用のソフトを入手して、マイクロビットにロードします。

3-1.こちらのサイトを開くと、以下の画面が表示されますので、scratch-firmware-combined.hex をクリックしてダウンロードします。ダウンロードしたら、scratch-firmware-combined.hex をUSBでパソコンにつないであるマイクロビットにロードしてください。
scratch_microbit31

3-2.Micro:bitへのプログラムロードが完了すると、Micro:bitのLEDが以下のように点滅します。これでMicro:bitの準備完了です。
microbit_ble

4.Scratch3からMicro:bitを使う

 

4.Scratch3からMicro:bitを使う

4-1.https://llk.github.io/scratch-gui/microbitを開いてください。以下の画面が表示されますので、『Try  It!』をクリックします。
scratch_microbit32

4-2.以下のようにベータ版のScratch3が開きますので、右上にあるブルートゥースのアイコンをクリックします。
scratch_microbit33

4-3.以下のようなウインドウが開き、ブルートゥースで接続可能なMicro:bitが表示されますので、選択して『Pair』をクリックします。注:Micro:bit(xxxxx)のx部分はMicro:bitごとに違います。
scratch_microbit34

4-4.Micro:bitのLEDが以下のように点滅し、最終的に全LEDが消灯します。これでペアリングは完了です。
microbit_ble1

5.Scratch3から実際にMicro:bitをコントロールする

 

5.Scratch3から実際にMicro:bitをコントロールする

5-1.Scratch3でMicro:bitのブロックを追加します。左下の『Add Extention』のアイコンをクリックします。
scratch_microbit35

5-2.以下のような画面が表示されますので、Micro:bitをクリックします。
scratch_microbit36

5-3.Micro:bitのブロックが追加されました。
scratch_microbit37

5-4.簡単な例ですが、Micro:bitにメッセージを表示するプログラムを作ります。Micro:bitのAボタンを押したら、HelloとLEDに表示するプログラムです。
scratch_microbit38

5-5.以下のようAボタンを押したら、Helloと表示されます。
microbit_ble2

以上で、手順は完了です。色々試してみて下さい。Scratch3とMicro:bitでどんな事ができるのか、改めて別の機会に紹介させていただきます。2018/8には正式なベータ版が出るようですので、その時には日本語もサポートされていればいいですね。

なお、私の環境では問題なく動きましたが、この手順通りでうまくいかない事があれば、当方に連絡ください。可能な限りサポートさせていただきます。

注:Windows10 をリブート後、Google Chromeを立ち上げると以下のメッセージが表示されますので、引き続きMicro:bitを使いたい場合は右上のXをクリックします。
scratch_microbit40

『無効にする』を選択した場合は、再度Micro:bitを接続する時は、C-4の手順で拡張機能のメニューを表示して、『Web Bluetooth Polyfill』の右下のアイコンをクリックして拡張機能を有効にしてください。
scratch_microbit42

 


最後まで記事をお読みいただきありがとうございます。
記事の改善に役立てたいと思いますので、よろしければアンケートにご協力ください。

記事内容についてお伺い


良く解る解る解りにくい部分がある解りにくい 


 

クロームブラウザーをご使用の方へ

当サイトへの訪問ありがとうございます。その際、グーグルクロームブラウザーをお使いの方にお知らせです。グーグルクロームブラウザーでは、2018年7月から、サイトにより以下の表示がブラウザーのアドレスバーに表示されます。当サイトでも表示されますが、心配ありませんのでご安心ください。
SSL案内1
これは、SSLと呼ばれるWebサイトとそのサイトを閲覧しているユーザとのやり取り(通信)を暗号化するための仕組みを使用していないためです。ネットショッピング、銀行サイトではパスワードやクレジットカードの情報を扱いますので、必須の仕組みです。当サイトでは、そのような情報を扱っておりませんので、暗号化は必須ではありませんが、訪問される方により安心していただけるように、SSL化を予定しております。このメッセージはSSL化完了まで念のため表示します。

スクラッチカテゴリの最新記事