こんにちは、ナナです。
それでは、これから「micro:bit」を使ったプログラミングを、一緒に学んでいきましょう!
最初にみんなに覚えてほしいのは、micro:bitを動かすための「makecode」と呼ばれるプログラミング環境の使い方です。
この記事では、次のことを学習できます。
では、「makecode」の使い方を学んでいきましょう。
micro:bitでプログラミングするための「makecode」を知ろう
![](https://monozukuri-c.com/wp-content/uploads/2019/07/88c0a382ed2194932102ef5a18874664.png)
師範!「プログラミング」について、私はまだ右も左もわからぬ状態です。
micro:bitを使ったプログラミングのはじめ方を教えてください。
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
そうだね。micro:bitを動かすために、まずみんなに覚えてほしいのが「makecode」と呼ばれるプログラミング環境の使い方だね。
じゃあ、説明するよ。
micro:bitでプログラミングを行うための「makecode」を使ってみましょう。
「makecode」のウェブサイトにアクセス
「makecode」は『Microsoft社 microbit makcode 開発サイト』にアクセスして使います。
次の画面が表示されましたね。それでは「新しいプロジェクト」をクリックしてください。
![makecodeのサイト](https://monozukuri-c.com/wp-content/uploads/2019/08/5251f7be668bc0adc1e111780f200337-1.png)
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
「プロジェクト」というのは、これからみんなが作るプログラムを、ひとつずつ管理するための箱のことだよ。
新しいプログラムを作りたければ、プロジェクトを作ればいいんだよ。
プロジェクトに名前を付けよう!
それでは、「新しいプロジェクト」に名前を付けてみましょう!
名前を付けることで、今後たくさんのプロジェクトを作っても、名前を見ればどんなプログラムを作ったプロジェクトなのかがわかりますね。
![プロジェクトに名前を付けよう](https://monozukuri-c.com/wp-content/uploads/2019/08/096d0c9d16a0ea5d99814a9c9fc9531c-1.png)
プロジェクトの名前は「はじめてのプログラム」にしてみましょう。
makecode画面の部品と使い方を知ろう!
プログラミングをするための、makecode画面の使い方を覚えましょう。プログラミングをするために必要な部品は、次の3つです。
![makecode画面の部品](https://monozukuri-c.com/wp-content/uploads/2019/08/b5aa0440d9c325031fc165109f142479-1.png)
ブロックエリア | プログラミングの部品となるブロックを選択する場所 |
プログラミングエリア | ブロックを組み合わせてプログラミングをする場所 |
シミュレータ動作エリア | 作成したプログラムの動作を確認できる場所 |
ブロックエリアでプログラミングの部品を選んで、プログラミングエリアでみんなの動かしたいプログラムを作っていきます。
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
みんなの作ったプログラムは「シミュレータ」と呼ばれる画面左上のmicro:bitのイラスト上で、動作を簡単に確認できるんだよ。
この後、実際に体験してもらうよ!
makecodeでプログラムを作ってみよう!
![](https://monozukuri-c.com/wp-content/uploads/2019/07/88c0a382ed2194932102ef5a18874664.png)
師範!この「makecode」を使えば、わたくしにもプログラミングができるのですか?
はじめて使う忍術にドキドキです。はやく、続きを教えてください。
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
じゃあ、さっそく動かし方を学ぶための簡単な「プログラミング」をしてみようね。
それでは、簡単な「ブロック」を使ってプログラミングをしてみましょう。
「基本」ブロックを使って数字を表示してみよう
ブロックエリアから「基本」をクリックしましょう。
表示された「基本」ブロックの中から、「数を表示」ブロックをクリックします。
![基本ブロックの基礎](https://monozukuri-c.com/wp-content/uploads/2019/08/574d66b8b7099aedd1cec655f615cced-1.png)
そうすると、プログラミングエリアに「数を表示」ブロックが現れます。
「数を表示」ブロックを「ずっと」ブロックにくっつけましょう!
マウスの左ボタンを押しながら「ずっと」ブロックの中にドラッグして動かします。
![ブロック同士の結合](https://monozukuri-c.com/wp-content/uploads/2019/08/126b6b583feb366d58fecef62b485f32-1.png)
よく見ると「数を表示」ブロックと「ずっと」ブロックのはめ込む形が同じですね。
このように、ブロックの形が同じであれば、ブロック同士を合体することができます。
これがブロックを使うための基本操作です。
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
マウスの左ボタンを押しながら動かすことを「ドラッグ」と呼び、動かした後にボタンを離すことを「ドロップ」と呼びます。
2つを合わせて「ドラッグ&ドロップ」と呼ぶので覚えておこうね!
作ったプログラムの動きを確認しよう!
みんなが作ったプログラムが、自分の思った通りに動いているかを確認してみましょう。
プログラムをした結果は、画面左上の「シミュレータ動作エリア」に表示されます。
![シミュレータ画面に結果表示](https://monozukuri-c.com/wp-content/uploads/2019/08/9babaf0c48c0ba559ee4dc74163dfda0-1.png)
画面左上のmicro:bitに数字の「0」が赤く表示されていますね。
このように、みんなの作ったプログラムは、シミュレータ画面ですぐに動作を確認することができるのです。
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
プログラムが思った通りに動かない時は、プログラム内容を見直して思い通りに動くまで頑張ろうね。
makecodeで作ったプログラムをmicro:bitで動かしてみよう!
※ micro:bitをまだ持っていない子は、この部分は読み飛ばして後で読もう!
![](https://monozukuri-c.com/wp-content/uploads/2019/07/88c0a382ed2194932102ef5a18874664.png)
師範!わたしの作った「プログラム」は、このシミュレータとやらで動かすことができるのですね。これってわかりやすいですね!
でも、わたしは実際の機器が動くところが見たいのです。だって、ワクワク・ドキドキ感がないじゃないですかっ!
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
そうだね。シミュレータで確認するのもいいけど、やっぱり目の前の機械が動く方が楽しいよね!それがプログラミングの面白さや楽しさだよね。
じゃあ、実際のmicro:bitでプログラムを動かしてみよう!
みなさんが作ったプログラムは、シミュレータだけでなく実際のmicro:bit機器で動かすことができます。手順を示すので動かしてみましょう。
プログラムをmicrobitで動かす方法を教えるよ!
みんなが作ったプログラムをmicro:bitで動かすためには、プログラムを転送する必要があります。
次の手順で行いますよ!
- プログラムを変換して「HEXファイル」というファイルへ書きだす。
- micro:bitをパソコンと接続する。
- 「HEXファイル」をmicro:bitに書き込む。
![microbitへの書き込み手順](https://monozukuri-c.com/wp-content/uploads/2019/08/24105c8565d3987a73c3a7f8428b38eb-1.png)
3つのステップで説明しましょう。
Step1.プログラムを変換して「HEXファイル」を作成する
HEXファイルを作るには、画面左下の「ダウンロード」ボタンをクリックするだけです。
![ダウンロードをクリック](https://monozukuri-c.com/wp-content/uploads/2019/08/cceeda3971408e56a91f268af1d54a1e-1.png)
次の画面が表示されたら「×」ボタンで「ダウンロードをしましょう」画面を閉じましょう。
![ダウンロード完了画面](https://monozukuri-c.com/wp-content/uploads/2019/08/e4bd4cfcee28da7434f4f55fef519c07-1.png)
「HEXファイル」はパソコンの「ダウンロード」フォルダに保存されています。
ファイル名は「microbit-(プロジェクトの名前).hex」という名前になります。
![ダウンロードされたファイル](https://monozukuri-c.com/wp-content/uploads/2019/08/eab54445a7edc0c098d7a0c88b9eac0b-1.png)
Step2.micro:bitをパソコンと接続する
書き込む前に準備するものがあるので、次のものを用意しましょう。
![microbitを動かすための準備](https://monozukuri-c.com/wp-content/uploads/2019/08/f74e305a0644cfb9daa04f3177244387-1.png)
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
micro:bitが入っていた箱の中に「USBケーブル」も一緒に入っているはずだから確認しよう。手元に並べようね!
まだ、機器を持っていない子は気にせず先に進もう!
準備ができたら、micro:bitをパソコンに接続しましょう。USBケーブルをmicro:bitとパソコンにつないでみましょう。
![microbitの準備](https://monozukuri-c.com/wp-content/uploads/2019/08/5c971b240dead9d34c0edcba76aa94b9.png)
初めてmicro:bitをパソコンに接続したときは、パソコンがmicro:bitを認識するまで1分くらい時間が必要です。少しだけ待ちましょう。
Step3.「HEXファイル」をmicro:bit機器に書き込む
最後にプログラム内容が保存された「HEXファイル」をmicro:bitに書き込みます。
micro:bitをパソコンにつなぐと、ドライブと呼ばれる「E:」といった名前のフォルダとして認識されます。
※ みんなのパソコンでは「E:」とは別のアルファベットになっているかもしれませんよ。
このフォルダにHEXファイルを「ドラッグ&ドロップ」することで書き込みができます。
![microbitへ書き込み](https://monozukuri-c.com/wp-content/uploads/2019/08/8ad57093fbf816f622be615d798d5203-1.png)
ファイルの書き込みが終わると、micro:bitに「0」が表示されましたね。
![プログラムの転送結果](https://monozukuri-c.com/wp-content/uploads/2019/08/09b87992de21b202e374b34e5ab93284.jpg)
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
これがmicro:bitでのプログラム確認方法です。この先も動かしたければ、同じ手順で確認してみましょうね。
micro:bitの取り外し方を教えるよ!
「micro:bit」の取り外し方も覚えておこう。
![microbitの外し方](https://monozukuri-c.com/wp-content/uploads/2019/08/f5e0dee656a33533fcbca556b6f45077.jpg)
パソコンにつながれた動いているmicro:bitを取り外すには、USBケーブルをパソコンから抜けばよいです。
「makecode」の終わらせ方を学んでおこう!
![](https://monozukuri-c.com/wp-content/uploads/2019/07/88c0a382ed2194932102ef5a18874664.png)
師範!今日はプログラミングの指導、ありがとうございました。ゆっくり休んで、また明日からの修行もお願いします。
では、この途中まで作ったプログラムが書いてある「makecode」はどのようにすればよいでしょうか?
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
それじゃあ、学習を終えるための手順を教えるよ。
勉強が終わったときの、片付け方を覚えておきましょう。
makecodeの終わり方
「makecode」には、みんなの作ってくれたプログラムが書かれていますね。このプログラム内容は、常にみんなが使っているパソコンに保存されています。
そのため、ブラウザを閉じれば「makecode」を終わらせることができます。
![makecodeの終わらせ方](https://monozukuri-c.com/wp-content/uploads/2019/08/6a72f5a831b58829258bcd586446acaf-1.png)
また、ブラウザで「makecode」のサイトにアクセスすれば、保存されたプログラムを続けることもできます。
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
みんなが見ているこの画面は「ブラウザ」と呼ばれるアプリケーションなんです。「makecode」を終わらせたければ、ブラウザを「×」ボタンで閉じるだけなんですよ!
micro:bitの片付け
学習が終わったら「micro:bit」も片付けましょう。
USBケーブルをパソコンとmicro:bitから外してください。
![学習の終わらせ方](https://monozukuri-c.com/wp-content/uploads/2019/08/8c65f4156f5a83986cdf62dedbb06e2a.jpg)
なくしたり、間違えて踏んだりしないように、箱や袋に戻してちゃんと片付けましょう。
質問コーナー:makecodeのことで気になること
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
このコーナーは、この記事の中で気になることがあったら、質問できる場所だよ!
質問:microbitをつかう時に注意することってどんなこと?
![](https://monozukuri-c.com/wp-content/uploads/2019/07/88c0a382ed2194932102ef5a18874664.png)
「micro:bit」って動いているときに触ってもよいものなんですか?ビリビリしたりしませんか?
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/274ac86909c1a78190c701cdec501e0d-1.png)
触ってもいいけど、micro:bitは電気で動いているからね。使う時にはいくつか注意することがあるよ。
大事なmicro:bitが壊れちゃうから、必ず使い方を守ろうね!
「micro:bit」や「パソコン」は電気で動く、精密機械と呼ばれるモノです。
精密機械は「水」や「金属」が苦手なので、注意して使ってあげてくださいね。
![使う時の注意](https://monozukuri-c.com/wp-content/uploads/2019/08/80e43229f4bc583bccd6e1bdb6897170-1.png)
![ナナ](https://monozukuri-c.com/wp-content/uploads/2019/06/bfc1cf65d1130f875793b49176917183-1.png)
micro:bitのプログラムを最初から学びたい子は、ここから始めよう!