メインコンテンツへスキップ
レッスン一覧に戻る

atom.nocode-builder.build-request-form

申請フォームを作る

申請フォームを作る たとえば会社で「経費の精算」をするとき、紙の申請用紙に項目を書き込んで提出したことはありませんか? 申請フォームとは、その紙の用紙をウェブ上で再現したものです。オンラインにしておくと、いつでもど...

build-simple-form-with-aibuild-simple-form-with-ai「build simple form with ai」に関するスキルがこのレッスンで身につきます。
想定時間未設定公開状態: draft
学習メモ

成果物成果物このレッスンが終わったとき、あなたの手元に残る具体的な成果物です(例: 公開済みの Web ページ、動作するフォームなど)。

種類: screenshot検証: basic_manual_check_v1

証跡証跡成果物が正しく作れたことを確認するためのチェックリストです(例: ブラウザで動作する、フォーム送信で値が保存される)。

screenshoturl

メディアメディアレッスン内に出てくる図や動画のスロットです。実際の画面やイメージで理解を補助します。

diagramscreen_capture

レッスン本文

申請フォームを作る

たとえば会社で「経費の精算」をするとき、紙の申請用紙に項目を書き込んで提出したことはありませんか? 申請フォームとは、その紙の用紙をウェブ上で再現したものです。オンラインにしておくと、いつでもどこからでも申し込めて、集まった回答も自動でまとまります。

このレッスンでは、AI(=人工知能のことで、チャット形式で質問に答えてくれるツール)の力を借りながら、15分で1つの申請フォームを完成させます。あなたがやるのは「AIに相談する → 提案をもとにフォームを組み立てる → 確認する」の3ステップだけです。

フォーム作成フロー


前提を確認する

このレッスンを始める前に、次の3つが揃っていることを確認してください。

  • インターネットに接続できるパソコンがある
  • AIチャットツール(ChatGPT・Claude など)のアカウントを持っている(無料プランでOK)
  • Google アカウントを持っている(Google フォームを使います)

プログラミングの知識は一切不要です。文字を打てれば大丈夫です。


ステップ1:フォームの目的を決める

まずは「何のための申請フォームか」を1つに絞りましょう。料理でいうと、1つのレシピで1つの料理を作るのと同じです。あれもこれもと詰め込むと、どれも中途半端になってしまいます。

良い例

  • 「社内イベント参加申請」── 目的が1つで、項目が5〜8個で収まる
  • 「備品購入リクエスト」── 申請者・品名・理由がはっきりしている

悪い例

  • 「すべての社内手続きを1つのフォームにまとめる」── 項目が膨大になり、回答者が混乱する

AIに項目を提案してもらう

AIチャットツールを開いて、次のプロンプト(=AIへの指示文)をコピー&ペーストしてください。「社内イベント参加申請」の部分は、あなたが作りたいフォームの目的に書き換えてください。

私は社内の「社内イベント参加申請」用のオンラインフォームを作ろうとしています。 以下の条件で、入力項目を5〜8個提案してください。

  • 各項目に「項目名」「入力の種類(1行テキスト/複数行テキスト/選択肢/日付)」「必須かどうか」を書いてください
  • 回答者がスマホからでも3分で書き終わる量にしてください

AIが返してくれたリストを、メモ帳やテキストエディタにコピーしておきましょう。これがフォームの「設計図」になります。

ポイント: AIの提案をそのまま使う必要はありません。「この項目は要らないな」「ここは選択肢じゃなくて自由入力がいいな」と感じたら、遠慮なく変えてください。AIはあくまで「たたき台」を出してくれるアシスタントです。


ステップ2:Google フォームでフォームを作る

Google フォームを開く

  1. ブラウザで Google フォーム(forms.google.com)を開く
  2. 「+(空白)」のフォームを選ぶ

新しい空白のフォームが開きます。

Google Forms編集画面

タイトルと説明を入力する

フォームの上部にある「無題のフォーム」をクリックして、タイトルを入力します。

  • タイトル:フォームの名前(例:「社内イベント参加申請」)
  • 説明:フォームの目的を1〜2文で書く

