Halocodeプログラミング入門 Go.Ota CoderDojo市川真間 (Ver /8/14)

Presentation on theme: "Halocodeプログラミング入門 Go.Ota CoderDojo市川真間 (Ver /8/14)"— Presentation transcript:

1 Halocodeプログラミング入門 Go.Ota CoderDojo市川真間 (Ver. 0.9 2019/8/14)
Halocodeプログラミング入門 (Ver /8/14) 　Halocodeというマイコンボードを使って、コンピュータのハードウェアを操作するプログラムを作ります。またHalocodeをWiFiでネットワークにつないで、PCを操作したり、インターネットのいろいろな機能を使ってAIにも挑戦してみましょう。 説明は、程度Scratchを使ったことがあり、ブロックを組み合わせてプログラミングを作ることができること子供がりようすることを想定しています。 内容: 1. Halocodeって何? 2. Halocodeのプログラミングの基礎 3. Halocodeだけの、いろいろなプログラミング 4. HalocodeとPCをUSBケーブルでつないでみよう。 5. Halocode同志をネットワークでつないでみよう。 6. HalocodeをWifiでPCにつないでみよう。 7. Halocodeをネット機能につないでみよう。 補足資料: mBlockのアカウントの作り方 補足資料: mBlock Webデバイスドライバのインストール 補足資料:　ローカル用コーディングツールのインストール 2017年8月13日/20日 (同一内容) 13:00～16:30 CoderDojo市川真間用資料 Go.Ota CoderDojo市川真間 1ページ

2 Halocodeは非常にシンプルなコンピュータです。
ちっちゃいながらも、単独で動くコンピュータです。特にWiFiに接続できるので、最先端のIoTデバイス(次のスライド)としても使用することができます。 ・単独で加速度センターやマイクがついているので、これらをセンサーとして状態を読み取り、LEDを光らせたりできます。 ・Wifiで接続することで、PC上で作ったゲームのコントローラーとしても使えます。 ・インターネットにつないで、音声認識などの機能も使えます。 〇とりあえず初めに入っているプログラムでそこそこ遊べます。英語で指示がでるので、そこの説明は必要。 〇Halocode純正の電池ケースにはon/offスイッチが無いので、スイッチのある単三用のケースにコネクター半田付けして使っています。 〇子供達にとって、電源入れると動きっぱなしになるというのは、プログラム的に新鮮な感覚みたいです。 ワンポイント: Halocodeは一度に一つのプログラムだけ Halocodeは中に一度に一つのプログラムしか入れることができません。 2ページ

3 IoTって何? パソコン・携帯 家庭のいろいろな道具や機械
ネットワーク 家庭のいろいろな道具や機械 IoTはInternet of Thingsの略で、現在の日本語では「モノのインターネット」と訳されています。これはパソコンやスマホだけでなく、世の中ありとあらゆるものをネットワークに接続して活用するという考え方です。 社会のいろいろな機械や装置 3ページ

4 Halocodeのハードウェア 表面 裏面 4ページ 0, 1, 2, 3の4個あります。 本教材ではタッチ0, 1, 2, 3と表示
〇特に電源LEDと転送中LEDが重要で、ちゃんと転送処理が行われているかは、このLEDが点滅するか確認してもらう必要があります。 〇温度センサーが付いてるはずですが、場所がわからず。 裏面 4ページ

5 https://ide.mblock.cc と入力する。
2. Halocodeのプログラミングの基礎 　◎HalocodeのコーディングツールのWebを開こう。 　Chrome(推奨)のブラウザの一番上で と入力する。 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 ほそく:メニューやブックが英語だったりしたら、まず日本語に設定しましょう。 　コーディングツールの画面 (Scratchとほぼ同じです) ワンポイント: PCにインストールして使う場合は、 「補足資料:　ローカル用開発ツールのインストール」を見てください。 5ページ

