Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ゲーミングソード?(100円ショップの刀をブロックプログラミングで光らせる) / Visual Programming IoTLT vol9
Search
you(@youtoy)
PRO
October 28, 2021
Technology
0
240
ゲーミングソード?(100円ショップの刀をブロックプログラミングで光らせる) / Visual Programming IoTLT vol9
you(@youtoy)
PRO
October 28, 2021
Tweet
Share
More Decks by you(@youtoy)
See All by you(@youtoy)
WebHID API で Joy-Con・DUALSHOCK 4 のセンサーをブラウザから利用する / IoTLT vol.109
you
PRO
0
100
UIFlow 2.0 で MQTT をやってみた! / IoTLT vol.108
you
PRO
0
1.6k
UIFlow 2.0 と ATOMS3 の組み合わせで LINE通知を試す / ビジュアルプログラミングIoTLT vol.16
you
PRO
0
160
技術コミュニティの中での生成AI(自身の観測範囲での事例について) / 23 Xmas Talk / 20231209
you
PRO
0
1.4k
AI・機械学習ライブラリを使ったWebアプリでワクワク体験! / Qiita Night~AI、機械学習 / 20231201
you
PRO
2
2.1k
p5.js・p5playを使った体験イベントに参加した子達が手を動かすこと・考えることを楽しんでくれた話 / p5.js勉強会(第九回) / 20231126
you
PRO
0
53
LINEでのコミュニケーションにマスコットキーホルダーを使ってみる / LINEを使ったLT大会 #5
you
PRO
0
2.3k
イベントで大活躍の電子ペーパー名札 〜M5PaperとUIFlow+α〜 / #ヒーローズリーグ 2023 予選 in 第二部
you
PRO
0
93
ハッカソンでWebの技術を使った作品を作ってみた 〜ブラウザで機械学習やデバイス制御など〜 / HTML5 9th Anniversary
you
PRO
0
110
Other Decks in Technology
See All in Technology
コンテナセキュリティの基本と脅威への対策
kyohmizu
3
700
HEXA OSINT CTF V3 作戦会議
meow_noisy
0
110
オブザーバビリティの Primary Signals
onk
PRO
0
550
キャラクター制御のためのプロンプト術 for LINE Bot
uezo
0
520
アクセシビリティを考慮したUI/CSSフレームワーク・ライブラリ選定
yajihum
0
140
強みを伸ばすキャリアデザイン
yug1224
0
200
アプリがつくるNOT A HOTELブランド
hokuts
1
450
現代CSSフレームワークの内部実装とその仕組み
poteboy
2
610
疲弊しない!AWSセキュリティ統制の考え方 #devio_osakaday1
masahirokawahara
6
5.9k
テストプロセスで大事にしていること #jasstnano
makky_tyuyan
0
130
コードを書く隙間を見つけて生きていく技術/Findy 思考の現在地
fujiwara3
24
5.2k
Terraformあれやこれ/terraform-this-and-that
emiki
4
450
Featured
See All Featured
The Language of Interfaces
destraynor
151
23k
For a Future-Friendly Web
brad_frost
171
8.9k
Being A Developer After 40
akosma
56
580k
Designing the Hi-DPI Web
ddemaree
276
33k
Thoughts on Productivity
jonyablonski
57
3.8k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
6
990
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
321
20k
Pencils Down: Stop Designing & Start Developing
hursman
117
11k
What’s in a name? Adding method to the madness
productmarketing
PRO
15
2.6k
GitHub's CSS Performance
jonrohan
1023
450k
Writing Fast Ruby
sferik
620
60k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
20
1.6k
Transcript
ゲーミングソード?(100円ショップの刀を ブロックプログラミングで光らせる) 2021年10月28日 (木) ビジュアルプログラミングIoTLT vol.9 @オンライン 豊田 陽介 (
@youtoy )
豊田陽介(@youtoy) 自己紹介 普段は、某通信会社勤務 自宅にたくさん ガジェット好き その他 IT系イベント主催、登壇や運営なども 子ども向けの活動いろいろ(IT系以外も) プライベートでの活動 Microsoft
MVP(2021/10 から) ⇒ のびすけさんと同じカテゴリ
今日の話題は 「光る刀」
ダイソーで 1本200円で 売られてるおもちゃの刀 もともと、4箇所くらい光る (音も鳴ったりする)
分解するとこんな感じに LED 4つがつながってたり、 スピーカー・スイッチ等も
派手に光らせてみる
ゲーミングな光り方にしてみたり MakeCode for micro:bit で LEDテープを制御
IoTでお馴染み「MQTT」を使い映像・音の連動 M5StickC Plus の処理は UIFlow、MQTT で PC の 表示と連動させた形 (PC側は
JavaScript)
物理的な部分
以前からよく使っている LEDテープ 動画でも変化がよく分かる
M5Stack社から出ている LEDテープ
プログラム
MakeCodeのほう(動画1つ目) セットアップ ゲーミングな 色になるやつ 光る LED の 数が変わるやつ
UIFlowのほう(動画2つ目) 7つの色の指定 (RGBそれぞれ) 光る LED の数を 変化させる MQTTの セットアップ ボタン押下で
Publish メッセージ受信で 処理を実行
UIFlowを使ったほうの 機器構成
M5Stackのコンテスト用に作った構成図 M5Stack Light Sword with Image Effects(光る剣とエフェクト)
MQTTで両デバイスの処理の間をつなぐ M5StickC Plus のボタン押下 p5.js での アニメーション LEDテープを 光らせる処理
100円ショップグッズ、 他にも光らせてみた
お化けのミニバケツ(ハロウィン向け) 良い感じに光を拡散させる グッズだという話@Twitter を見かけて
MakeCodeでの実装内容 セットアップ ゲーミングな 色になるやつ 時間経過で色を 変化させる
【告知】 イベント・コンテスト
詳細はこちら 告知: ヒーローズ・リーグの VUI賞 「音声での入力・出力のどちらか、または両方が可能な作品」を 募集中! ⇒ 11/15 〆切 ヒーローズ・
リーグについて VUI賞 について
ビジュアルプログラミング交流会 再来週 11/2(火)19:30 から(視聴は YouTube にて)
終わり!