第4回
光プログラミング教室～LED作品を作ってみよう～

2021年6月26日 ＠あすたむらんど
四国大学 T-LAP

○予定表

第1回(5/15)：scratchでプログラミングに触れよう
第2回(5/29)：pythonでキャラクターを動かそう
第3回(6/5)：ESP32でLEDを光らせよう

第4回(6/26)：LED作品を作ってみよう○今日の目次●前回の復習●if文の使い方（もし～ならば）●自由にプログラムを書こう○ESP32とneopixelをつなげよう①ESP32とneopixelを、neopixel
ESP32+5V ----------- 5V
Din ----------- 13
GND ------------ GND
上記の通りつなぐ②ESP32とパソコンをケーブルでつなぐ

○ESP32をパソコンにつなげよう②デバイスマネージャーでCOMポートを確認②vscodeのpymakr.jsonのタブを開いて、addressの右側にポート番号を入れる③vscodeの一番下のここをクリック

○前回の復習
全て光る

明るくなる

暗くなる

青から赤へ

○前回の復習

色が動く

全体の色が少しずつ変わる

○時間とともに光らせ方を変えよう
赤と青で交互に光らせるプログラム

0,2,4,6,8

ifのあとの=は２つ必要！

1,3,5,7,9

赤、緑、青、赤、緑、青…とするにはどうしたらいいだろう？

○時間とともに光らせ方を変えよう
赤緑青を順番に光らせるプログラム

○時間とともに光らせ方を変えよう
色が行ったり来たりするプログラム

○時間とともに光らせ方を変えよう
全体の色が赤と青で交互に変わっていくプログラム

○時間とともに光らせ方を変えよう
全体の色が赤緑青で変わっていくプログラム
できあがったら、pの値を変えてみよう！

全体の色が赤緑青で変わっていくプログラムの色の変わり方

step

rgb:

0

(100,0,0)

100

200

300

(0,100,0)(0,0,100)(100,0,0)

○時間とともに光らせ方を変えよう
色が赤緑青で左から右へ流れていくプログラム

○導入方法0.必要なものを準備

8.pymakrの設定を変更する

1.Pythonをインストール

9.pythonファイルを作成する

2.vscodeをインストール
3.ESP32のドライバをインストール
4.esptool.pyをインストール※

5.ESP32にファームウェアを書き込む※
6.node.jsをインストール

7.vscodeにpymakrをインストール

・以下に記載の手順は、ダウンロード先
ホームページの更新などにより異なる可能性がありますが、概略は同じです
のでご参照ください。
・講座で使用したボードを使う場合、4と5の手順は不要です。
・5の手順を行うと、アップロードしたプログラムは削除されます。
・以下の手順はwindows10向けです。

０.必要なもの
ＥＳＰ３２－ＷＲＯＯＭ－３２開発ボード（マイコンボード）
購入先：秋月電子 など
価格：1,480円※ESP32-WROOM-32Eという後継品が出ています。動作確認はしていませんが、そちらでも動くかもしれません。

NeoPixelテープ
購入先：エルパラ など価格：2,800円 （1m,60LEDの場合）※LEDとLEDの間隔などで金額が異なります。
エルパラで「neopixelテープ」を調べてみてください。

USBケーブル（TypeA－microUSB TypeB)
購入先：ダイソー など
価格：100円程度※TypeAはパソコンにつなぐ方の端子です。
パソコンのUSB端子の形状が特殊な場合、それに合うものを購入してください。
microUSB Type-Bは、ESP32につなぐ方の端子です。androidのケーブルに使われていることもあります。

1.pythonをインストール①ブラウザで「python」と検索し、↓をクリックする。

④ダウンロードされたインストーラを起動②「Downloads」をクリック。
③「Download Python 3.9.5」をクリック。

⑥この2か所にチェックを入れて「Install Now」をクリック※バージョンは更新されていくので、3.9.5じゃなくても大丈夫です2.vscodeをインストール①ブラウザで「vscode」と検索して、↓をクリック。

②「今すぐダウンロード」をクリック。

③Windows用のインストーラー
をクリック。

2.vscodeをインストール④
ダウンロードしたインストーラー⑧「追加タスクの選択」
チェックボックスを全て入れて「次へ」をクリックする。

をダブルクリックして起動する。
⑤「使用許諾契約書の同意」「同意する」にチェックして「次へ」をクリックする。
⑥「インストール先の指定」
そのまま「次へ」をクリックする。
⑦「プログラムグループの指定」
そのまま「次へ」をクリックする。

⑨「インストール準備完了」「インストール」をクリックする。

2.vscodeをインストール⑪ここをクリックして、検索窓に「python」と入力して検索する。

⑫pythonが出てくるので、installをクリックする。

3.ESP32のドライバをインストール※これ以降の手順では、パソコンにESP32を挿しておいてください。
①「CP210X ドライバ」で検索して、下記ページをクリック②「ダウンロード」をクリック③ダウンロードしたzipファイルを展開（多分ダブルクリックで展開されます）④展開したフォルダを開き、↓のファイルをダブルクリックで実行⑤インストーラーに従ってインストールする⑥デバイスマネージャーでCOMポートを確認