6 〇WebのコーディングツールとHalcodeを接続するためのデバイスドライバを起動します。 〇Halocodデバイスとして追加します。
◎Halocodeの開発の準備(1) 〇WebのコーディングツールとHalcodeを接続するためのデバイスドライバを起動します。 〇Halocodデバイスとして追加します。 ディスクトップから ・Codeyは必要ないので削除しましょう。 〇シミュレータが良く出来ています。 ・温度センサーの場合は、温度計の絵がでてきて、温度を設定できます。 ・傾きの場合は、ボードの絵を傾かせることができます。 など。 〇基本的にScratch使える子供ならすぐ使えますが。 ・Scratchの「ハタがクリックされた時」がなく、基本的に電源投入時の「最初だけ」と「ずっと」で組んでいくのが少し感覚が違うみたい ・あと、ハードのイベントドリブンであることも説明が必要「ボタンxが押された時」「ゆさぶられた時(加速度センサー系)」このトリガーで始まるブロックが入力にはいっているのも見つけにくい。 ・if文が「論理」に入っているが「論理」が別の表示になって探すのに苦労したこともあった(どうして別の表示になったかは不明) 〇文字で日本で入れようとするが、LEDにはアルファベットしか表示されないことの意識が必要 〇Scratchの場合、パラメータにあたる部分は空白だが、Halocodeの場合はあらかじめ既定のブロックが入っていて違和感があるみたい。その既定のブロックを外すことはできないので、新しいブロックを上書きする感じになる。 〇真偽がプログラム中にでてくるが、ピンとこないみたい。 メニューから デバイスドライバが入っていない場合は補足資料見てください。 ・Halocodeをクリックして追加 6ページ

7 ◎Halocodeの開発の準備(2) 〇Halcodeを接続します。 7ページ 〇シミュレータが良く出来ています。
・温度センサーの場合は、温度計の絵がでてきて、温度を設定できます。 ・傾きの場合は、ボードの絵を傾かせることができます。 など。 〇基本的にScratch使える子供ならすぐ使えますが。 ・Scratchの「ハタがクリックされた時」がなく、基本的に電源投入時の「最初だけ」と「ずっと」で組んでいくのが少し感覚が違うみたい ・あと、ハードのイベントドリブンであることも説明が必要「ボタンxが押された時」「ゆさぶられた時(加速度センサー系)」このトリガーで始まるブロックが入力にはいっているのも見つけにくい。 ・if文が「論理」に入っているが「論理」が別の表示になって探すのに苦労したこともあった(どうして別の表示になったかは不明) 〇文字で日本で入れようとするが、LEDにはアルファベットしか表示されないことの意識が必要 〇Scratchの場合、パラメータにあたる部分は空白だが、Halocodeの場合はあらかじめ既定のブロックが入っていて違和感があるみたい。その既定のブロックを外すことはできないので、新しいブロックを上書きする感じになる。 〇真偽がプログラム中にでてくるが、ピンとこないみたい。 7ページ

8 ①プログラミング ②プログラㇺの転送 ◎Halocodeの初めてのプログラム LEDできれいに光らせてみよう。
〇Scratchやっている人ほど、ゲームなど複雑なプログラムをすぐ作りたがるが、(ドットを動かそうとして苦労するなど)micor:bitなどのフィジカルコンピューティングは、それらしいことを初めにやった方が興味がわくと思う。例えば ・振ると温度を表示する。 ・傾き方によって表示する絵柄が変わるなど 〇ロボットまでもっていくには、Scratchみたいに自由にやらせると収拾つかなくなるかも、ある程度フィジカルコンピュティングらしいもので興味を持たせながら共通的な操作をさせた方がいいかもしれない。 〇あと、Halocode自体が持つ無線機能を使って2台、複数台で動かすプログラム非常に興味を持つかと思われる。 〇特にDojoでやっている子供は自由にやることに慣れているが、フィジカルコンピューティングする場合は、ある程度基礎手的な知識を学習する説明や資料が必要だと考える。 アップロードモードをオンにして、 アップロードをクリックすれば、プログラムがPCからHalocodeにされます。 Halocodeのボタンを押すとLEDが光り出すよ。 8ページ

