Google カレンダーは使わない！？小学校でも使える三者面談予約システム！

けいすけ

2023年1月18日 22:03

１月ももう半ば。このままあっという間に年度末となるのでは..とビクビクしています。

個人的に運営している YoutTube チャンネルのコメントで...。

「Google カレンダーが制限されて使えないけど面談予約をオンラインでやりたい」

というお悩みを受けて、作ってみました。

どこまで需要があるかわかりませんが笑
Google カレンダーは管理コンソールで云々はいろんな事情があるかと思いますので、その辺りの議論はしません。

今回は、Google カレンダーを使わないという縛りで、スケジュール予約機能を再現しようという勉強と人助けのつもりです。

今回は、Google フォームと Google スプレッドシートを使って、

保護者・三者面談の予約システム

を作ってみたいと思います！！

[1-1] Google フォームの準備

下記をクリックすると、新しいフォームを作成できます！

質問項目はこのようにしてください。

クラス：プルダウンでクラスを選択できるように！
出席番号：プルダウンで番号を選択できるように！
児童生徒氏名：記述式
来校予定保護者氏名：記述式
希望日：4/15のように、月日だけの選択肢を用意しておきます！
希望時間：15:00〜15:30 のように、時間だけの選択肢を用意しておきます！
備考：記述式

こんな感じになりますね！

クラスと番号はプルダウンにしておくと、後で回答結果を扱いやすくなります！

また、今回の使い方的には、月日と時間を別々に集めることが必要になります。
これも記述式で入力してもらうのではなく、既に決めてある時間を選択する形にすると、データを扱いやすくなります！

また、プルダウンがおすすめです！
見た目がすっきりするので！👍

[1-2] Google フォームの設定

「回答」の「メールアドレスを収集する」をオンにしてください！

想定的には、同じクラスに双子もいるかもしれないので、「回答を１回に制限する」はオンにしなくてもいいかなって思います。

メールアドレスは、後で予約成立か不成立かを送る必要があるので、オンにしておいてください！

次に、「プレゼンテーション」で、「確認メッセージ」の「編集」をクリックして、フォーム送信後に表示されるメッセージを変更しましょう！

編集後は、必ず「保存」をクリックしてください！

これでフォームの準備は完了です！

それでは、スプレッドシートの準備をしましょう！

[2] Google スプレッドシートの準備

↓からプログラム入りのスプレッドシートをコピーできます！

今回は、表を作ったりするのが手間なので配布してしまいますね！

↑のようなシートが用意されています！

保護者用カレンダーと教師用カレンダーです。

また後で記述しますし、動画内でも説明しているのですが。
実際に運用するときは、別々のスプレッドシートでこの保護者用と教師用を分けて、共有の権限を設定しておいた方がいいですね！

教師用は、児童生徒の氏名を知りたいけど、保護者用は見せたくない場合がありますからね。

[3] フォームとの連携

それでは、先ほど作成したフォームと連携をしましょう。

「回答」の「スプレッドシートにリンク」をクリックしてください。

「既存のスプレッドシートを選択」にチェックを入れて、「選択」をクリックします。

先ほどコピーしてもらった、スプレッドシートをクリックして、左下の「選択」をクリックしましょう！

「フォームの回答」というシートができて、連携が完了です！

「フォームの回答」の横に数字がつきますが、気にしないでください😅
連携と解除を繰り返すと数字がカウントされてしまうのです。
この記事を書いた時点では、５回目の連携という意味になっています。

テストを繰り返した証です….🤣笑

[4] スクリプトの確認

「拡張機能」⇨「Apps Script」をクリックしてください！

入っているのは、

