ゲーミングソード？（100円ショップの刀をブロックプログラミングで光らせる） / Visual Programming IoTLT vol9

Transcript

1. ゲーミングソード？（100円ショップの刀を ブロックプログラミングで光らせる） 2021年10月28日 (木) ビジュアルプログラミングIoTLT vol.9 @オンライン 　　豊田 陽介 (

   @youtoy )

2. 豊田陽介（@youtoy） 自己紹介 普段は、某通信会社勤務 自宅にたくさん ガジェット好き その他 IT系イベント主催、登壇や運営なども 子ども向けの活動いろいろ（IT系以外も） プライベートでの活動 Microsoft

   MVP（2021/10 から） ⇒ のびすけさんと同じカテゴリ

3. 今日の話題は 「光る刀」

4. ダイソーで 1本200円で 売られてるおもちゃの刀 もともと、4箇所くらい光る （音も鳴ったりする）

5. 分解するとこんな感じに LED 4つがつながってたり、 スピーカー・スイッチ等も

6. 派手に光らせてみる

7. ゲーミングな光り方にしてみたり MakeCode for micro:bit で LEDテープを制御

8. IoTでお馴染み「MQTT」を使い映像・音の連動 M5StickC Plus の処理は UIFlow、MQTT で PC の 表示と連動させた形 （PC側は

   JavaScript）

9. 物理的な部分

10. 以前からよく使っている LEDテープ 動画でも変化がよく分かる

11. M5Stack社から出ている LEDテープ

12. プログラム

13. MakeCodeのほう（動画1つ目） セットアップ ゲーミングな 色になるやつ 光る LED の 数が変わるやつ

14. UIFlowのほう（動画2つ目） 7つの色の指定 （RGBそれぞれ） 光る LED の数を 変化させる MQTTの セットアップ ボタン押下で

    Publish メッセージ受信で 処理を実行

15. UIFlowを使ったほうの 機器構成

16. M5Stackのコンテスト用に作った構成図 M5Stack Light Sword with Image Effects（光る剣とエフェクト）

17. MQTTで両デバイスの処理の間をつなぐ M5StickC Plus のボタン押下 p5.js での アニメーション LEDテープを 光らせる処理

18. 100円ショップグッズ、 他にも光らせてみた

19. お化けのミニバケツ（ハロウィン向け） 良い感じに光を拡散させる グッズだという話＠Twitter を見かけて

20. MakeCodeでの実装内容 セットアップ ゲーミングな 色になるやつ 時間経過で色を 変化させる

21. 【告知】 イベント・コンテスト

22. 詳細はこちら 告知： ヒーローズ・リーグの VUI賞 「音声での入力・出力のどちらか、または両方が可能な作品」を 　募集中！ ⇒ 11/15 〆切 ヒーローズ・

    リーグについて VUI賞 について

23. ビジュアルプログラミング交流会 再来週 11/2（火）19:30 から（視聴は YouTube にて）

24. 終わり！