はじめに
AIって機能も付いているので,最新の情報を収集することができます.これをMIT App Inventorで扱います.
MIT App InventorでChatBotを利用したアプリを作成したので,メモとしてここにまとめました.
参考にしたサイト
Gemini公式ドキュメントをもとに開発しました.
Grounding with Google Search
アプリ概要
調べたいことをAIに質問します.それについての解答をAIが返します.この返答にはURLも含まれておる,カフェのサイトや数学の解き方のサイトなど質問にたいする適したリンクが含まれます.また,対話型AIなので質問に対して深堀ができます.
例えば,
- ユーザー;カフェに行きたい
- Gemini:いくつかカフェを提案&どんなカフェ?
- ユーザー:落ち着いていてゆっくりできるカフェがいい!
- Gemini:適したカフェを提案&リンクの提供
こんな風に人間と会話しているような感覚で調べものができるようになります!!!
主な技術
Grounding with Google Search
GeminiでGoogle検索を行う
Gemini公式ドキュメント Grounding with Google Search
Build an interactive chat
対話型でGeminiに質問を行う
Gemini公式ドキュメント Build an interactive chat
interactive chatについて
ここでは対話型のGeminiを使用しています.
MIT App InventorからGenimiを使用する方法(interactive chat)
デザイナー画面
一つのScreenでVerticalArrangement2つ使用して表示・非表示を場合分けを行っています.
VerticalArrangement_gemini
質問の入力,回答の表示画面.
機能 | 内容 |
---|---|
VerticalScrollArrangement1 | Label_text, ListView1, Label_responsText, Label_Historyを含む |
Label_text | Geminiからの解答 |
ListView1 | Geminiが出力したURLのTitle |
Label_responsText | Geminiからのresponseを表示(エラー時に利用) |
Label_History | Button_viewHistoryクリック時に今までの対話の履歴を表示 |
HorizontalArrangement2 | CircularProgress1, Button_viewHistory, Button_Resetを含む |
CircularProgress1 | Geminiのレスポンス待ち時間に表示するクルクル |
Button_viewHistory | 対話履歴の表示 |
Button_Reset | リセット |
Label1 | 表示テキスト「・質問」 |
HorizontalArrangement1 | TextBox_question, Button_sendを含む |
TextBox_question | 質問の入力 |
Button_send | 質問送信ボタン |
VerticalArrangement_jumpURL
機能 | 内容 |
---|---|
WebViewer1 | ListViewでサイトを選択したらここに表示 |
Button_戻る | VerticalArrangement_jumpURLを閉じて,VerticalArrangement_geminiを表示する |
ブロック画面
変数
apukey
url
GeminiへアクセスするURL
https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash:generateContent?key=
history
対話型でGeminiを使用するためにチャットの履歴を残す際につかう変数
text_info
url_info
WebTitle_info
when Screen1. Initialize
スクリーン表示時に,TinyDBに保存しているGeminiとの履歴を取得する.
VerticalArrangement_jumpURLを非表示,VerticalArrangement_geminiを表示する.
when Button_viewHistory
when Button_send. Click
when Web1. GotText
when ListView1. AfterPicking
サイトのタイトルをクリックしたら,webviewerでそれを表示する.
when Button_戻る. Click
実行結果
もう一度質問すると,前回の質問に合わせた回答が返ってきます.
おわりに
ノーコードでここまで作れるの楽しすぎる!