良い例

社内イベントへの参加をお申し込みいただくフォームです。所要時間は約2分です。

悪い例

(説明欄が空白のまま)── 回答者が「何を書けばいいの?」と戸惑います

項目を1つずつ追加する

AIが提案してくれた設計図をもとに、項目を追加していきましょう。右側の「+」ボタンをクリックすると新しい項目が追加されます。

項目ごとに「回答の形式」を選びます。

AIの提案での種類Google フォームでの設定
1行テキスト「記述式」
複数行テキスト「段落」
選択肢(1つ選ぶ)「ラジオボタン」
選択肢(複数選べる)「チェックボックス」
日付「日付」

迷ったときのAIプロンプト例

Google フォームで「参加希望イベント」を選択肢から1つ選ぶ形式にしたいです。選択肢は「春のBBQ」「夏の花火大会」「秋の運動会」の3つです。設定手順をステップごとに教えてください。

必須にしたい項目は、項目の右下にある「必須」トグル(=ON/OFFの切り替えスイッチ)をONにしてください。名前や所属部署など、必ず入力してほしい項目に設定します。


ステップ3:フォームを確認する

作ったフォームを公開する前に、必ず自分で動作確認をしましょう。

プレビューで見た目をチェックする

フォーム編集画面の右上にある 「目のアイコン(プレビュー)」 をクリックすると、回答者と同じ画面が表示されます。

確認するポイント:

  • すべての項目が表示されているか
  • 説明文がわかりやすいか
  • 選択肢に漏れがないか

テスト回答を送信する

プレビュー画面で、実際に全項目に回答を入力して 「送信」ボタン を押してください。

そのあと編集画面に戻り、上部の 「回答」タブ を開きます。自分が入力したテストデータが表示されていれば成功です。

良い例:全項目に入力して送信まで確認する → 回答タブでデータが見える 悪い例:作っただけで確認せずにリンクを送る → 必須項目の設定ミスに気づかない


ステップ4:フォームを共有する

確認が済んだら、フォームを他の人に使ってもらいましょう。

  1. 編集画面の右上にある 「送信」ボタン をクリック
  2. リンクアイコン(🔗マーク)をクリック
  3. 「URLを短縮」にチェックを入れる(任意)
  4. 「コピー」 をクリック

コピーしたリンクを、メールやチャットで申請してほしい人に送りましょう。


つまずきやすいポイントを確認する

よくあるミス対処法
項目が多すぎる(10個以上)最初は5〜8個に絞る。後からいつでも追加できます
回答形式を間違える「名前」にチェックボックスを使うとおかしくなります。名前は「記述式」にしましょう
説明が空白フォームの目的を1〜2文で必ず書きましょう
必須設定の付け忘れ名前や連絡先など、必ず入力してほしい項目は「必須」をONに
画面が英語になっているブラウザの言語設定を日本語に変更してからフォームを開き直してください

AIに聞くと便利なプロンプト例

作った Google フォームに以下の問題があります。原因と直し方を教えてください。 ・「参加希望日」の項目で日付が選べない


完了チェックリスト

次の3つすべてに ✓ がつけば、このレッスンは完了です。

  • AIに相談してフォームの項目を決め、Google フォームで全項目を作成できた
  • プレビューでテスト回答を送信し、「回答」タブでデータが表示されることを確認できた
  • 共有用リンクをコピーして、他の人に送れる状態になった

おめでとうございます! あなたはAIの力を借りて、自分で申請フォームを1つ作り上げました。この「AIに相談 → 組み立て → 確認」の流れは、フォームだけでなく他の業務ツールを作るときにもそのまま使えます。

成果物成果物このレッスンが終わったとき、あなたの手元に残る具体的な成果物です(例: 公開済みの Web ページ、動作するフォームなど)。

種類: screenshot

検証: basic_manual_check_v1

証跡とメディア

証跡証跡成果物が正しく作れたことを確認するためのチェックリストです(例: ブラウザで動作する、フォーム送信で値が保存される)。

screenshoturl

メディア

diagramscreen_capture
前提 atom

必須

なし

あると楽

なし

学習完了