9 ①プログラミング ②プログラㇺの転送 ◎Halocodeの初めてのプログラム LEDできれいに光らせてみよう。
〇Scratchやっている人ほど、ゲームなど複雑なプログラムをすぐ作りたがるが、(ドットを動かそうとして苦労するなど)micor:bitなどのフィジカルコンピューティングは、それらしいことを初めにやった方が興味がわくと思う。例えば ・振ると温度を表示する。 ・傾き方によって表示する絵柄が変わるなど 〇ロボットまでもっていくには、Scratchみたいに自由にやらせると収拾つかなくなるかも、ある程度フィジカルコンピュティングらしいもので興味を持たせながら共通的な操作をさせた方がいいかもしれない。 〇あと、Halocode自体が持つ無線機能を使って2台、複数台で動かすプログラム非常に興味を持つかと思われる。 〇特にDojoでやっている子供は自由にやることに慣れているが、フィジカルコンピューティングする場合は、ある程度基礎手的な知識を学習する説明や資料が必要だと考える。 ダウンロード(プログラムの転送)が正しく行われると。 Halocodeのボタンを押すとLEDが光り出すよ。 アップロードモードをオンにして、 アップロードをクリックすれば、プログラムがPCからHalocodeにされます。 正しくダウンロードが終了すると、全部のLEDが一瞬緑に光ります。 9ページ

10 ②ファイル-新規や開くでも、前のプログラムが残ったままになる。
うまくいかない時 ①プログラムの転送ができない時 ・接続が切れている場合があります。 もう一度接続してくたさい。 ・新しいプログラムがアップロードされていなようである。 正しくダウンロードが終了すると、全部のLEDが一瞬緑に光ります。この緑色に光らない場合は、HalocodeをいったんPCから外して、ケーブルを再度差し込んでください。 〇Scratchやっている人ほど、ゲームなど複雑なプログラムをすぐ作りたがるが、(ドットを動かそうとして苦労するなど)micor:bitなどのフィジカルコンピューティングは、それらしいことを初めにやった方が興味がわくと思う。例えば ・振ると温度を表示する。 ・傾き方によって表示する絵柄が変わるなど 〇ロボットまでもっていくには、Scratchみたいに自由にやらせると収拾つかなくなるかも、ある程度フィジカルコンピュティングらしいもので興味を持たせながら共通的な操作をさせた方がいいかもしれない。 〇あと、Halocode自体が持つ無線機能を使って2台、複数台で動かすプログラム非常に興味を持つかと思われる。 〇特にDojoでやっている子供は自由にやることに慣れているが、フィジカルコンピューティングする場合は、ある程度基礎手的な知識を学習する説明や資料が必要だと考える。 ②ファイル-新規や開くでも、前のプログラムが残ったままになる。 いったんChromeブラウザを閉じて再度 ブラウザを起動してください。 10ページ

11 ◎プログラムを保存しよう/開こう ネット上に保存します プログラムの名前をつけます。 (アカウント必要)
新規 新しいプログラムを作ります 注意: デバイスで指定したHalocodeもクリアーされます。 開く ネットが開きます。 名前をつけて保存 ネットに名前を変更して保存 コンピュータから開く パソコンから開く パソコンに保存 〇当日このあたりが一番混乱したところ。別途補足資料を作成 本スライドには、その補足資料あり、 スライド21～25 〇このダウンロードの操作を含めポートの真偽によるモータ制御は、小学校3年生の子供には難しかったようである。モーター制御を関数化しておけばよかったかも。 ネットに保存した場合などはアカウントが必要です。補足資料見てください。 11ページ

12 3. Halocodeだけの、いろいろなプログラミング
　プログラムNo.1: 音量メーター 　簡単なプログラムですがHalocodeの近くで音や声をだすと、音の大きさによってLEDのメーターのように光ります。 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 チャレンジ: 　音の大きさによってLEDの光り方をいろいろ変えてみよう。 12ページ

