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
LINEでのコミュニケーションにマスコットキーホルダーを使ってみる / LINEを使ったLT大会 #5
Search
you(@youtoy)
PRO
November 25, 2023
Technology
0
2.3k
LINEでのコミュニケーションにマスコットキーホルダーを使ってみる / LINEを使ったLT大会 #5
you(@youtoy)
PRO
November 25, 2023
Tweet
Share
More Decks by you(@youtoy)
See All by you(@youtoy)
Babylon.jsと色々なものを組み合わせる:ブラウザのAPIやガジェットや2D描画ライブラリなど / Babylon.js 勉強会 vol.3
you
PRO
0
240
WebHID API で Joy-Con・DUALSHOCK 4 のセンサーをブラウザから利用する / IoTLT vol.109
you
PRO
0
140
UIFlow 2.0 で MQTT をやってみた! / IoTLT vol.108
you
PRO
0
1.8k
UIFlow 2.0 と ATOMS3 の組み合わせで LINE通知を試す / ビジュアルプログラミングIoTLT vol.16
you
PRO
0
200
技術コミュニティの中での生成AI(自身の観測範囲での事例について) / 23 Xmas Talk / 20231209
you
PRO
0
1.5k
AI・機械学習ライブラリを使ったWebアプリでワクワク体験! / Qiita Night~AI、機械学習 / 20231201
you
PRO
3
2.2k
p5.js・p5playを使った体験イベントに参加した子達が手を動かすこと・考えることを楽しんでくれた話 / p5.js勉強会(第九回) / 20231126
you
PRO
0
69
イベントで大活躍の電子ペーパー名札 〜M5PaperとUIFlow+α〜 / #ヒーローズリーグ 2023 予選 in 第二部
you
PRO
0
110
ハッカソンでWebの技術を使った作品を作ってみた 〜ブラウザで機械学習やデバイス制御など〜 / HTML5 9th Anniversary
you
PRO
0
120
Other Decks in Technology
See All in Technology
React 19を概念から理解する
uhyo
19
6.6k
Improve developer experience with Spring Interface Clients Spring I/O 2024
olgamaciaszek
0
140
意義から考えるObservability入門 #srenext
stefafafan
2
850
GopherDay Taiwan 2024 - 利用 Gemini Pro 與 Golang 打造創新智能的 LINE Bot 應用
line_developers_tw
PRO
0
250
『インタプリタの作り方』の紹介 / Let's enjoy crafting interpreters
mktakuya
0
240
プロダクトオーナー向け生成AI支援サービスの仮説検証事例
yosuke_matsuura
PRO
1
220
CyberAgent AI事業本部2024年度MLOps研修基礎編 / MLOps Basic
nsakki55
11
6.7k
【OpsJAWS】踏み台サーバーって何がうれしいんだっけ?
hssh2_bin
11
3.8k
Speeeエンジニア組織紹介
speee
0
440
IoTサービスにおけるSLI設計とLUUPでの実践
grimoh
1
100
Open Source Developer Experience, Platform Engineering and AI-infused Apps - DevTalks Romania
kdubois
0
160
CSPが提供しない、フレッツ網をつかった閉域接続サービス&データ持ち込みにつかえるサービス 3選
armaniacs
1
1k
Featured
See All Featured
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
352
28k
For a Future-Friendly Web
brad_frost
172
9k
Large-scale JavaScript Application Architecture
addyosmani
504
110k
Visualization
eitanlees
137
14k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
69
14k
StorybookのUI Testing Handbookを読んだ
zakiyama
13
4.7k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
358
22k
The Power of CSS Pseudo Elements
geoffreycrofte
62
5.1k
The Brand Is Dead. Long Live the Brand.
mthomps
49
33k
The Invisible Side of Design
smashingmag
294
49k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
221
21k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
155
14k
Transcript
2023年11月25日 (土) 初心者・初登壇Welcome!LINEを使ったLT大会 #5 @オンライン 豊田陽介( ) @youtoy LINEでのコミュニケーションに マスコットキーホルダーを使ってみる
自己紹介 豊田陽介( ) @youtoy ・IT系イベント主催、登壇や運営なども ・機械学習・IoTの書籍を出版 ・子ども向けの活動いろいろ ・ Microsoft MVP(2021/10
から) プライベートでの活動 ・ガジェット大好き ・ビジュアルプログラミング/JavaScript とガジェットの組み合わせをよくやって いたり、AI・機械学習系の内容も使って みていたり 好きなこと、他
まずは作品の紹介動画から(動作の様子を抜粋) LINEアプリとマスコット キーホルダーでやりとり (LINEアプリで IoT)
システム構成 スマホ (LINEアプリ) マスコット キーホルダー (+デバイス)
LINEアプリでIoT という仕組み自体は...
通知・Botサーバーの部分の似た仕組みのもの LINE DC Monthly LT #1 - LINE de IoT「ものづくりを語ろう!」
にて、少し違う実装のものは発表済み
詳細は公開済みの登壇スライドに
LINE のリッチ メニューの操作 以前作ったものの動作概要 LEDテープの点灯、 電子ペーパーの 書きかえ デバイスで音の再生 (全て実行) ①
M5Stack系の デバイスで ボタン押下 LINE Notify でメッセージ通知 ②
クラウド実行環境 (HTTPトリガー) Botサーバー +α (REST API、MQTT) M5Stack Core2 以前作ったものの構成(全体) M5StickC
Plus M5Paper LINE Notify スマホのLINE アプリ リッチメニュー の操作 HTTP(POST) HTTP(POST) MQTT MQTT HTTP(POST) 【実装のポイント】 ▪ enebular(Node-RED)と UIFlowでの実装 ▪ MQTTとHTTPリクエストを 混在させる構成で実現
(発表では省略)前に作ったもののデモ動画
前にenebular実装だった部分は 簡素化してNode.js実装にしつつ
今回のポイントの マスコットキーホルダーの部分は
マスコットキーホルダーを介したやりとり
利用したデバイスが ちょっと特徴的かも
マスコットキーホルダーに触れたかを判定 薄いアクリルや布など が間にあっても触れた と判別できる
いろいろなパターンの振動を生み出す 今回の作品では全く活かせて いないけど、豊富な振動パターン を生み出すことが可能 公式デモを試すとすごい!
(本来は)微細な振動を使うとか ダイナミックな振動を使うとか お知らせパターンを作れそう
VSCode の「built-in port forwarding」が便利 ngrok でできることが VSCode標準機能でできる!
余談ですが... VSCode の「built-in port forwarding」の注目度は高かった 記事がはてなブックマークの テクノロジーの人気トップに Qiitaの 9月の月間トレンド 記事にランクイン
また今後も 「ガジェット + LINE」 を何かやれればと
終わり!