XRミーティング 20231018

XRミーティング 20231018「XREAL Air で Whisper API 音声文字起こしして ChatGPT API とやり取りした試行錯誤」の登壇資料です。

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

・シルエットデザイン 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. 20231018_XRMTG 20231018 XREAL Air で Whisper API 音声文字起こしして ChatGPT API とやり取りした試行錯誤 ワンフットシーバス 田中正吾
2. 私の話はスライドを後ほど共有します。 話す内容に注力いただいて大丈夫です！
3. 10 分くらいで話します！
4. 田中正吾（たなかせいご） 屋号：ワンフットシーバス 2004年よりフリーランス。以後、FLASH制作を 中心にインタラクティブコンテンツを主に行い現 在に至る。 最近ではWEBフロントエンドをベースにしなが らも、情報とインターフェースが合わさるアプ ローチという視点でIoTやMixed Realityといった 技術も取り入れながら活動しています。
5. SPACEE スペイシー でレンタルした 作業スペースからお送りしております 御茶ノ水にて講師を終えて駅前に直行しております
6. XREAL Air の話
7. XREAL Air で音声認識できたので その内容を ChatGPT に質問してみます
8. XREAL Air のマイク入力を Whisper で 文字起こしして ChatGPT に回答してもらう仕組み Whisper API ChatGPT API Unity マイク入力 WAVデータ 文字起こし 質問 回答
9. こんな風に動きます https://twitter.com/1ft_seabass/status/1709741731955277998
10. XREAL Air 内のやり取りを Node-RED で Web に流して、みなさんに共有します！ XREAL Air Node-RED
11. それではスタート！
12. 試行錯誤とかがんばったところ
13. AI 面のポイントは AIMTG で話してきました こちらがスライドです https://speakerdeck.com/1ftseabass/ai-meeting-20231011
14. Unity での文字起こし＋ ChatGPT の 知見についてはこちら XREAL Air 固有のところは少なめで助かった。マイクデバイス名の指定くらい。 https://www.1ft-seabass.jp/memo/2023/10/05/unity-with-whisper-api-and-chatgpt-api/
15. XREAL Air 固有の連携は こちらの記事にまとめてあります XREAL Air からマイク録音して音データを Whisper API で文字起こしして ChatGPT API とやり取りするメモ https://www.1ft-seabass.jp/memo/2023/10/17/xreal-air-with-whisper-api-and-chatgpt-api/
16. XREAL Air のように入手しやすいデバイスで 音声文字起こし＋ChatGPT 連携は可能性を感じる！
17. あとは使い勝手をよくするところで いろいろとやってみました！ ユーザーインター フェース （使い勝手）
18. 録音中→文字起こし中→結果表示の仕組みで 操作中がだいぶわかりやすくなった。待てる。 いずれは赤丸の録音表示とかを右上に出したらいいなと思ってる
19. ChatGPTさん・自分と会話が並ぶようにして やり取りがわかりやすく 会話っぽく出るのはよい。もちろん ChatGPT へのアクセス中も出してるので表示まで待てる。
20. 録音＆停止機能を巨大 Canvas 2D ボタンを 実装してだいぶ動作させやすくなった しかしそれでもカーソルを当てる手間や画面外にカーソルがあるとコケやすい
21. 巨大 Canvas 2D ボタンの実装 基本的には公式チュートリアル参考。カーソルが当たるために Z 軸に引いた位置の調整大事。 あとはボタンのカラーを透明にしつつ Cull Transparent Mesh を ON で描画負荷がかからない対応。 https://xreal.gitbook.io/nrsdk/development/input-and-camera/interact-with-unity-ui-tutorial
22. さらにカスタム UI でスマホ側の APP ボタンに 録音→停止を仕込んだら使いやすく実装できた！ https://xreal.gitbook.io/nrsdk/development/input-and-camera/customize-phone-controller APPボタン
23. APPボタン APP ボタンの実装 NRVirtualDisplayer を入れて Prefab ほどいて APP ボタンの OnClick に関数割り当て 操作しやすーい！
24. XREAL Air はセンサー的に空間連携はしないので 追従 2D できっちり UI 出すのアリ。良い感じ。 3D UI 出しても空間連携しないのでスマホ UI のカーソルで 2D 的に動かすことになる 3D 追従 2D
25. Unity 内で C# のコードで ChatGPT のキャラ付け してるけど試行錯誤が大変なので今後よくする 書き換えてはビルドして試してる手間がある。 Node-RED なり外部サーバーで ChatGPT 挙動作った方が試行錯誤はしやすそう。
26. XREAL Air 2 や XREAL Air 2 Pro だと 屋外とか光が強い場でも見やすいとかありそう 使える場所が屋内から広がるかもしれなくて面白い
27. IBM TechXchange Conference Japan で このあたりもデモ＆登壇してきます～ https://www.ibm.com/jp-ja/events/techxchange ハッシュタグ：#IBMTechXchange
28. ➔ 文字起こし＋ChatGPT回答の連携はいい感じに実装でき た。うれしい！ ➔ より使い勝手をよくするために、いろいろとユーザーイン ターフェースのところで実装ポイント見えてきた！ ➔ カスタム UI のように XREAL 固有の操作実装に関して、 今回の仕組みにも良い流れが作れた！ ➔ XREAL Air のように入手しやすいデバイスで音声文字起こ し＋ChatGPT 連携は可能性を感じる！ まとめ