13 簡単なプログラムですがHalocodeをふると、その振り方によってLEDのメーターのように光ります。
　プログラムNo.2: ふりふりメーター 　簡単なプログラムですがHalocodeをふると、その振り方によってLEDのメーターのように光ります。 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 13ページ

14 プログラムNo.3: 色を作ろう(光の三原色)
　簡単なプログラムですがHalocodeのLEDでいろいろな色を0,1,2のタッチセンサーを触ることで作ることができます。 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 チャレンジ: 解説: テレビやLEDライトなどの人工の光は、赤・緑・青の三色を適切な割合で混ぜて、いろいろな色を表見しています。 RGBをもっと細かく調整して、LEDをいろいろな色で光るプログラムを作ってみよう。 14ページ

15 ボタンを押すとLEDが赤から緑にかわります
　プログラムNo.4: 歩行者信号機 　ボタンを押すとLEDが赤から緑にかわります 始めは赤信号 ボタン押す 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 ちょっとたって 青信号 少したつと点滅 チャレンジ: 本物みたく、続けてボタンを押した場合は、なかなか青信号にならないようにしてみよう。 15ページ

16 タッチセンサーを使って、光の列の動きを制御してみよう。
　プログラムNo.5: ぐるぐる虹(にじ)列車 　七色の光の列がぐるぐる回るよ。 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 チャレンジ: タッチセンサーを使って、光の列の動きを制御してみよう。 16ページ

17 プログラムNo.6: 10秒タイマー 10秒ぐらいの時間が図れるタイマーてす。 操作方法: タッチ0: タイマーリセット
〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 操作方法: タッチ0: タイマーリセット タッチ1: タイマー+1秒 タッチ2: タイマー-1秒 ボタン: タイマー開始 17ページ

18 Halocodeを左右に傾けるとLEDのドットが移動するよ。
　プログラムNo.7: 玉(LED)転がし Halocodeを左右に傾けるとLEDのドットが移動するよ。 動かし方: ボタンでスタート 白いLEDを動かしい、黄色いLEDのところまで持っていくよ(3回繰り返してね) 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 チャレンジ: LEDをHalocodeの操作でを動かしたゲームを作ってみよう。 18ページ

19 4.HalocodeとPCをUSBケーブルでつないでみよう。
　HalocodeをUSBケーブルで直接、PCにつないでつかう方法があります。ちょうどゲームコントローラーみたいな感じで使えます。 ポイント: この時だけアップロードモードがオフを使用します。この場合、Halocodeと直接やりとりできます。 プログラムを作ったあと、Halocodeにアップロードする必要はありません。 USB ケーブル 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 プログラミングのポイント: Halocodeがスプライトのように動作します。そのため、PC上の他のスプライトと、変数でデータを共有したり、メッセージのやりとりでタイミングをとったりできます。 19ページ

20 「 4.HalocodeとPCをUSBケーブル」のサンプル
Scratchでよく作られるキャッチゲームのコントローラーをHalocodeで作ってみましょう。 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 フライパンのコード: migiとhidariのメッセージによって動きます。 Halocodeのコード: タッチセンサーによってmigiとhidariのメッセージを出します。 マイクの音量の値をマイクの変数に入れています。 (Halocodeの操作の結果、操作結果の値を確認するのに便利です) ポイント: Halocodeで操作してからPCで動くまで、時間がかかります。 このあたりを意識してプログラムを作りましょう。 20ページ

21 5.Halocode同志をネットワークでつないでみよう。
　Halocodeにはいろいろなネットでも使い方がありますが、もっとも簡単なので、Halocode同志を独自のネットワークでつなげる方法です 親機: ・ネットの宣言 ・メッセージの送受信 ・ネットの宣言 ・ネットへの参加 ・メッセージの送信 ・値付きメッセージの送信 ・メッセージの受信イベント ・値付きメッセージの値の取り出し 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 子機: ・宣言されたネットへの参加 ・メッセージの送受信 重要: ファームウェアは最新版にしてください。LANが正常に動作しないことがあります。 21ページ