function onFormSubmit(e) {
  // フォームの回答を取得
  var timeStamp = e.values[0];// タイムスタンプ
  var Email = e.values[1];//メールアドレス
  var classroom = e.values[2];//クラス
  var num = e.values[3];// 児童番号
  var student = e.values[4];//児童氏名
  var name = e.values[5];// 保護者氏名
  var reserveDate = e.values[6];// 予約日
  var reserveTime = e.values[7];// 予約時間
  var remarks = e.values[8];// 備考

  var spreadsheet = SpreadsheetApp.getActiveSpreadsheet();//スプレッドシートを有効にする
  //var sheet = SpreadsheetApp.openById('ここにスプレッドシートのID').getSheetByName('ここにシートの名前');//他のスプレッドシートを取得する場合
  var sheet = spreadsheet.getSheetByName('保護者用カレンダー');//ここから各クラスのシートを取得
  var sht = spreadsheet.getSheetByName('教師用カレンダー');//ここから各クラスのシートを取得
  var data = sheet.getDataRange().getValues();

 //該当の日時を検索して、そのカラム番号、列番号を取得
  for (var i = 0; i < data.length; i++) {
    for (var j = 0; j < data[i].length; j++) {
      if (data[i][j] == reserveDate) {
        dataColumn = j+1;
      }
      else if(data[i][j] == reserveTime){
        dataRow = i+1;
      }
      }
    }

  var schedule = sheet.getRange(dataRow,dataColumn).getValue();//保護者用のカレンダーの該当セルの値を取得
  var teachercal = sht.getRange(dataRow,dataColumn).getValue();//教師用のカレンダーの該当セルの値を取得

//保護者用カレンダーへの入力と、保護者への予約完了または失敗メールの送信
  if(schedule == ''){
    sheet.getRange(dataRow,dataColumn).setValue('予約あり');
    // 自動返信メール件名
    let Subject = name + '様　ご予約完了';
    // 自動返信メール本文
    let Body = name+ ' 様\n ' + 
    "\n" + 
    '三者面談を承りました。\n' + 
    "ありがとうございました。\n\n" + reserveDate + '\n'+ reserveTime +'\nです。';
    // メール送信
    MailApp.sendEmail(Email,Subject,Body);
  } else {
    // 自動返信メール件名
    let Subject = name + '様　ご予約失敗';
    // 自動返信メール本文
    let Body = name+'様　\n' + 
    '\n' + 
    'ご希望いただいた日程がすでに埋まっているためご予約を完了できませんでした。\n' + 
    '別の日程を再度入力いただきますようお願いいたします。\n' + 
    'ありがとうございました。';
    // メール送信
    MailApp.sendEmail(Email,Subject,Body);
  }
  
//教師用カレンダーへの入力と、教師へのリマインドメールの送信
  if(teachercal == ''){
    sht.getRange(dataRow,dataColumn).setValue(student);
    let mail = ''//送りたいアドレス　教師を想定しています。
    // 自動返信メール件名
    let Subject = student + 'さん 三者面談予約';
    // 自動返信メール本文
    let Body = student　+ ' さんの保護者　\n' + name + '様から三者面談の予定が入りました。\n' +
    reserveDate + '\n'+ reserveTime +'\nです。\n\n' +
    '備考\n'+remarks;
    // メール送信
    MailApp.sendEmail(mail,Subject,Body);
    return;
  }
}

それでは、メールアドレスの設定をしてください。
これから設定するアドレスには、予約が入ったときに予約の情報を担当者（担任の先生など）へのメールの送り先になります！

62行目です！
この ' ' の中にアドレスを入れてください！

    let mail = ''//送りたいアドレス　教師を想定しています。

[5] 実行

それでは、💾（保存）⇨▶️（実行）をクリックします。

権限の承認が出てくると思いますので、許可をしてくださいね！

このようなエラーが出ても大丈夫です。

上記は、データがありませんよ！
という感じのエラーなんですけど。

そもそも、Google フォームに入力されたデータを使うようになっていますので、今はまだ入ってませんもんね👍

[6] トリガーの設定

左側にある⏰（トリガー）をクリックします。

右下の「トリガーを追加」をクリックします。

「イベントの種類を選択」を「フォーム送信時」にして、

「保存」をクリックします。

これで準備完了です！

[7] テスト

フォームの右上にある👁（プレビュー）をクリックして、テストをしてみましょう！

保護者用のカレンダーには、予約あり
教師用のカレンダーには、児童生徒氏名

が入るはずです！

そして、もし間違えて予約が入ってしまっているところを選ぶとエラーが出るはずです。

このような感じで、こんなことができたらいいなとか。
普段手作業で行っている作業も、ちょっとした工夫で効率的になると思います。

そうすると、先生方の貴重な時間が児童生徒との対話や活動に充てることができると思うんですよね。
その方がICT云々とは比べ物にならないくらい大事だと、ボクは思うんです。

こんな悩みなんて...と思わずに！
素朴な悩みなどなど、ぜひ共有してください！😆✨

Ver.1 の動画

Ver.2 の動画

Ver.3 の動画

Ver.4 の動画

Twitter

Tweets by keisuke_edu

Facebook

ポートフォリオ

YouTube チャンネル

いちばんやさしい Google Apps Script

いいなと思ったら応援しよう！

何かと０から１を作るのは大変だと思います。学校はどこも似たような問題課題に対応していると思います。それなのに、先生って自分だけで頑張ろうとするんですよね。ボクの資料やnoteが１になって、学校ごとの現状に合わせてカスタムしていただければと思います‼️

Google カレンダー は使わない！？小学校でも使える三者面談予約システム！

[1-1] Google フォーム の準備

[1-2] Google フォーム の設定

[2] Google スプレッドシート の準備