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
2020年のコミュニティ活動でのNode-RED関連の活動・開発を振り返る / Node-RE...
Search
you(@youtoy)
PRO
November 27, 2020
Technology
0
390
2020年のコミュニティ活動でのNode-RED関連の活動・開発を振り返る / Node-RED UG勉強会 2020 年末オンラインLTパーティ
you(@youtoy)
PRO
November 27, 2020
Tweet
Share
More Decks by you(@youtoy)
See All by you(@youtoy)
公開初日に Gemini CLI を試した話や ffmpeg と組み合わせてみた話など / Gemini CLI 初学者勉強会(#AI道場)
you
PRO
0
2
Node-REDのFunctionノードでMCPサーバーの実装を試してみた / Node-RED × MCP 勉強会 vol.1
you
PRO
0
130
総額200円の入力インターフェースで年齢問わず楽しめる体験型展示 / エンジニアの自由研究発表会vol.10
you
PRO
0
61
Node−RED で Ollama を使ったローカルLLM(node-red-contrib-ollamaを利用) / ビジュアルプログラミングIoTLT vol.20
you
PRO
0
180
AIエージェント開発や最新の生成AIのAPI利用などJavaScriptで色々やってみる / IoTLT vol.123
you
PRO
0
110
ChatGPT からモックサーバー宛(Beeceptor宛)の HTTPリクエストを試す / IoTLT 202504
you
PRO
0
100
デモをまじえつつの生成AIの話題 / 横須賀プログラミング“夢”アカデミー発表会(2025年3月)
you
PRO
0
53
もくはりでのモノ作りと自身のモノ作り活動 / もくはり文化祭2024 オープン記念イベント
you
PRO
0
57
"かわいい" がテーマのハッカソンでWebの技術を使って魔法の世界を作った話など / HTML5 10th Anniversary
you
PRO
0
110
Other Decks in Technology
See All in Technology
AI エージェントと考え直すデータ基盤
na0
17
5.5k
マーケットプレイス版Oracle WebCenter Content For OCI
oracle4engineer
PRO
3
970
What’s new in Android development tools
yanzm
0
460
〜『世界中の家族のこころのインフラ』を目指して”次の10年”へ〜 SREが導いたグローバルサービスの信頼性向上戦略とその舞台裏 / Towards the Next Decade: Enhancing Global Service Reliability
kohbis
2
370
20250705 Headlamp: 專注可擴展性的 Kubernetes 用戶界面
pichuang
0
290
SRE不在の開発チームが障害対応と 向き合った100日間 / 100 days dealing with issues without SREs
shin1988
1
410
AWS CDK 開発を成功に導くトラブルシューティングガイド
wandora58
3
130
QuickSight SPICE の効果的な運用戦略~S3 + Athena 構成での実践ノウハウ~/quicksight-spice-s3-athena-best-practices
emiki
0
120
Reach American Airlines®️ Instantly: 19 Calling Methods for Fast Support in the USA
flyamerican
1
180
PO初心者が考えた ”POらしさ”
nb_rady
0
220
SREのためのeBPF活用ステップアップガイド
egmc
1
200
CDK Vibe Coding Fes
tomoki10
0
220
Featured
See All Featured
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
20
1.3k
KATA
mclloyd
30
14k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
980
Optimising Largest Contentful Paint
csswizardry
37
3.3k
How GitHub (no longer) Works
holman
314
140k
The Straight Up "How To Draw Better" Workshop
denniskardys
235
140k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
Building an army of robots
kneath
306
45k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Transcript
2020年11月27日 (金) Node-RED UG勉強会 2020 年末オンラインLTパーティ @オンライン 豊田 陽介 (
@youtoy )
豊田陽介(@youtoy) 自己紹介 普段は、某通信会社の研究所勤務 話題のものを たくさん購入 してる気がする ビジュアルプログラミング交流会 主催、その他にも複数主催 ガジェット好き その他
IT系イベント主催・登壇・運営、多数参加 子ども向けの活動いろいろ(IT系以外も) プライベートでの活動
今年の活動の中で Node-REDが関わる話
やってみたこと、 良かった点の話
月刊 I/O 8月号の記事執筆 Node-RED で機械学習(GoogleさんのTeachable Machine)を使う話 準備時に書いた Qiitaの記事も
Teachable Machine+Node-REDの記事 Qiita の記事では、サンプルを動かすまでの手順を記載
Teachable Machine で 手軽に機械学習ができ、 それを容易に活用!
余談: Teachable Machine 楽しい! Node-RED は絡んでない話ではありますが、音を学習させた事例 Maker Faire Tokyo 2020
や Tsukuba Mini Maker Faire 2020 の出展で活用 単体でもオススメ!
3人で共同主催・講師をやったハンズオン 自分のネタはダッシュボード(可視化)・WebSocket関連 Node-REDで色々試すハンズオン Tec-Nomad ・ ビジュアルプログラミング交 流会 コラボ ハンズオン資料 は公開済み
ハンズオンのテキスト用の記事 40枚オーバーの画像を掲載して、「ダッシュボード・リアルタイム通信 (Websocket)」を試す手順を説明 ⇒ シンプルだけど、短時間でいろいろ試せる内容を意識 スライダーと ゲージを試す ボタンを押し たら音声合成
記事に書いた事例の話など:デモ動画 ゲージと MIDI対応デバイス、micro:bit の組み合わせの話 ノブの回転量 を可視化 X・Y方向の加速度 の値を可視化
デバイスの挙動確認を 分かりやすく!
ハンズオンのテキスト用の記事+α HTML+JavaScript、Node-RED のダッシュボードの両方でグラフ化 ⇒ ハンズオンでは、生成した乱数を Websocket で送り、グラフ化 ダッシュボード でグラフ化 Smoothie.js
で グラフ化 オンラインハンズオンで全員が 試せるよう実機なしでデータ生成
Websocket のサーバ側も 準備でき、さらに可視化も
ビジュアルプログラミングだけでIoT システムの全体でビジュアルプログラミングのみ利用した IoT の仕組み
デモ動画: Lチカ?
デモ動画: 3Dオブジェクト連動
システム構成と処理内容など ・センサーの値取得 ・シリアル通信 ・LED制御 ・MQTTブローカー ・シリアル通信 ・MQTTの通信 グローバルな アクセス ・ボタンの制御
・MQTTの通信 ・LED制御
データの流れ IoTLT vol.61 @オンライン センサーの値 (シリアル通信) 特定の文字列 (シリアル通信) センサーの値 (MQTT)
特定の文字列 (MQTT)
データの流れ(後に出てきた動画) センサーの値 (シリアル通信) 特定の文字列 (シリアル通信) センサーの値 (MQTT) 特定の文字列 (MQTT) 特定の文字列、
センサーの値 (MQTT) センサーの値 (MQTT) 特定の文字列 (MQTT)
シリアル通信・MQTT の間、デバイスと IoT 通信のつなぎ役に!
OBSの外部からの遠隔操作をNode-REDで オンラインイベントのライブ配信等でも利用される OBS との組み合わせ 画面に表示するシーン (画面構成)の切り替え を Node-RED から
さらにLINEアプリとの連携を追加! LINEアプリ上の操作で OBS のシーン切り替えを実現
デモ動画:LINEアプリからOBSを操作 https://www.youtube.com/watch?v=K2A2sBlboHU
デモ動画:コメント表示+合成、効果音 https://www.youtube.com/watch?v=VwZrP-n9Aoo& 先ほどの仕組みと一緒 に合わせ込んだ仕組み
全体構成(LINEアプリ連携バージョン) LINEアプリ上で 入力した内容を POSTで送信 MQTT PC スマホ等 MQTT Websocket HTTP
リクエスト (POST) 受信したテキスト に合わせて処理を 場合分け
LINEアプリ連携に利用したNode-REDのノード ビジュアルプログラミングIoTLT vol5 @オンライン 以下のAPIを利用可能 ・LINE Messaging API ・Reply Message
・Push Message ・LINE Notify Maintainers ・n0bisuke
enebular上で実装した内容 ビジュアルプログラミングIoTLT vol5 @オンライン LINEアプリから受信したテキストによって挙動を場合分け等
試作済みの仕組み2つ の統合、別サービスの 連携をすべて担当
他にもカメラ利用の 事例などあったけど
間違いなく時間が 足りないので
終わり!