HTML知識不要!AIでFormBridge回答完了画面を簡単に自動生成
2026年5月、新たにFormBridgeのAI機能が追加され、フォーム回答完了画面の自動生成が可能となりました。本記事では使い方を解説するため、実際に3パターンの画面を作成しています。
「HTMLの知識がなくて書けない」「HTMLを書くのが手間」といった理由で、FormBridgeのフォーム回答後の画面をそのまま利用している人は、ぜひAI機能を活用してみてください。
また、FormBridgeの導入を検討されている方は、まずは「30日間無料お試し」をご利用ください。実際の画面で、手軽なフォーム作成を今すぐご体験いただけます。
目次
FormBridgeの回答完了画面をAIで簡単に自動生成できる
FormBridgeの新機能「AIで回答完了画面を作成」を使うことで、HTMLを書かなくても、フォーム回答完了画面を自動生成できます。追加料金不要で利用でき、自然な言語で簡単に画面デザインを作成可能です。
【FormBridgeの「AIで回答完了画面を作成」機能でできる活用例】
| できること | 活用例 |
| 任意のサイトへの動線 | 公式サイトやキャンペーンサイトへのリンクを設置 |
| カレンダーへの追加 | イベントなどの申し込み後のカレンダーへの追加ボタン設置 |
| SNSへのリンク | SNSに遷移するボタン設置 |
| 図の作成と追加 | 申し込み〜受付までのフロー図を表示 |
| 画像や動画の追加 | セミナー動画や自社のロゴなどを追加 |
| 入力内容の表示 | フォームに入力した内容を確認のため表示 |
FormBridgeの新機能「AIで回答完了画面を作成」の使い方
新機能は、FormBridgeの該当のフォームの管理画面から「回答完了画面」を開き、「HTMLで自由に生成」にチェックを入れ「AIで回答完了画面を作成」の文字をクリックして使用します。
| フォームの基本設定 | フォームの回答完了画面 |
![]() |
![]() |
▲FormBridgeのフォームの編集画面から設定画面を開く
たとえば「フォームの回答内容を一覧で確認できる画面」と入力した場合、回答完了画面にフォームの入力内容を表示させることができます。
| AIに自然言語でプロンプト入力 | AIで自動生成された画面 |
![]() |
![]() |
▲FormBridgeのAIで「回答内容を一覧で確認できる回答完了画面」と入力した場合
プレビューに要望通りの回答完了画面を表示できたら、プレビュー画面の右下にある「HTMLを確定」をクリックし、最後に画面左下に出てくる「保存して完了画面を更新」をクリックして保存します。
ただし、一度保存してしまうと元の回答完了画面に戻せなくなるため注意してください。
「該当のサイトに遷移するか」「リンクは新しいタブで開くか」などの動作確認をする際は、一度画面を保存する必要があるため、現行のフォームを編集する際は元のHTMLをメモして保管しておきましょう。
| HTMLを確定 | 保存して完了画面を更新 |
![]() |
![]() |
▲「フォームの回答内容を一覧で確認できる画面」を保存する
本記事では、実際に3つのパターンで作成したフォーム回答の完了画面を紹介します。FormBridgeをご利用中の人は、チャットの指示だけで簡単に作成できますので、ぜひ実際の画面で回答完了画面を作成してみてください。
製品サイトへの案内画面|ボタンの配置とデザインを変更する
フォーム回答画面に製品サイトやキャンペーンサイトへの案内を入れることで、自社製品やサービスの訴求ができ、フォーム回答者が次のアクションにつなげやすくなります。
【「AIで回答完了画面を作成」機能で製品サイトへの案内画面を作成する①】
| 入力したプロンプト | 製品サイトへの案内([サイトURL])と、30日間無料お試し([無料お試しURL])のボタンを配置して |
| AIに自然言語でプロンプト入力 | AIで自動生成された画面 |
![]() |
![]() |
▲FormBridgeの「AIで回答完了画面を作成」機能で作成した製品サイトの案内画面
製品サイトへの案内リンクを設置したい場合は、プロンプトに遷移先のサイトURLも入力します。ボタンの位置や表示させたい文章がある場合は、変えたい色味や文章を指定すると要望通りのデザインに変更できます。
【「AIで回答完了画面を作成」で製品サイトへの案内画面を作成する②】
| 修正したプロンプト | 製品サイトへの案内([サイトURL])と、30日間無料お試し([無料お試しURL])のボタンを配置して
【条件】
|
| AIに自然言語でプロンプト入力 | AIで自動生成された画面 |
![]() |
![]() |
▲プロンプトに条件を追加し、ボタンや文章を変更した画像
文字やボタンの位置を入れ替えたい場合は、プレビュー後に「製品サイトと無料お試しのボタンの位置を入れ替えて」と入力すると、要望を踏まえた画面を表示できます。
【「AIで回答完了画面を作成」機能で製品サイトへの案内画面を作成する③】
| AIに自然言語でプロンプト入力 | AIで自動生成された画面 |
![]() |
![]() |
▲ボタンの位置を入れ替えた画像
プレビューで想定した回答完了画面を表示できたら、「HTMLを確定」をクリックし、最後に画面左下に出てくる「保存して完了画面を更新」をクリックして保存しましょう。
上記のように、FormBridgeのAI機能を使うと、製品サイトや訴求したいサービスへの動線を簡単に作成できます。
イベントサイトへの案内画面|自社のロゴと動画を設置する
イベントの参加申し込みやアンケートなどの回答後、イベントの詳細情報やカレンダーへの日程追加をしたいときには、イベントサイトのURLやカレンダーのURLを回答完了画面に追加しましょう。
【「AIで回答完了画面を作成」機能でイベントサイトへの案内と動画を設置する①】
| 入力したプロンプト | イベントの予習動画([動画URL])を表示し、イベントの案内サイト([サイトURL])とカレンダーへの追加ボタン([カレンダーのURL])を追加して |
| AIに自然言語でプロンプト入力 | AIで自動生成された画面 |
![]() |
![]() |
▲FormBridgeの「AIで回答完了画面を作成」機能で作成した動画とイベントサイトへの案内、カレンダーへのボタンを設置した画面
自社のロゴを追加したいときは、ロゴの画像をURLに変換して追加します。すでに公開されている画像がある人は、公開されているロゴのURLを活用できます。
WordPressを利用している場合は「メディアライブラリ」内の画像のファイルのURLをコピーしてプロンプトに入力します。画面が完成したら、忘れずに保存しましょう。
【「AIで回答完了画面を作成」機能でイベントサイトへの案内と動画を設置する②】
| 追加で入力したプロンプト | 動画の上に自社の企業名のロゴと([企業名ロゴURL])イメージキャラクターのロゴ([キャラクターロゴURL])も追加して |
| AIに自然言語でプロンプト入力 | AIで自動生成された画面 |
![]() |
![]() |
▲ロゴを追加したイベント案内の回答完了画面
イベントの詳細情報の表示やカレンダーへの日程追加ボタンを設置することで、参加申し込みをした人が、次にとるアクションに迷わない動線を作れます。
また、フォーム回答の完了直後にカレンダーに日程を追加することで、参加日程を間違えたり忘れたりするミスも防止できます。
申請〜受付完了までの詳細画面|フロー図を自動生成する
FormBridgeのAI機能を使うと、申請から受付完了までのフロー図の自動生成が可能です。「受付完了までにかかる日数」や「受付完了時の対応方法」などを明記して、フォーム回答者からの問い合わせ削減につなげられます。
【「AIで回答完了画面を作成」機能で申請〜受付完了までの詳細を表示する①】
| 入力したプロンプト |
|
| AIに自然言語でプロンプト入力 | AIで自動生成された画面 |
![]() |
![]() |
▲FormBridgeの「AIで回答完了画面を作成」機能で作成した申請〜受付完了までの詳細を表示した回答完了画面
申請フォームを作成する際は、トラブル時の対応方法や問い合わせ先を記載しておくと、より問い合わせの負担を減らせます。マイページや申請の進捗が分かるサイトがある場合は、サイトへ飛べるリンクを設置しても良いでしょう。
【「AIで回答完了画面を作成」機能で申請〜受付完了までの詳細を表示する②】
| 追加で入力したプロンプト |
|
| AIに自然言語でプロンプト入力 | AIで自動生成された画面 |
![]() |
![]() |
▲お問い合わせボタンとトラブル時の対応方法の文章を作成した画面
申請や受付時の一連の流れを表示させたいときは、FormBridgeの「AIで回答完了画面を作成」機能を活用しましょう。
FormBridgeでAIを活用するときのポイント
FormBridgeで「AIで回答完了画面を作成」機能を活用する際は、3つのポイントを確認しておきましょう。
【FormBridgeにおけるAI機能の活用ポイント】
- 利用する前にAI機能の有効化が必要
- 「保存して完了画面を更新」を押すとボタンでは元の画面に戻せない
- 同じプロンプトを入力しても同じ画面が生成されるとは限らない
1. 利用する前にAI機能の有効化が必要
FormBridgeでAIを活用する際は、AI機能を有効化しておく必要があります。Toyokumoアカウント画面から「AI機能設定」を開き、「AI機能を有効化」をオンにすることでAIが使用可能となります。
| Toyokumoアカウント画面のメニュー | AI機能設定画面 |
![]() |
![]() |
▲トヨクモkintone連携サービスのAI機能を有効にする操作
2. 「保存して完了画面を更新」を押すとボタンでは元の画面に戻せない
フォームの回答完了画面作成後に実際の画面で行う動作確認は「保存して完了画面を更新」を押したあとのプレビュー画面で行う必要があります。
しかし、AIの自動生成で回答完了画面を作成する際、フォームの回答完了画面を「HTMLを確定」して「保存して完了画面を更新」をクリックすると、HTMLコードが上書きされてしまいボタンでは元の画面に戻せなくなります。
そのため、実際に動いているフォームの回答完了画面を編集する際は、変更前のHTMLをメモしておきましょう。元の画面に戻す際に、HTMLコードが書かれているエディタに元のHTMLを貼り付けて保存することで元の画面を再現できます。
3. 同じプロンプトを入力しても同じ画面が生成されるとは限らない
AIで回答完了画面を自動生成する場合、一度目とまったく同じプロンプトを入力しても異なる画面が表示される可能性があります。
連続で同じプロンプトを入力した場合は同じ画面が生成されることもありますが、数回別のプロンプトを入力して他の画面を作成したあと、一度目の画面と同じプロンプトを入力しても同じ画面を再現するのは難しいでしょう。
| 一度目に作成した画面 | 数回ほかのプロンプトを入力した後 |
![]() |
![]() |
▲FormBridgeのAIで「回答内容を一覧で確認できる回答完了画面」と入力した場合の比較
似たような画面でもボタンの形が変わったり文や画像の位置が変わることがあるため、一部使いまわせそうな画面が表示された場合は、HTMLをメモして保管しておくと良いでしょう。
「AI×トヨクモkintone連携サービス」で簡単に業務を効率化!
トヨクモのkintone連携サービスには、AI機能が搭載されているサービスがあります。AI機能を使うことで、より手軽に業務効率化を図れます。
【AIを搭載しているトヨクモkintone連携サービス】
| サービス名 | 機能 |
| FormBridge | フォームの回答完了画面の作成
[入力例] 回答内容を一覧で確認できる回答完了画面 |
| <今後リリース予定のAI機能>
フォーム画面のデザイン作成や修正サポート → 配置やデザインの提案 |
|
| kViewer | <今後リリース予定のAI機能>
|
| PrintCreator | <今後リリース予定のAI機能>
書類のフィールド配置や設定の作成サポート → 配置や設定の提案 |
| DataCollect | AI関数
[入力例] AI(“報告を要約して”, 報告) |
| フィールド式の作成を提案
[活用例]
|
|
| ピボットテーブルの集計設定提案
[活用例] ・ピボットテーブル作成時に「設定を提案」をクリック |
|
<今後リリース予定のAI機能>
|
|
| kMailer | シナリオメールの設定サポート
[入力例] 申し込み完了後、3日後にリマインドメールを送信したい |
| Toyokumoアカウント | <今後リリース予定のAI機能>
テンプレートのAI検索 → 膨大なリストから検索する手間を削減 |
参考:トヨクモkintone連携サービス公式サイト「もっと便利に|AI機能」
たとえば、DataCollectの「AI関数」では日本語で関数を入力できるので、関数が苦手な人でも簡単に集計可能です。フィールドに集計結果を反映させたいとき、式の入力のサポートにもAIを利用できます。
トヨクモの提供しているサービスのAI機能は、入力した社内情報がAIの学習に使われることはないため、セキュリティ面でも安心して業務に取り入れられます。
今後もAIや新たな機能のリリースを予定しているので、導入を検討している人は「30日間無料お試し」からぜひ一度試してみてください。なお、トヨクモの最新のリリース情報は、公式サイトにある「ニュース|プレスリリース」から確認できます。
まとめ
FormBridgeの新たなAI機能により、HTMLを書かずにフォームの回答完了画面を作成できます。 AI機能を使うことで専門知識がなくても手軽に運用でき、かつ追加料金も必要ありません。
FormBridgeのAI機能は、ToyokumoアカウントからAIを有効化することで利用できます。現行の回答完了画面を編集する際は、既存のHTMLをメモして保管しておきましょう。
トヨクモは今後もAIや新たな機能のリリースを予定しています。すべてのkintone連携サービスで「30日間無料お試し」が体験できるので、導入を検討している人はぜひ一度試してみてください。
【トヨクモ株式会社のkintone連携サービス】
| 連携サービス名 | できること |
| FormBridge | kintoneへデータが自動で保存されていくWebフォームを作成できる |
| PrintCreator | kintoneアプリのデータをPDFで出力できる/電子契約ができる |
| kViewer | kintoneライセンスがない人に、kintoneアプリのデータを共有できる |
| kMailer | kintoneアプリのデータを引用してメール送信できる |
| DataCollect | 複数のkintoneアプリに登録されたデータを集計できる |
| kBackup | kintoneアプリに登録されたデータを安全にバックアップする |
参考:トヨクモ株式会社「kintone連携サービス公式サイト」























