【テンプレあり】kintoneを活用しカレンダーから日付を選択して予約/申込みシステムを作成する方法！
「セミナーの申込みフォームを作りたいけど、定員に達したら自動で受付を終了できないかな…」
「カレンダーから日付を選んで予約できるシステムが欲しいけど、残り枠数がリアルタイムで分からなくて困っている」
そんなお悩みをお持ちの方に朗報です！
kintoneと連携サービスを使えば、専門的なプログラミング知識がなくても、カレンダーから日付を選択できる本格的な予約・申込みシステムを構築できます。しかも、「現在の申込数」や「残り枠数」をリアルタイムで自動計算し、定員に達したら自動的にカレンダーから非表示にすることも可能です。
本記事では、kintoneと、kintone連携サービス「FormBridge」「kViewer」「DataCollect」を組み合わせた予約システムの作り方を、実際の画面を交えながら詳しく解説します。テンプレートも用意していますので、すぐに自社の環境で試すことができます。
この記事を読んでできること
◆ カレンダーから日付を選択して予約/申込みができる
・さらに、満席になったらカレンダーからもう申し込めないように表示を消すこともできます。
◆ リアルタイムで申込み状況がわかる
・申込数が現在何名なのか、残り席数はいくつなのか、をリアルタイムで確認できます。
目次
予約システム、申込みシステムについて
会社名や参加者名がkintoneに貯まる予約システム・申込システムは、kintoneとFormBridge、kViewer、DataCollectを活用することで簡単に作れます。
- FormBridge：外部からkintoneにリアルタイムでレコードを追加できるkintone連携サービス
- kViewer：kintoneの情報を外部に公開できるkintone連携サービス
- DataCollect：複数アプリの情報をカンタンに収集・計算・加工できるkintone連携サービス
今回はセミナー申込を例に申込みシステムの作り方を解説します。
FormBridgeとkViewerで作成した予約システム、申込みシステムだとできない2つのこと
FormBridgeとkViewerで作成した予約システム、申込みシステムでは以下のことができません。
「現在の申込数」がわからない
FormBridgeの管理者であれば管理画面で「回答数」を確認することができますが、その後のキャンセル連絡などで正確に「現在の申込数」を確認することはできません。
FormBridgeの管理画面
kintoneの申込み管理アプリ
この場合、不参加者を除いた一覧から正確な「現在の申込数」はkintoneの一覧画面でしか把握できません。
さらにカレンダービューに「現在の申込数」を表示することはできません。
一覧から「現在の申込数」を把握するしかない。
「残りの空き状況」が把握できない
参加上限数や応募数をカレンダーに表示させることは可能ですが、
「セミナー日程管理アプリ」と「セミナー申込者管理アプリ」2つで情報を管理している為、
「残りの空き状況」がいくつなのかを把握することはできません。
現在の申し込み数と残りの空き状況を把握するなら「DataCollect」
「DataCollect」はExcelのように関数を使ってkintoneアプリ間の計算ができるサービスです。
Excelと同じ感覚で、複数のアプリから情報の収集・計算が可能！
サンプルアプリと設定方法の詳細について
この記事で紹介したアプリとほぼ同じものをそのままkintone環境に展開できるアプリテンプレートと、詳細な設定方法をヘルプサイトに公開しております。
【FormBridge×kViewer×DataCollect】セミナー予約システムで、リアルタイムに「現在の申込数」「残り枠数」を管理する
無料お試しをお申し込みいただいた際は、こちらぜひご活用ください。
用意するアプリとアプリの構造
今回は◆「セミナー日程管理アプリ」と◆「セミナー申込み管理アプリ」の2つのアプリを用意します。
ここまではFormBridge×kViewerで作成する予約システムと同じです。
アプリの構造をご紹介します。
◆セミナー日程管理アプリ
| フィールド名 | フィールドタイプ |
| 開催日 | ドロップダウン |
| 開始日時 | 日時 |
| 終了日時 | 日時 |
| 参加上限人数 | 文字列(1行) |
| 申込数 | 文字列(1行) |
| 残り枠 | 数値 |
| セミナー名 | 文字列(1行) |
| 登壇者 | 複数選択 |
| セミナー形式 | ラジオボタン |
| 主催 | 文字列(1行) |
| 共催1 | 文字列(1行) |
| 共催2 | 文字列(1行) |
| 共催3 | 文字列(1行) |
| セミナー概要 | 文字列(複数行) |
| 申込みページ | リンク |
◆セミナー申込み管理アプリ
| フィールド名 | フィールドタイプ |
| 開催日 | ドロップダウン |
| 参加/不参加 | ラジオボタン |
| 会社名 | 文字列(1行) |
| 部署名 | 文字列(1行) |
| 名前 | 文字列(1行) |
| 電話番号 | 文字列(1行) |
| メールアドレス | 文字列(1行) |
| 興味ある製品 | チェックボックス |
| 個人情報保護方針 | チェックボックス |
| kintone導入状況 | ラジオボタン |
あくまで当社で管理する場合はということをご承知おきください。
FormBridge・kViewer・DataCollectの設定方法のご紹介
設定手順です。
①「◆セミナー日程管理アプリ」からカレンダービューを作成します。
kViewerの「メインコンテンツ」と「レコード詳細」の設定
②「◆セミナー日程管理アプリ」から申込みフォームを作成します。
その時、カレンダービューで表示させているフィールドなどは「編集不可にする」設定にします。
フィールド設定で、カレンダービューで表示させている項目は「フィールドを表示しない」「編集不可」の設定にする。
③公開フォームのURLをコピーし、カレンダービューでFormBridge連携を設定します。
「FormBridgeと連携する」の公開フォームにURLをペーストします。この時、ボタンのラベルを「申し込む」などにするとわかりやすいかと思います。
これで、レコード詳細から「申し込む」をクリックしてフォームに遷移します。
④FormBridgeの「回答保存プロセス」から”kintoneアプリへの保存”の処理を追加し、
「◆セミナー申込み管理アプリ」にデータを保存する為の設定を追加します。
※既にある「セミナー日程管理アプリ」への保存の処理に加え、 「セミナー申込み管理アプリ」へ保存処理が追加されて ”kintoneアプリに保存”の設定が２つになりました。
⑤「フィールド設定」の”kintoneアプリからフィールドを同期”より、「◆セミナー申込み管理アプリ」へ登録が必要な項目を追加します。
⑥「◆セミナー日程管理アプリ」から作成したビューに編集を掛けた後（実際には何も編集されない）、
「◆セミナー申込み管理アプリ」へ新規レコードを追加する設定にします。
「◆セミナー日程管理アプリ」のフィールドが編集されてしまわないように、kintoneの保存先フィールドを全て削除して保存する。
「◆セミナー申込み管理アプリ」へ新規レコードを追加するため、 保存先が正しく設定されているか確認する。
⑦kViewerの「レコードの絞り込み/並び替え」で「残り枠」が0より大きい場合のみ
カレンダーには表示させるという設定にします。
「残り枠」「>」「0」
ここまでがFormBridgeとkViewerの設定になります。
そして、ここから「DataCollect」を設定して「現在の申込数」と「残り枠」を算出していきます。
今回、「◆セミナー日程管理アプリ」の「現在の申込数」と「残り枠」を算出したいので
フィールド式は「◆セミナー日程管理アプリ」に設定をし、「◆セミナー申込み管理アプリ」を参照元とします。
フィールド式の設定は以下の通りです。
「申込数」
=COUNTIFS(セミナー申込み管理!参加_不参加,”参加”,セミナー申込み管理!開催日,開催日)
「残り枠」
= 参加上限人数-申込数
フィールド式の設定
さらにDataCollectで自動更新(webhook)の設定も追加します。
「レコード追加」と「レコード編集」どちらもチェックすることで申込み後に電話連絡などで不参加連絡があり、
「◆セミナー申込み管理アプリ」のレコードが「参加」から「不参加」となっても「参加」の数だけをカウントすることができます。
“「開催日」が一致していて、レコード追加もしくはレコード編集されたらその都度自動計算する”という設定。
設定は以上です。
実際にカレンダービューからセミナー日程を選択し、申し込むとこんな感じになります。
日程を選択すると、「現在の申込数」と「残り枠」が表示されている。
DataCollectで自動計算されている為、「現在の申込数」と「残り枠」の数が申込み前にわかるようになっています。
そして、セミナーに申込みます。
セミナーに申し込む。
◆セミナー申込み管理アプリにデータが登録される。
◆セミナー日程管理アプリを見ると、残り枠が「0」に。
もう一度、カレンダービューにアクセスすると
30日の予定が消えた！
残り枠が「0」となったので、カレンダーの表示から消えました。
FormBridge×kViewerよりはるかに便利です。
【注意事項】DataCollectはトランザクション処理を施していないため、同時操作がある場合の挙動は保証しておりません。
まとめ
今回は、kintoneと連携サービスを活用した予約・申込みシステムの構築方法をご紹介しました。FormBridgeとkViewerだけでは、現在の申込数や残り枠数をリアルタイムで把握できないという課題がありましたが、DataCollectを追加することで解決できます。
DataCollectを使えば、申込みがあった瞬間やキャンセルが発生した際に自動的に数値が更新され、常に最新の空き状況を表示できます。満席になったセミナーは自動的にカレンダーから非表示になるため、申込みトラブルも防げます。管理者が手動で更新する必要もなくなり、運用の効率化も実現できます。
FormBridge、kViewer、DataCollectの3つを組み合わせることで、セミナー予約はもちろん、施設予約やイベント申込みなど、様々な用途に対応できる本格的な予約システム・申込みシステムを構築できます。ぜひ30日間の無料お試し をご利用ください。
