ChatGPT + Node-RED + HoloLens 2 + IoT な連携の Node-RED フロー例

Node-RED Park Vol.11 - AIを使うフローについて語る会！「ChatGPT + Node-RED + HoloLens 2 + IoT な連携の Node-RED フロー例」の登壇資料です。

◆スライド内の素材は以下を使用させていただいております。ありがとうございます！

・シルエットデザイン http://kage-design.com/
・human pictogram 2.0 http://pictogram2.com
・ICOOON MONO http://icooon-mono.com/
・Adobe Stock https://stock.adobe.com/jp

Transcript

1. Node-RED Park Vol.11 - AIを使うフローについて語る会！
   ChatGPT + Node-RED + HoloLens 2 +
   IoT な連携の Node-RED フロー例
   ワンフットシーバス 田中正吾
   

   View Slide

2. 私の話はスライドを後ほど共有します。
   話す内容に注力いただいて大丈夫です！
   

   View Slide

3. 田中正吾（たなかせいご）
   屋号：ワンフットシーバス
   2004年よりフリーランス。以後、FLASH制作を
   中心にインタラクティブコンテンツを主に行い現
   在に至る。
   最近ではWEBフロントエンドをベースにしなが
   らも、情報とインターフェースが合わさるアプ
   ローチという視点でIoTやMixed Realityといった
   技術も取り入れながら活動しています。
   

   View Slide

4. 15 分くらいを目指してアレコレ話します
   

   View Slide

5. 音声認識したテキストを ChatGPT API に伝えて
   IoT へ指示する JSON に変換され IoT が動作します
   日本語
   音声認識
   （インターネット経由）
   IoT 指示
   JSON
   自前 Node-RED
   ChatGPT API
   HoloLens2
   IoT
   

   View Slide

6. ひとまずデモ
   

   View Slide

7. OpenAI 社の ChatGPT API
   使うのはこの API です
   https://platform.openai.com/overview
   

   View Slide

8. Chat completion を使います
   画像生成とか音声認識とか他にもいろいろあるんですが、話題のチャットの仕組みを使います
   

   View Slide

9. おおまかには OpenAI の Web 版で
   使えるのと近いもの
   たしかに API と Web 版で比較してやってみても同じような印象（あくまで印象ですが）
   

   View Slide

10. API reference ページで API Keys の
    リンクがあるので、そこからアクセス
    https://platform.openai.com/docs/api-reference/authentication
    

    View Slide

11. ログイン聞かれるのでログインします
    わたしはうっかり Sign up 押しがちなのは秘密
    

    View Slide

12. API Keys のページで Create new secret key
    ボタンをクリックしてキーをメモ
    

    View Slide

13. 一度しか生成されないので
    閉じる前にメモしておきましょう！
    

    View Slide

14. 素の REST API であったり公式の Python や
    Node.js ライブラリが使えます
    

    View Slide

15. 今回はつなぐツールとして Node-RED 使います
    API や IoT につなぎやすい Node.js 製ローコードツール
    

    View Slide

16. Node-RED では chatgpt で調べると
    すでに 3 つもあります
    API ベースでつながるものです
    

    View Slide

17. 今回は node-red-contrib-simple-chatgpt を
    つかってつないでみます
    

    View Slide

18. 作者のがおまるさんの記事がくわしいです
    API Key 入れるだけでサッと使えるところが素敵すぎる
    https://zenn.dev/gaomar/articles/e46cba8e489dfa
    

    View Slide

19. ウォンバットの質問をしてみます
    Web 版ではこう返ってくる。
    

    View Slide

20. こんなフローで質問チャレンジ
    

    View Slide

21. ChatGPT ノードは API Key を Token に設定
    

    View Slide

22. ChatGPT ノードに送り込む質問を
    手前の change ノードで仕込んでおく
    

    View Slide

23. デモしてみます！
    

    View Slide

