micro:bit v2.0に新たに搭載されたスピーカーを活用した、連打して友だちと競えるゲームを作ります。筆者が用意した無償のプログラムデータも公開中です。

チャレンジ&ナレッジ最終更新日: 20201221

micro:bit v2.0の新機能で対戦型連打ゲームを制作

  • このエントリーをはてなブックマークに追加

「micro:bit(マイクロビット)」は、イギリスのBBC(英国放送協会)が中心となって情報教育向けに開発された小型のコンピューターです。日本では、2020年度からのプログラミング教育の開始とともに、初心者に扱いやすい小型コンピューターとしてmicro:bitへの注目度が高まっています。micro:bitは2020年11月に新バージョン「2.0(micro:bit v2.0)」がリリース! 今回は新機能も搭載した、連打して友だちと競えるゲームを作ります。筆者(田中正吾)が用意した無償のプログラムデータも公開中です。

micro:bit v2.0の変更点

micro:bitの新バージョン「2.0」(以下、micro:bit v2.0)は、前のバージョンとサイズは同じですが、マイク(マイク入力を示すLEDも追加されています)とスピーカーが搭載されていたり、表面のロゴマークにタッチ検出機能が加わったほか、電源供給状態で電源のON/OFFを切り替えられる機能も追加されています。

その他にも、金メッキ加工でアンテナが目視しやすくなったり、エッジコネクターに凹みが追加されワニ口クリップがはさみやすくなったり、外部モジュールからの供給可能電流が90mA→200mAと大きく増加するなど、価格は据え置きながら、使いやすさと活用の幅が拡がるバージョンアップとなっています。

micro:bitで連打ゲームを作る

「連打ゲーム」の完成イメージを確認する

今回は友だちとの対戦が可能な連打ゲームを作ってみましょう。最初に完成イメージをご覧ください。

例えば、友だちがAボタンを、自分がBボタンを連打します。早くきちんと押しきった方が、LEDエリアの端に縦のライン表示が到達し「勝者」となる、というゲームです。それぞれのボタンが押されると、LEDの表示が左右のどちらかに進むので、先に端まで表示が進みきるまで、互いにボタンを押し続けてください。micro:bit v2.0に新たに搭載されたスピーカーを活用した、音の演出も加えたゲームとなっています。

micro:bitのメリットは、Microsoft提供の「MakeCodeエディター」を使って、ブロックを用いた初歩的なプログラミングが組めることです。難しい言語を使わず、動きを指定できるブロックを並べて実装できるので、プログラミングに詳しくない人でも馴染みやすく、親子で一緒に作るのにも向いています。

「連打ゲーム」のための材料を用意する

最初に、連打ゲーム作りに必要な材料を用意しましょう。

1 USBケーブル
2 モバイルバッテリー
3 micro:bit v2.0

これら3点と、作業用の任意のパソコンを用意してください。

1(USBケーブル)の長さは、短いものが使いやすいでしょう。

2(モバイルバッテリー)は、micro:bitがあまり電力を使わないため、モバイルバッテリーによっては「省電力OFF機能」が働いてしまうことがあります。省電力OFF機能がなく、スイッチのON/OFFで電源が管理できるモバイルバッテリーを選ぶといいでしょう。

3(micro:bit v2.0)の入手先は、いろいろとあります。初めての人でも特に迷うことなく入手できるでしょう。2020年12月時点で最新バージョンは「2.0」です。

音の演出は最新バージョンに搭載されているので、ぜひmicro:bit v2.0を入手してください。

micro:bitをPCにつなぐ

PC作業は、Windows 10をベースに進めます。まず、microUSBケーブルでmicro:bitとPCのUSBポートをつなぎます。

※他のOSで進めたい場合は、以下を参考にしてつないでみてください。

“Set up | micro:bit”.micro:bit.
https://microbit.org/get-started/first-steps/set-up/

つないだmicro:bitは、コンピューター上では「MICROBIT」という名前のドライブとして表示されます。

micro:bitのプログラムを作る

micro:bitは、ブラウザだけで簡単にプログラムを作ることができます。micro:bitのWebサイトには、ブラウザ上で操作できるエディター「MakeCodeエディター」が用意されています。

micro:bitのWebサイトにアクセスしてみましょう。

“Microsoft MakeCode for micro:bit”.micro:bit.
https://makecode.microbit.org/

すると、プロジェクトページが表示されます。ここで新しいプロジェクトを作って、 micro:bitを動かすプログラムファイルを作ることができます。

プログラムファイルをシェアする

今回は、すでに筆者が作ったプログラムを用意してあります。いきなりゼロからプログラム作りをせず、初めての人や慣れていない人は、まずは完成したプログラムを見ながら、仕組み作りの考え方をつかんでください。

では筆者が作ったプログラムを取り込んで、動かしてみます。今回用のサンプルページにアクセスします。

“micro:bit ver2 押せ押せゲーム”.Microsoft MakeCode.2020.
https://makecode.microbit.org/16251-36168-48652-64782

アクセスすると、筆者が実装したプログラムが表示されます。表示されているブロックの数々は、編集画面で出てくる「ツールボックス」に用意された、各種の動きを指定したブロックを適宜選び、配置しています。

(左の)Aボタン、(右の)Bボタンをそれぞれ押して、LEDの表示がどちらかに進んでいくことについて指定したプログラムの箇所が以下です(プログラムエリアの左側に配置されたブロック群)。

