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...
Search
you(@youtoy)
PRO
October 28, 2021
Technology
0
250
ゲーミングソード?(100円ショップの刀をブロックプログラミングで光らせる) / Visual Programming IoTLT vol9
you(@youtoy)
PRO
October 28, 2021
Tweet
Share
More Decks by you(@youtoy)
See All by you(@youtoy)
もくはりでのモノ作りと自身のモノ作り活動 / もくはり文化祭2024 オープン記念イベント
you
PRO
0
35
"かわいい" がテーマのハッカソンでWebの技術を使って魔法の世界を作った話など / HTML5 10th Anniversary
you
PRO
0
85
ブラウザで AI・機械学習が扱える TensorFlow.js が使われているライブラリなどの話 / #さくらのAI Meetup vol.4「ブラウザ」
you
PRO
0
180
Blynk と Raspberry Pi Pico W で IoT 〜 MQTT・HTTPリクエストの組み合わせも 〜 / IoTLT vol.114
you
PRO
0
2.5k
AIを活用したWebアプリのプロトタイプを作ってコンテストや展示に出してみた話 / 大阪工業大学 ネットワークデザイン学科 LT大会 2024v2
you
PRO
0
98
Babylon.jsと色々なものを組み合わせる:ブラウザのAPIやガジェットや2D描画ライブラリなど / Babylon.js 勉強会 vol.3
you
PRO
0
620
WebHID API で Joy-Con・DUALSHOCK 4 のセンサーをブラウザから利用する / IoTLT vol.109
you
PRO
0
2.4k
UIFlow 2.0 で MQTT をやってみた! / IoTLT vol.108
you
PRO
0
5k
UIFlow 2.0 と ATOMS3 の組み合わせで LINE通知を試す / ビジュアルプログラミングIoTLT vol.16
you
PRO
1
2.7k
Other Decks in Technology
See All in Technology
事業を差別化する技術を生み出す技術
pyama86
2
440
ABWG2024採択者が語るエンジニアとしての自分自身の見つけ方〜発信して、つながって、世界を広げていく〜
maimyyym
1
190
Snowflakeの開発・運用コストをApache Icebergで効率化しよう!~機能と活用例のご紹介~
sagara
1
500
入門 PEAK Threat Hunting @SECCON
odorusatoshi
0
170
Qiita Organizationを導入したら、アウトプッターが爆増して会社がちょっと有名になった件
minorun365
PRO
1
200
ExaDB-XSで利用されているExadata Exascaleについて
oracle4engineer
PRO
3
280
データモデルYANGの処理系を再発明した話
tjmtrhs
0
180
DeepSeekとは?何がいいの? - Databricksと学ぶDeepSeek! 〜これからのLLMに備えよ!〜
taka_aki
1
160
IAMポリシーのAllow/Denyについて、改めて理解する
smt7174
2
210
RayでPHPのデバッグをちょっと快適にする
muno92
PRO
0
190
What's new in Go 1.24?
ciarana
1
110
AI自体のOps 〜LLMアプリの運用、AWSサービスとOSSの使い分け〜
minorun365
PRO
9
750
Featured
See All Featured
Practical Orchestrator
shlominoach
186
10k
Art, The Web, and Tiny UX
lynnandtonic
298
20k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
114
51k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
175
52k
Building Flexible Design Systems
yeseniaperezcruz
328
38k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.1k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Product Roadmaps are Hard
iamctodd
PRO
51
11k
Fireside Chat
paigeccino
35
3.2k
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 にて)
終わり!