22 「Halocode同志をネットワーク」のサンプル(親機用)
〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 ・CoderDojoという名前のネットで通信します。 ・親機から子機へ、LEDのOnOffのメッセージを送ります。 ・子機からのLEDのメッセージを元に、動作します。 22ページ

23 「Halocode同志をネットワーク」のサンプル(子機用)
複数の子機があると全部同じ動作します。 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 ・子機から親機へ、LEDのOnOffのメッセージを送ります。 ・親からのLEDのメッセージを元に、動作します。 チャレンジ: 2台又は複数のHalocodeの連動されて面白いプログラムを作ってみよう。 23ページ

24 インターネット 6. HalocodeをWifiでPCにつないでみよう。
　Halocodeは単独で、PCやスマホと同じようにWiFiを使ってインターネットに接続することができます。IoTのデバイスとして、他のHalocodeやPCと通信するプログラムを作ることができます。 インターネット ポイント: 世界中がつながっているインターネット経由で通信できます。 そのため、たとえばPCから離れた場所にあるHalocodeも通信することができます。 有線又は WiFi 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 WiFi 24ページ

25 「5.Halocode同志をネットワークでつないでみよう。」と同様な、メッセージや値付きメッセージで、やりとりしてます。
　 インターネットを使った通信の仕組み [WiFi]の ブロック インターネット アカウント: クラウドメッセージ 「5.Halocode同志をネットワークでつないでみよう。」と同様な、メッセージや値付きメッセージで、やりとりしてます。 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 ポイント: クラウドメッセージはアカウントと対応付けられます。そのためアカウントでログインしてプログラムを作る必要があります。このため、同じアカウントでログインして作ったプログラムでしか通信できません(この点は確認中)。 アカウントの作成は補足資料見てください。 25ページ

26 HalocodeのWiFiへの接続は簡単です。PCやスマホと同様にssid(WiFiのID)とパスワードを指定します。
接続サンプルプログラム: 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 WiFiの接続まで待って、正常に接続するとLEDを表示します。 26ページ

27 「 6. HalocodeをWifiでPCにつないで」のサンプル
〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 ポイント: PC側のクラウドメッセージか拡張で追加します。 27ページ

28 7. Halocodeをネット機能につないでみよう。
　HalocodeのコーディングツールのmBlockには拡張機能として、音声認識・認知サービス・機械学習などが利用できます。これらを使うとAIのプログラムを作ることができます。 ポイント: Halocodeが単独で使用できるネット上の拡張機能は、現在音声認識だけです。 ただし、PC上では他の拡張機能が使えるので、組み合わせて使うといろいろなことができます。 インターネット 拡張機能: 音声認識 AI(認知サービス、機械学習) 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 音声認識 AI 音声認識 28ページ

29 Halocodeで音声認識を使ったプログラム
LEDが白く点滅した後に、黄色くなったら音声認識できます。 ポイント1: 声を出した後、黄色い状態が続きますが、ネットワーク上の音声認識が動作している時です(少し時間がかかる) ポイント2: 英語で正しくred(レッド)又はGreen(グリーン)と発音すると、その色にLEDが光ります。 ポイント3: 現在音声認識は英語と中国語がサポートされています。 〇英語でWebが起動したときは、上部メニューの一番右が言語選択できます。 〇エディターに行くまでもってスマートな方法があればいいんですが。 〇レッスンに、初めに使えるプログラム幾つかあります。 〇Microsoft系のブラウザを使うと、動作が遅かったり、ブロックの表示が重なった見にくいことがあるみたい、Chromeを使いました。 29ページ

30 補足資料: mBlock アカウントの作り方、使い方
保存するなど、アカウントが必要なものを選ぶとサインインやアカウントの作成のダイアログが出ます。 いいえ 30ページ

31 補足資料: mBlock Webデバイスドライバのインストール
のサイトからダウンロードできます。 31ページ

32 補足資料:ローカル用コーディングツールのインストール
のサイトからダウンロードできます。 32ページ