【micro:bit】簡単!子供でも始められるmakecodeの使い方

micro:bitでプログラミング
この記事は約10分で読めます。

こんにちは、ナナです。

それでは、これから「micro:bit」を使つかったプログラミングを、一緒いっしょまなんでいきましょう!

最初さいしょにみんなにおぼえてほしいのは、micro:bitをうごかすための「makecodeメイクコード」と呼ばれるプログラミング環境かんきょう使つかかたです。

この記事きじでは、次のことを学習がくしゅうできます。

この記事で学習できること
  • makecodeの使い方
  • makecodeを使ったプログラムの作り方
  • makecodeで作ったプログラムをmicro:bitで動かす方法
  • makecodeの終わらせ方

では、「makecode」の使い方を学んでいきましょう。

スポンサー

micro:bitでプログラミングするための「makecode」を知ろう

師範しはん!「プログラミング」について、私はまだ右も左もわからぬ状態じょうたいです。

micro:bitを使ったプログラミングのはじめかたおしえてください。

ナナ
ナナ

そうだね。micro:bitを動かすために、まずみんなにおぼえてほしいのが「makecodeメイクコード」と呼ばれるプログラミング環境かんきょうの使い方だね。

じゃあ、説明せつめいするよ。

micro:bitでプログラミングを行うための「makecode」を使ってみましょう。

「makecode」のウェブサイトにアクセス

「makecode」は『Microsoft社 microbit makcode 開発サイト』にアクセスして使います。

次の画面がめんが表示されましたね。それでは「あたらしいプロジェクト」をクリックしてください。

makecodeのサイト
ナナ
ナナ

「プロジェクト」というのは、これからみんなが作るプログラムを、ひとつずつ管理かんりするためのはこのことだよ。

新しいプログラムを作りたければ、プロジェクトを作ればいいんだよ。

プロジェクトに名前を付けよう!

それでは、「あたらしいプロジェクト」に名前を付けてみましょう!

名前を付けることで、今後こんごたくさんのプロジェクトを作っても、名前を見ればどんなプログラムを作ったプロジェクトなのかがわかりますね。

プロジェクトに名前を付けよう

プロジェクトの名前は「はじめてのプログラム」にしてみましょう。

makecode画面の部品と使い方を知ろう!

プログラミングをするための、makecode画面がめん使つかかたおぼえましょう。プログラミングをするために必要ひつよう部品ぶひんは、次の3つです。

makecode画面の部品
ブロックエリアプログラミングの部品ぶひんとなるブロックを選択せんたくする場所ばしょ
プログラミングエリアブロックをわせてプログラミングをする場所
シミュレータ動作エリア作成さくせいしたプログラムの動作どうさ確認かくにんできる場所

ブロックエリアでプログラミングの部品ぶひんえらんで、プログラミングエリアでみんなの動かしたいプログラムを作っていきます。

ナナ
ナナ

みんなの作ったプログラムは「シミュレータ」とばれる画面左上のmicro:bitのイラスト上で、動作どうさ簡単かんたん確認かくにんできるんだよ。

この後、実際じっさい体験たいけんしてもらうよ!

スポンサー

makecodeでプログラムを作ってみよう!

師範しはん!この「makecode」を使えば、わたくしにもプログラミングができるのですか?

はじめて使う忍術にんじゅつにドキドキです。はやく、つづきをおしえてください。

ナナ
ナナ

じゃあ、さっそくうごかし方を学ぶための簡単かんたんな「プログラミング」をしてみようね。

それでは、簡単かんたんな「ブロック」を使ってプログラミングをしてみましょう。

「基本」ブロックを使って数字を表示してみよう

ブロックエリアから「基本きほん」をクリックしましょう。

表示ひょうじされた「基本」ブロックの中から、「数を表示」ブロックをクリックします。

基本ブロックの基礎

そうすると、プログラミングエリアに「数を表示」ブロックがあらわれます。

「数を表示」ブロックを「ずっと」ブロックにくっつけましょう!
マウスの左ボタンを押しながら「ずっと」ブロックの中にドラッグして動かします。

ブロック同士の結合

よく見ると「数を表示」ブロックと「ずっと」ブロックのはめかたちが同じですね。

このように、ブロックの形が同じであれば、ブロック同士どうし合体がったいすることができます。

これがブロックを使うための基本操作きほんそうさです。

ナナ
ナナ

マウスの左ボタンを押しながら動かすことを「ドラッグ」と呼び、動かした後にボタンをはなすことを「ドロップ」と呼びます。

2つを合わせて「ドラッグ&ドロップドラッグアンドドロップ」と呼ぶので覚えておこうね!

作ったプログラムの動きを確認しよう!

みんなが作ったプログラムが、自分の思った通りにうごいているかを確認かくにんしてみましょう。

プログラムをした結果けっかは、画面左上の「シミュレータ動作どうさエリア」に表示されます。

シミュレータ画面に結果表示

画面左上のmicro:bitに数字の「0」が赤く表示されていますね。

このように、みんなの作ったプログラムは、シミュレータ画面ですぐに動作を確認することができるのです。

ナナ
ナナ

プログラムが思った通りに動かない時は、プログラム内容ないよう見直みなおして思い通りに動くまで頑張がんばろうね。

スポンサー

makecodeで作ったプログラムをmicro:bitで動かしてみよう!

※ micro:bitをまだ持っていない子は、この部分ぶぶんばして後で読もう!

師範!わたしの作った「プログラム」は、このシミュレータとやらで動かすことができるのですね。これってわかりやすいですね!

でも、わたしは実際じっさい機器ききが動くところが見たいのです。だって、ワクワク・ドキドキかんがないじゃないですかっ!