4.esptool.pyをインストール①左下の検索窓で「powershell」と入力してpowershellを起動③下記の表示が出ることを確認(「Successfully installed ~ esptool~」の部分 )②起動したら「pip install esptool」と入力してエンターキーを押す

入力が終わったら、エンターキーを押す前に、入力ミスがないかチェックしよう！
(ちゃんとスペースを入れているか、違う文字を入力していないか、などなど）

5.ESP32にファームウェアを書き込む①「micropython download」と検索して下のページをクリックする。

③GENERIC（日本語だと「汎用」）の中から、unstableでないもののうち、一番新しいファイルをクリックしてダウンロードする。

②スクロールして、「Generic ESP32 module」をクリックする。

これがmicropythonのファームウェアです※日本語だと「汎用ESP32モジュール」※ファームウェアは更新されていくので、最新ファイルは上記画像のファイル名と一致しません。

5.ESP32にファームウェアを書き込む④エクスプローラーを開き、ダウンロードフォルダを開く。

⑥「場所」のタブをクリックし、Ctrl＋Cでコピーした後に×で閉じる。

⑤上部の「ホーム」→「プロパティ」をクリック⑦powershellで「cd」と入力し、スペースを押した後、powershellの画面上で右クリックする。
（右クリックすると貼り付けできる）
貼り付けられたらエンターを押す。

5.ESP32にファームウェアを書き込む⑧powershellで「pip show esptool」と入力してエンターキーを押す。

⑩「cp」と入力し、スペースを押して、画面上で右クリックする。

⑪上に続けて、「¥esptool.py .」スペースの後にドットと入力してエンターキーを押す。
⑨「Location」の「c:」より後ろを選択して、画面上で右クリックする。
（選択して右クリックでコピーできる）※この部分はパソコンによって異なります。
多分すごく長いと思います。

スペース5.ESP32にファームウェアを書き込む⑫「python esptool.py --port COM(番号) erase_flash」 （ はスペース）と入力してエンターキーを押す（COMポートはデバイスマネージャーで確認）「successfully（成功）」と表示されたら成功です

うまくいかない場合、ESP32を抜き差ししてみてください。

5.ESP32にファームウェアを書き込む

手順5-③参照⑬「python esptool.py --chip esp32 --port COM(番号) write_flash -z 0x1000 (ファームウェアのファイル名)」と入力しエンターキーを押す。

（ はスペース）(COMポートはデバイスマネージャーで確認）（ファームウェアのファイル名は、入力途中でタブを押せば補完されます）（コマンドが長いので途中で改行されると思いますが、気にしなくて大丈夫です）

成功したら書き込みが始まるので、しばらく待って←のように表示されたら完了です。

6.node.jsをインストール③ダウンロードしたインストーラーを起動する。
①「node.js ダウンロード」で検索して、↓をクリック。

②windows installerをクリック。

④インストーラーに従って、設定を変更せず「Next」をクリックしていく。
※途中の利用規約には同意してください。
※chocolateyをインストールしてはいけません！

チェックを入れる

チェックを入れない！！

7.vscodeにpymakrをインストール①Visual Studio Codeを起動する。

②左側の、拡張機能のマークをクリック。

④拡張機能の検索ボックスに「pymakr」と入力して、pymakrの「install」をクリック。

⑤インストールが終わるまで待つ。終わったら、下の赤枠部分のように表示される。
（表示を確認するだけなのでクリックしない）⑥インストールが終わったら、vscodeを再起動する。

8.pymakrの設定を変更する①Visual Studio Codeで、「Ctrlキー＋Shiftキー＋P」を押す。

④pymakr.jsonが開くので、“auto_connect”をfalseにする。
（21行目ぐらい）②出てきた検索窓に、「pymakr global settings」と入力し、エンターを押す。
⑤”address”をデバイスマネージャーで確認したCOMポートにする。（2行目ぐらい）⑥変更し終わったらctrl+sで保存してvscodeを一旦閉じる。

9.pythonファイルを作成する①デスクトップなど、好きな場所に好きな名前で新しいフォルダを作る②作ったフォルダを開く。

③上部の「表示」をクリックし、「ファイル名拡張子」にチェックを入れる④右クリック→新規作成→テキストドキュメントを選択する。

9.pythonファイルを作成する⑤ファイル名の部分を全て消し、「main.py」にしてエンターを押す。

⑥↓のダイアログがでてきたら「はい」をクリックする。

⑦デスクトップに戻り、作成したフォルダを右クリック→「Open with Code」を選択する。
（日本語だと「Codeで開く」）

9.pythonファイルを作成する⑧vscodeが起動して、↓のような画面が表示されたら、「Yes」の方をクリック。

⑨左側の「main.py」をクリックする。

すると、画面中央にmain.pyが開くので、あとは講座でやったようにプログラミングができます。

9.pythonファイルを作成する⑩ESP32に接続できない場合、Ctrl＋Shift＋Pを押し、検索窓に「pymakr project settings」と入力してエンターキーを押す。

⑪”address”の部分を、デバイスマネージャーで確認したCOMポートに合わせる。