最初の場面は、ツールボックスの「基本」カテゴリから「最初だけ」ブロックを選んで実装しています。「最初だけ」ブロックの中に、さらに複数のブロックを組み込んで動作を指定しています。ここではオープニングのサウンドを再生するために、ツールボックスの「音楽」カテゴリにある「play sound」ブロックを配置。同じく「変数」カテゴリから「変数」ブロックを配置し、変数には「line」を指定。ゲームのスタートでは、値を「0」(真ん中)で準備する、という処理を行っています。

その下は、ツールボックスの「入力」カテゴリより「ボタンAが押されたとき」ブロックを選び、Aが押された時は1増えて右にLEDの表示が移動して、同様に「ボタンBが押されたとき」ブロックを置いて、Bが押された時は(-1増えるということは)1減って左にLED表示が移動する動きを指定しています。

右側のブロックの一群も見てみましょう。

ツールボックスの「基本」カテゴリより、「ずっと」ブロックを選んだら、先ほどのlineの値によってLEDの表示を作っていきます。例えば、「0」(スタート/ボタンを押し合う前の状態)は真ん中に縦のラインが表示された状態です。先ほど指定したとおり、Aが押されたらline=1となるので、ここでは1回(Aボタンが)押されると右側に表示が移る、という指定のブロックを配置しています。

その他、表示が端に進んだ場合にサウンドを再生したり、LEDで文字を出す演出やスタートに戻る処理をしています。

この時点で、初めての人には言葉の説明中心でピンと来づらいかもしれません。そこで、プログラムをご自身の環境に読み込んでみましょう。「micro:bit ver2 押せ押せゲーム」と書かれたタイトルの右にある、グレーの「Edit Code」ボタンを押してください。

自分のMakeCodeエディターにプログラム「micro:bit ver2 押せ押せゲーム」が読み込まれます。以下が編集画面で、筆者作成のプログラムを編集できる状態です。

筆者が用意したプログラム以外にも、micro:bitでは、世界中のさまざまな人たちが作ったプログラムを手軽にシェアして使えます。

プログラムを読み込まない場合は、自分でブロックを使ってプログラムを作ることになります。一通り理解したら、ぜひ独力でプログラム作りに挑戦してみてください。

プログラムファイルをダウンロードする

筆者が用意したプログラム「micro:bit ver2 押せ押せゲーム」はこのまま使えるので、プログラムをダウンロードして、実際に連打ゲームを試してみましょう。MakeCodeエディターの左ペイン下にある紫の「ダウンロード」ボタンを押します。

MICROBITのドライブに保存したら、micro:bitにプログラムを反映させます。

micro:bitの動作確認をする

micro:bitをモバイルバッテリーにつないで、実際に「連打ゲーム」を試してみます。下の画像のようにつなぎ、起動しましょう。

つないだら、電源を入れて起動します。真ん中にラインが出てきたら、まずは片側だけ、Aボタンに指を置いて試します。

Aボタンを1回押すと、真ん中のラインが右へと移動します。

もう1回押すと、さらに右へと移動します。

さらにもう一度押すと、ラインが端へと押し切ったことになります。このゲームの勝利となり、勝利後の演出が表示されます。

ここまでで動作確認は完了です。このまま遊べますので、例えば友だちがAボタン、自分がBボタンを連打して、ゲームを体験してみてください!

ブロックエディターでプログラムを調整する

プログラムの内容をカスタマイズする

ここからはブロックの組み方を学ぶために、少しブロックの中身をカスタマイズしましょう。新バージョン「2.0」から音の演出が可能となりました。そこで、ツールボックスの「音楽」カテゴリのブロックについてカスタマイズしてみます。

再び、自分のMakeCodeエディターにプログラム「micro:bit ver2 押せ押せゲーム」を読み込んだ状態に戻ってください。

現状は、どちらかが勝った時の音が「twinkle」というサウンドを設定しています。

例えば、この部分を「twinkle」から残念な印象を与えるサウンド演出へと変えて、負けた時の雰囲気を作ることにします。音を鳴らすために指定した赤いブロックは、ツールボックスの「音楽」カテゴリにある「play sound」ブロックを使っています。ここでは、すでに配置されている状態です。

「twinkle」をクリックすると、他にもいろいろな設定が選べます。

今回は「sad」を選んでみます。

ここでは、ツールボックスの「論理」カテゴリより「もし<真>なら/でなければもし<真>なら」ブロックを選んで、条件設定をしています。<真>には変数が入ります。この場合、「line」が「2」よりも大きい(「>」)なら(Aボタンを2回以上押した時)、「sad」の音楽が流れる(「play sound」ブロック)となります。

Bボタンの演出も変えられます。Bボタンは1回押すごとに「-1」となる設定を組んでいます。ここでは、同じくツールボックスの「論理」カテゴリより「もし<真>なら/でなければもし<真>なら」ブロックを選んで、さらに条件設定として「line」が「-2」よりも小さい(「<」)なら(Bボタンを2回以上押した時)、「sad」の音楽が流れます。

プログラムを書き換えて、サウンドが変わったことを確かめてみましょう。

「sad」以外にも他の指定を選んだり、ボタンの押す回数を変えるなどしてみてください。どのブロックを変えると、実際にどのように動きが変わるかを確認しながら、ブロックによる動きや配置のコツを少しずつつかんでいきましょう。

ライタープロフィール 田中正吾

屋号:ワンフットシーバス

2004年よりフリーランス。最近ではWebフロントエンドをベースに、情報とインターフェイスが合わさる視点で、IoTやVRといった技術も取り入れ活動中。

記事を
シェア