ナナ
ナナ

そうだね。シミュレータで確認かくにんするのもいいけど、やっぱり目の前の機械きかいが動く方が楽しいよね!それがプログラミングの面白おもしろさや楽しさだよね。

じゃあ、実際のmicro:bitでプログラムを動かしてみよう!

みなさんが作ったプログラムは、シミュレータだけでなく実際のmicro:bit機器で動かすことができます。手順てじゅんしめすので動かしてみましょう。

プログラムをmicrobitで動かす方法を教えるよ!

みんなが作ったプログラムをmicro:bitで動かすためには、プログラムを転送てんそうする必要があります。

次の手順てじゅんで行いますよ!

  1. プログラムを変換して「HEXヘックスファイル」というファイルへ書きだす。
  2. micro:bitをパソコンと接続せつぞくする。
  3. 「HEXファイル」をmicro:bitに書き込む。
microbitへの書き込み手順

3つのステップで説明しましょう。

Step1.プログラムを変換して「HEXファイル」を作成する

HEXファイルを作るには、画面左下の「ダウンロード」ボタンをクリックするだけです。

ダウンロードをクリック

次の画面が表示されたら「×」ボタンで「ダウンロードをしましょう」画面をじましょう。

ダウンロード完了画面

「HEXファイル」はパソコンの「ダウンロード」フォルダに保存ほぞんされています。
ファイル名は「microbit-(プロジェクトの名前).hex」という名前になります。

ダウンロードされたファイル

Step2.micro:bitをパソコンと接続する

書き込む前に準備じゅんびするものがあるので、次のものを用意よういしましょう。

準備するもの
microbitを動かすための準備
ナナ
ナナ

micro:bitが入っていたはこの中に「USBユーエスビーケーブル」も一緒いっしょに入っているはずだから確認かくにんしよう。手元てもとならべようね!

まだ、機器ききを持っていない子は気にせずさきすすもう!

準備じゅんびができたら、micro:bitをパソコンに接続せつぞくしましょう。USBケーブルをmicro:bitとパソコンにつないでみましょう。

microbitの準備

はじめてmicro:bitをパソコンに接続せつぞくしたときは、パソコンがmicro:bitを認識にんしきするまで1分くらい時間が必要ひつようです。少しだけちましょう。

Step3.「HEXファイル」をmicro:bit機器に書き込む

最後にプログラム内容ないよう保存ほぞんされた「HEXファイル」をmicro:bitに書き込みます。

micro:bitをパソコンにつなぐと、ドライブと呼ばれる「E:」といった名前のフォルダとして認識されます。

※ みんなのパソコンでは「E:」とは別のアルファベットになっているかもしれませんよ。

このフォルダにHEXファイルを「ドラッグ&ドロップ」することで書き込みができます。

microbitへ書き込み

ファイルの書き込みが終わると、micro:bitに「0」が表示されましたね。

プログラムの転送結果
ナナ
ナナ

これがmicro:bitでのプログラム確認方法かくにんほうほうです。この先も動かしたければ、同じ手順で確認してみましょうね。

micro:bitの取り外し方を教えるよ!

「micro:bit」のはずし方もおぼえておこう。

microbitの外し方

パソコンにつながれた動いているmicro:bitを取り外すには、USBケーブルをパソコンからけばよいです。

スポンサー

「makecode」の終わらせ方を学んでおこう!

師範!今日はプログラミングの指導しどう、ありがとうございました。ゆっくり休んで、また明日からの修行しゅぎょうもお願いします。

では、この途中とちゅうまで作ったプログラムが書いてある「makecode」はどのようにすればよいでしょうか?

ナナ
ナナ

それじゃあ、学習がくしゅうえるための手順てじゅんおしえるよ。

勉強べんきょうわったときの、片付かたづけ方をおぼえておきましょう。

makecodeの終わり方

「makecode」には、みんなの作ってくれたプログラムが書かれていますね。このプログラム内容ないようは、つねにみんなが使っているパソコンに保存ほぞんされています。

そのため、ブラウザを閉じれば「makecode」を終わらせることができます。

makecodeの終わらせ方

また、ブラウザで「makecode」のサイトにアクセスすれば、保存ほぞんされたプログラムをつづけることもできます。

ナナ
ナナ

みんなが見ているこの画面は「ブラウザ」と呼ばれるアプリケーションなんです。「makecode」を終わらせたければ、ブラウザを「×」ボタンで閉じるだけなんですよ!

micro:bitの片付け

学習が終わったら「micro:bit」も片付かたづけましょう。

USBケーブルをパソコンとmicro:bitから外してください。

学習の終わらせ方

なくしたり、間違まちがえてんだりしないように、はこふくろもどしてちゃんと片付かたづけましょう。

スポンサー

質問コーナー:makecodeのことで気になること

ナナ
ナナ

このコーナーは、この記事きじの中で気になることがあったら、質問しつもんできる場所だよ!

質問:microbitをつかう時に注意することってどんなこと?

「micro:bit」って動いているときにさわってもよいものなんですか?ビリビリしたりしませんか?

ナナ
ナナ

触ってもいいけど、micro:bitは電気でんきで動いているからね。使う時にはいくつか注意ちゅういすることがあるよ。

大事だいじなmicro:bitがこわれちゃうから、かならず使い方をまもろうね!

「micro:bit」や「パソコン」は電気で動く、精密機械せいみつきかいと呼ばれるモノです。

精密機械せいみつきかいは「みず」や「金属きんぞく」が苦手にがてなので、注意して使ってあげてくださいね。

使う時の注意!
使う時の注意