24. 他のシステムに馴染ませる調整の一例
    ChatGPT さんは回答できるジャンルは万能だけど、あえてルールを決めて回答しやすく特化。
    さらに JSON データに加工して回答してもらい、他のシステムにつなぎやすく。もう人間同士の対話っぽい。
    人間の言葉を理解
    JSON データに
    加工して回答
    ルールを決めて
    回答しやすく特化
    ブラッシュアップ！
    ブラッシュアップ！
    人間の言葉を理解 人間の言葉で回答
    回答ジャンルは万能
    （得手不得手はある）
    ■ChatGPT の基本キャラクター
    ■他のシステムに馴染ませる調整（今回）
    

    View Slide

25. うまく JSON で返ってくる質問の
    試行錯誤をしてみました！
    いい感じのエアコン設定温度を JSON データで返答し HTTP API 的に ChatGPT が答えてくれる質問例のメモ
    https://www.1ft-seabass.jp/memo/2023/03/13/chatgpt-http-api-like-json-response-tips1/
    

    View Slide

26. さらにブラッシュアップしたものがこちら！
    LED への RGB 値を JSON データで返答する ChatGPT API の仕組みを Node-RED でブラッシュアップしたメモ
    https://www.1ft-seabass.jp/memo/2023/03/17/chatgpt-http-api-like-json-response-tips-with-node-red/
    

    View Slide

27. さらにステップアップしたもの
    

    View Slide

28. IoT 指示はこんな風に動作します
    obniz 側で IoT 指示 JSON に応じて動作します
    ● {"type":"on"}
    ○ 機能 : LED がつく
    ○ セリフ : 「おんにして」
    ● {"type":"off"}
    ○ 機能 : LED が消える
    ○ セリフ : 「おふにして」
    ● {"type": "blink", "interval": 1, "count": 3}
    ○ 機能 : 3 回点滅する
    ○ セリフ : 「3回点滅して」
    

    View Slide

29. やってみます！
    

    View Slide

30. ChatGPT API を上手く組み込めました
    人間の言葉を理解
    JSON データに
    加工して回答
    ルールを決めて
    回答しやすく特化
    ブラッシュアップ！
    ブラッシュアップ！
    IoT 制御
    

    View Slide

31. 入り口に音声認識を加えると
    より可能性が広がりました
    人間の言葉を理解
    JSON データに
    加工して回答
    ルールを決めて
    回答しやすく特化
    ブラッシュアップ！
    ブラッシュアップ！
    IoT 制御
    なんらかの音声認識
    

    View Slide

32. HoloLens 2 には音声認識機能があり
    音声を日本語テキストに変換できます
    音声認識機能
    （インターネット経由）
    音声データ
    マイク入力
    テキスト
    日本語
    テキスト
    

    View Slide

33. 音声認識したテキストを ChatGPT API に伝えて
    IoT へ指示する JSON に変換され IoT が動作します
    日本語
    音声認識
    （インターネット経由）
    IoT 指示
    JSON
    自前 Node-RED
    ChatGPT API
    HoloLens2
    IoT
    

    View Slide

34. HoloLens2 の音声認識から ChatGPT 経由の obniz
    への自然な呼びかけで指示できました
    動画をお見せします！
    

    View Slide

35. こちらから動画も見れます
    https://twitter.com/1ft_seabass/status/1635135055503949829
    

    View Slide

36. デモしてみます！
    

    View Slide

37. ここまでしっかりお願いしてると
    GPT3.5 でも 4 でもあんまり変わらない
    http request ノードでピュアに叩くことをしました
    https://www.1ft-seabass.jp/memo/2023/05/02/openai-gpt-4-api-first-step/
    

    View Slide

38. ➔ Node-RED で ChatGPT するノードはいろいろあってとっ
    つきやすい
    ➔ JSON で返すことができると Node-RED に受けて IoT と
    か VR にアレコレと料理ができるのでたのしい
    ➔ Unity で確かに開発できるけど Unity 内で ChatGPT API
    の試行錯誤を直結するのは大変なので Node-RED であれ
    これできるがめっちゃありがたい
    まとめ
    

    View Slide