Googleフォームに定員を簡単に設定する方法

tiger

2024年7月9日 04:50

はじめに

以前書いたこちらの記事でGoogleサービスでイベント管理するシステムを紹介しました

見直してみるとコードがだいぶぐちゃぐちゃだったのと、QRコードを生成するAPIが既に終了しており正常に機能しない事がわかりました。

そこで今回はやることは以前と変わらずより使いやすいようにコードを修正してみましたので紹介します。

このシステムで実現できること

改めてこのシステムではこの６つができます。

Googleフォームの選択肢に定員を設定できる
申し込まれたら自動で定員を更新できる
定員が0になったらフォームに表示しない
申込があったら自動的にメールを返信する
自動返信メールの中に出席に使うQRコードを添付する
出席をQRコードで読み取って出席人数を随時カウントする

どれもデフォルトのGoogleフォームではできない事です。
しかも、本来はゴリゴリプログラムを書かないとできませんが、パラメータの設定だけで実現できるようにしました。

利用するサービス

Googleのサービスを4つ使います。全部無料です。

Googleフォーム（申し込み窓口）
Googleスプレッドシート（回答の収集、イベントの設定、出席情報の収集）
Google Apps Script（Googleフォーム/スプレッドシートのカスタマイズ）
App Sheet（QRコードスキャン）

全体のプロセス

①Googleフォームから回答する

残り何名申し込めるか表示されます。定員に達したら選択肢から消えます。
回答者は任意のイベントを選択して参加の申し込みをします。

②メールが自動返信される

申し込んだ日時が定員に到達していなければ、出席時に使うQRコードが自動で返信されます。このタイミングで残り枠が自動で計算されてフォームの選択肢が更新されます。

③QRコード読み取り

イベント主催者はスマホやタブレットを使ってQRコードを読み取ります。
自動的に出席人数のカウントがされます。

作り方

以下の手順に沿って進めてください。10分ぐらいでできます。

Googleフォームの準備

必須の項目は3つです。あとは好きなものを設定してください。

【必須項目】

名前
メールアドレス
参加日時

※参加日時の選択肢は何も入れないでください。プログラムから自動で書きます。

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

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

↑でリンクしたスプレッドシートに2つシートを追加します。

①イベントを管理するシート（ここではeventsとしています）
シート名は何でもいいですが、項目はこれと同じにしてください。

開催日
曜日
開始時刻
終了時刻
定員
申込人数
出席人数

↑のように開催日時ごとに定員を設定してください。
※申込人数と出席人数は0にしておいてください。後々自動で更新されます。

②出席情報記録シート（ここではattendancesとしています）
シート名は何でもいいです。項目はQRコードにします。

App Sheetの準備

↑で最後に追加した出席情報管理シートで拡張機能 > App Sheetを選択します。

画面左端の一番上のDataタブをクリックして、＋ボタンを押します。

＋ボタンを押すとこのような画面が出てきます。
赤枠で囲ったようにシート名がいくつか出てくるのでさっき設定した「出席情報管理シート」のシート名を選択してください。

Add to appをクリックします。

QRコードをスキャン読み込みできるようにSCAN？の項目にチェックを入れます。
結構右にスクロールすると出てきます。

今度は上から2番目のタブを開いて「Views」をクリックします。

この一番上の＋ボタン「Add View」ボタンを押します。

Create a new viewをクリック

以下の3つを設定する

View name　出席管理とか好きなもので大丈夫です
For this data　出席情報管理シートを選択してください
View type　deckを選択してください

saveする

スマホで開くためにApp Sheetアプリをインストールします。
iOS版　

Android版

ログインしてさっき作ったアプリを開きます。
まだデータが何も登録されてないのでこういう画面になると思います。
右下の＋ボタンを押します。

この画面で赤枠のボタンを押してQRコードリーダーが表示されれば問題ありません。

GASの準備

GoogleスプレッドシートのApp Scriptを開きます。

ライブラリの＋ボタンを押します。
以下のスクリプトIDを検索してライブラリをインストールします。
スクリプトID：1GPAvWkkyiqFUiJJmRTmN41rAsi8e2Mk1Z9nwBc6qedxWA_go8fWcsPgo

以下のプログラムをコピペし、↓の14項目を任意で設定します。

ssId　イベント情報を記録するスプレッドシートのID
eventSheetName　イベント情報を記録するシートの名前
formId　GoogleフォームのID
choicesType　参加日時の質問の形式（multiple or single）
selectParticipantDateQuestionTitle　参加日時を求める質問文
nameQuestionTitle　名前を求める質問文
emailQuestionTitle　メールアドレスを求める質問文
folderId　QRコードを保存するフォルダーのID
subject　メールの件名
body　メールの本文
fromAddress　メールの送信元アドレス
fromName　送信元表示名
cc　CCのアドレス
bcc　BCCのアドレス

※メールの件名と本文で質問文を二重の波括弧{{}}で囲うとその質問に対する回答を挿入できます。
※CCとBCCが複数ある場合はカンマで区切ってください。

// イベント管理アプリをビルド
const ssId = "イベント情報を記録するスプレッドシートのID";
const eventSheetName = "イベント情報を記録するシートの名前";
const eventManagementApp = EventManagementApp.build(ssId, eventSheetName);


/**
 * フォームのイベント選択肢を初期化する
 */
function initializeChoices(){
  const formId = "GoogleフォームのID";
  const choicesType = "参加日時の質問の形式（multiple or single）";
  const selectParticipantDateQuestionTitle = "参加日時を求める質問文";
  eventManagementApp.initializeChoices(formId, selectParticipantDateQuestionTitle, choicesType);
}

/**
 * フォームから回答されたときの処理
 */
function onFormSubmit(e) {
  
  const nameQuestionTitle = "名前を求める質問文";
  const emailQuestionTitle = "メールアドレスを求める質問文";
  const choicesType = "参加日時の質問の形式（multiple or single）";
  const formId = "GoogleフォームのID";
  const selectParticipantDateQuestionTitle = "参加日時を求める質問文";

  const folderId = "QRコードを保存するフォルダーのID";
  const subject = "メールの件名";
  const body = `メールの本文`;
  const fromAddress = "メールの送信元アドレス";
  const fromName = "送信元表示名";
  const cc = "CCのアドレス";
  const bcc = "BCCのアドレス";

  eventManagementApp.acceptApplication(e, nameQuestionTitle, emailQuestionTitle, selectParticipantDateQuestionTitle, formId, choicesType, folderId, subject, body, fromAddress, fromName, cc, bcc);

}

/**
 * 出席情報が記録されたとき
 */
function managedAttendance(e){
  const attendanceSheetName = '出席情報が記録されるシート';
  eventManagementApp.managedAttendance(e, attendanceSheetName);
}