🤖 ChatBot-edu
スプレッドシート版 ＋ 生成AI対応
セットアップ・操作マニュアル
スプレッドシート版 ＋ 生成AI対応
セットアップ・操作マニュアルChatBot-edu は、Googleスプレッドシートをデータベースとして利用するチャットボット作成・管理システムです。プログラミング不要で、先生がすぐに授業で使えるよう設計されています。
生徒が入力したキーワードに対して、テキスト・画像・サイトリンクを返すチャットボットを作成できます。
ビジュアルプログラミングツール「Blockly」でチャットボットの会話フローを設計できます。
Azure OpenAIと連携してAIが自動応答する機能も利用できます（APIキーが必要）。
生徒のチャット履歴を自動保存。アンケートフォームの回答も一覧で確認できます。
| 画面 | 対象 | 主な機能 |
|---|---|---|
| 教師用ダッシュボード | 先生 | 全グループ（個人・班）のキーワード・ログ・レビューを一覧表示・管理 |
| 編集ページ | 生徒（個人または班） | キーワードの追加・削除、Blocklyでフロー設計、デプロイ |
| チャットボット画面 | 生徒（利用者） | 作成したチャットボットとの対話 |
このシステムには以下のテンプレートが含まれています。セットアップ時に自動的にコピーされます。
・キーワードシートテンプレート（Googleスプレッドシート）
・アンケートフォームテンプレート（Googleフォーム）
スプレッドシートのコピー → env設定 → デプロイ＆URL取得 → クラス生成 → フォーム公開 → URL配布
配布されたURLにアクセスすると、自動的に「ドキュメントのコピー」画面が表示されます。
URLの末尾が /copy になっているので、開くだけで自動的にコピー画面になります。
以下のような画面が表示されます。「コピーを作成」ボタンをクリックしてください。Apps Scriptも一緒にコピーされます。
コピーしたスプレッドシートを使って作業してください。元のファイルは編集しないでください。
「コピーを作成」すると自動でコピーが開きます。これ以降はコピーしたファイルで作業します。スプレッドシートを開くと自動的に 「チャットボット管理」メニューが追加され、envシートが作成されます。
スプレッドシート下部の 「env」タブ をクリックして開きます。黄色でハイライトされているセル（B列）が入力必須項目です。
| キー（A列） | 入力内容（B列） | 種別 |
|---|---|---|
PassPhrase |
教師がログインするときの合言葉（半角英数字） 例: school2025 |
必須 |
TargetYear |
授業を実施する年度（西暦） 例: 2025 |
必須 |
TargetGrade |
授業を実施する学年（数字） 例: 3 |
必須 |
TargetSemester |
授業を実施する学期（数字） 例: 1 |
必須 |
SheetTemplateURL |
キーワードシートのテンプレートURL （配布されたURLを貼り付け） |
必須 |
FormTemplateURL |
アンケートフォームのテンプレートURL （配布されたURLがあらかじめ入力済みです） |
必須 |
ClassSheetSuffix |
クラスシートのタブ名末尾文字 「組」と入力すると「1組」「2組」になります |
任意 |
AZURE_ENDPOINT |
Azure OpenAIのエンドポイントURL ⚠️ 空欄のままにすると、生徒の編集ページに「生成AI」ブロックが表示されません。生成AIを使わない授業ではそのまま空欄でOKです。 |
任意 |
AZURE_API_KEY |
Azure OpenAIのAPIキー AZURE_ENDPOINTを設定する場合は必須 |
任意 |
AZURE_DEPLOYMENT |
Azure OpenAIのデプロイ名 例: gpt-4o ／ AZURE_ENDPOINTを設定する場合は必須 |
任意 |
ChatbotOriginURL |
デプロイ後に自動入力されます | 自動設定 |
クラス生成前にデプロイを完了させることで、生成時から正しいURLが自動的に入力されます。
スプレッドシートのメニュー「拡張機能」→「Apps Script」をクリックします。
歯車アイコンをクリックして「ウェブアプリ」を選択し、以下のように設定します。
| 項目 | 設定値 |
|---|---|
| 次のユーザーとして実行 | 自分（自分のGoogleアカウント） |
| アクセスできるユーザー | 全員 |
「デプロイ」ボタンを押すと、初回のみGoogleアカウントの認証画面が表示されます。以下の手順で進んでください。
「このアプリは確認されていません」と表示されますが、これは自分でコピーしたスクリプトのため正常です。「詳細」→「安全ではないページに移動」の手順で進んでください。
認証完了後、ウェブアプリのURLが表示されます。このURLをコピーしてください。
このURLは次の手順で使用します。必ずコピーしてください。
スプレッドシートに戻り、メニュー「チャットボット管理」→「GASウェブアプリURLを更新」をクリックします。ダイアログが表示されたら、コピーしたURLを貼り付けて「OK」をクリックします。
これによりenvシートの ChatbotOriginURL にURLが保存され、次のクラス生成時に自動で使用されます。
スプレッドシート上部のメニュー「チャットボット管理」→「クラス設定」→「クラスを生成」をクリックします。
ダイアログが表示されます。生成したいクラスの番号を入力してください。
そのクラスのグループ数（個人制作の場合は人数）を入力します（1〜50）。
生成処理には時間がかかります（グループ数×数秒程度）。完了するまで待ってください。
完了すると「○組 ○班分の生成が完了しました」と表示されます。スプレッドシートに クラスシート（「1組」など）が追加されていることを確認してください。
Googleドライブにも「Chatbot」フォルダが自動作成され、各グループ（個人）のキーワードシートとフォームが保存されます。
クラス生成時に各グループ（個人）のGoogleフォームが自動作成されます。フォルダの共有設定とフォームの公開を行います。
クラス生成時にGoogleドライブに自動作成される「Chatbot」フォルダを、「リンクを知っている全員が編集可能」に設定します。
この設定をしないと、生徒がキーワードシートやフォームを編集できません。
スプレッドシートのクラスシート（例：「1組」タブ）を開き、C列に表示されている各グループ（個人）のフォームURLを一つずつクリックして開きます。
グループ（個人）の数だけフォームがあります。全員分（全行）繰り返してください。
Googleフォームが開いたら、画面上部の 「公開」 ボタンをクリックし、公開設定を確認して 「公開」 を押します。
「公開」にしないと生徒がアンケートフォームに回答できません。全グループ（全員）分必ず行ってください。
クラスシート（「1組」など）を開くと、各グループ（個人）のURLが一覧で確認できます。
以下の4つのURLを各グループ（個人または班）に配布してください。すべて最低限必要です。
| 列 | 内容 | 用途・説明 |
|---|---|---|
| B列 （スプレッドシート） |
キーワードシートURL | チャットボットが返答するキーワードと内容を登録するGoogleスプレッドシートです。生徒はここにデータを入力します。 |
| D列 （画像フォルダ） |
Googleドライブ 画像フォルダURL | チャットボットで使用する画像ファイルをアップロードするGoogleドライブのフォルダです。キーワードシートで画像を参照する場合はここにアップロードします。 |
| H列 （editUrl） |
編集ページURL | キーワード登録・Blocklyによるフロー設計を行うページです。チャットボットを作る生徒（個人または班のメンバー）が使います。ログインには先生から配布された「合言葉（PassPhrase）」が必要です。 |
| I列 （implUrl） |
実装ページURL | 完成したチャットボットを実際に使う画面です。チャットボットを使うユーザー（他の生徒・発表相手など）に配布します。 |
各URLはクラスシートのセルをコピーして、Google Classroomや学校のチャットツールで配布してください。
編集ページへのログインには「合言葉（PassPhrase）」のみ必要です。先生が設定した合言葉も一緒に配布してください。
教師用ダッシュボードは、全グループ（個人・班）のチャットボット状況を一覧で確認・管理できる画面です。
STEP 3 でデプロイした際に取得した ウェブアプリのURL（末尾が /exec のURL） をブラウザで開くと、教師用ダッシュボードが表示されます。
このURLはenvシートの ChatbotOriginURL にも保存されています。
| 操作 | 説明 |
|---|---|
| 期間（開始〜終了） | 指定した日付範囲のログのみ表示します |
| 組ボタン（全組 / 1組 / 2組…） | 表示するクラスを切り替えます |
| 絞り込み | フィルターを適用します |
| 🔄 更新 | 最新データを再読み込みします |
各グループ（個人・班）が1枚のカードとして表示されます。カード右上のバッジでデプロイ状況がわかります。
| バッジ | 意味 |
|---|---|
| デプロイ済 | Blocklyフローが公開（デプロイ）されています |
| 未デプロイ | まだチャットボットが公開されていません |
カード内の数字はそれぞれ：
| 表示 | 内容 |
|---|---|
| 🔑 キーワード | 登録されているキーワードの総数 |
| 📋 ログ | チャットセッションの件数 |
| ⭐ レビュー | アンケート回答の件数 |
| ボタン | 機能 |
|---|---|
| 👁 詳細 | キーワード・ログ・レビューの詳細を別ウィンドウで表示 |
| ✏️ 編集 | そのグループ（個人）の編集ページを開く（別タブ） |
| ▶ 実装 | そのグループ（個人）のチャットボット画面を開く（別タブ） |
3つのタブで各種データを確認できます。
🔑 キーワードタブ
| 操作 | 説明 |
|---|---|
| キーワード一覧 | 登録済みのキーワードと返答テキストが一覧表示されます |
| 🖼 画像アイコン | 色付き（緑）= 画像あり、灰色 = 画像なし |
| 🔗 リンクアイコン | 色付き（青）= サイトURLあり、灰色 = なし |
| 🗑 削除 | そのキーワードを削除します |
📋 ログタブ
| 操作 | 説明 |
|---|---|
| セッション一覧 | ニックネーム・開始日時・メッセージ数が表示されます |
| セッションをクリック | 会話内容を展開・折りたたみします |
| 🗑 削除 | そのセッションを削除します |
| 🗑 全セッション削除 | そのグループ（個人）の全ログを削除します |
⭐ レビュータブ
| 表示 | 説明 |
|---|---|
| ドーナツチャート | 選択式の質問の回答分布をグラフ表示します |
| コメント一覧 | 自由記述の回答が一覧表示されます。クリックで詳細表示 |
編集ページは生徒がチャットボットのキーワードや会話フローを設定するページです。
先生から配布された「editUrl」を開きます。
画面右上の「編集許可」ボタンを押すと合言葉の入力ダイアログが表示されます。
先生から配布された合言葉（PassPhrase）を入力します。認証が通ると編集が可能になります。
合言葉はenvシートの「PassPhrase」に先生が設定した文字列です。クラス全員共通です。
| 操作 | 説明 |
|---|---|
| キーワード一覧 | 登録済みのキーワードが表示されます。クリックで編集できます |
| キーワード追加ボタン | 新しいキーワードと返答を登録します |
| キーワード（必須） | 生徒が入力する言葉（例：「天気」） |
| 返答テキスト | ボットが返す文章 |
| 画像URL（任意） | GoogleドライブやWebの画像URLを入力すると画像で返答できます |
| サイトURL（任意） | 関連サイトのURLを入力するとリンクが表示されます |
| 🗑 削除 | そのキーワードを削除します |
チャットボットの会話の流れをビジュアルブロックで設計できます。
主なブロックの種類：
| ブロック | 色 | 説明 |
|---|---|---|
| シナリオ | 紫 | 会話シナリオの起点。番号で管理します |
| ボット出力 | 黄 | ボットが固定テキストを発言します |
| ユーザー入力 | 赤 | ユーザーの入力を待ちます |
| 分岐 | 青 | 入力値に応じて処理を分けます |
| データベース参照 | 緑 | キーワードシートを検索して返答します |
| 生成AI | 薄紫 | Azure OpenAI で自動応答します。 ※ envシートの AZURE_ENDPOINT が空欄の場合はこのブロックは表示されません |
| シナリオジャンプ | 水色 | 別のシナリオ番号に飛びます |
| 終了 | 赤 | チャットボットを終了してアンケートへ誘導します |
| 画像認識 | 青緑 | カメラを起動してTeachable Machineで画像認識を行います（modelURLの入力が必要） |
「保存操作」メニューのボタン：（編集許可後に表示されます）
| ボタン | 機能 |
|---|---|
| ブロック保存 | 現在のフローを保存します（チャットボットには反映されません） |
| プログラムの更新 | フローをチャットボット画面に公開します |
実装ページは、完成したチャットボットを実際に使う画面です。URLにアクセスするだけで利用できます。
先生から配布された「implUrl」を開きます。データ読み込み中はローディング画面が表示されます。または編集ページの「実装ページへ」ボタンを押すこと。
チャット開始前にニックネームの入力を求められます。ログやアンケートでの識別に使われます。入力後「開始する」をクリックします。
画面下部のテキスト入力欄にメッセージを入力して Enterキー または送信ボタン（➤）を押します。ボットが返答します。
「終了」ブロックに到達すると「ご利用ありがとうございました」のメッセージとアンケートURLが表示されます。ニックネームをアンケートに入力して回答します。
| 部分 | 説明 |
|---|---|
| ヘッダー（上部） | 年度・学年・学期・組・グループ番号（班番号）が表示されます |
| メッセージエリア | ボットの発言（左・白）とユーザーの発言（右・緑）が表示されます |
| テキスト入力欄（下部） | メッセージを入力する欄です。ボットが入力待ちのときのみ有効になります |
| 送信ボタン（➤） | 入力したメッセージを送信します。Enterキーでも送信できます |
| 症状 | 原因・対処法 |
|---|---|
| 「必須の環境変数が未定義です」と表示される | envシートの必須項目（黄色セル）が入力されていません。PassPhrase・年度・学年・学期・テンプレートURLを入力してください。 |
| クラス生成時にドライブのエラーが出る | FormTemplateURLに/viewformのURLを使っていないか確認してください。編集用URL（/edit）を使用してください。 |
| URLにアクセスしても「ファイルを開けません」と表示される | デプロイが完了していないか、URLが古い可能性があります。「GASウェブアプリURLを更新」→「編集URL・実装URLを再生成」を実行してください。 |
| 「チャットボット管理」メニューが表示されない | スプレッドシートを一度閉じて開き直してください。また、初回はGoogle権限の承認ダイアログが表示される場合があります。 |
| 症状 | 原因・対処法 |
|---|---|
| 「パスフレーズが正しくありません」と表示される | envシートのPassPhraseと入力した合言葉が一致しているか確認してください。前後にスペースが入っていないか注意してください。 |
| 教師ページが「読み込み中」から変わらない | クラス生成が完了していない可能性があります。STEP 3のクラス生成を先に完了させてください。 |
| Blocklyのデプロイ後もチャットボットに反映されない | ページを再読み込みしてください。また「保存操作」→「プログラムの更新」を押しているか確認してください（「ブロック保存」では反映されません）。 |
| 症状 | 原因・対処法 |
|---|---|
| 入力しても返答がない | キーワードが登録されていないか、入力した言葉がキーワードと完全一致していない可能性があります。全角・半角の違いにも注意してください（自動変換されます）。 |
| 画像が表示されない | Googleドライブの画像は共有設定を「リンクを知っている全員が閲覧可」にする必要があります。 |
| 生成AIが応答しない | envシートのAZURE_ENDPOINT・AZURE_API_KEY・AZURE_DEPLOYMENTが正しく設定されているか確認してください。 |