最近、AIでGoogleスライドなどを作成するツールが流行っていますよね。
そこで私も「自分でも作ってみよう！」と思ったのですが、難易度が高く挫折してしまいました（あたりまえ）。

だけど、「Googleフォームなら自分でもできるんじゃね？」と思って作ったのが、今回紹介するツールです。

🛠️ 使用環境

GAS (Google Apps Script)

💡 仕組み

AIにプロンプトを投げてJSONデータを作ってもらう
生成されたJSONをGASのウェブアプリに入力する
GASが自動でGoogleフォームの作成を開始する

🚀 体験サイト

体験版はこちらからお試しいただけます。
👉 ごまだんご式v1 体験サイト

実際にAIで作成したjson

{ "title": "技術ブログ・アウトプット講座 受講後アンケート", "description": "「技術ブログ・アウトプット講座」をご受講いただきありがとうございました。講座の感想や、その後のアウトプットの活用状況についてお聞かせください。（お名前の入力は不要です）", "confirmationMessage": "アンケートへのご協力ありがとうございました。今後の講座運営の参考にさせていただきます。", "isQuiz": false, "lockMode": false, "themeColor": "grey", "items": [ { "type": "section", "title": "セクション1：受講時の感想（全員回答）", "pageNavigation": "CONTINUE" }, { "type": "radio", "title": "Q1：今回の参加方法を教えてください。", "required": true, "points": 0, "hasOtherOption": false, "choices": [ { "value": "現地参加" }, { "value": "オンライン（Zoom）参加" } ] }, { "type": "scale", "title": "Q2：講座全体の満足度はいかがでしたか？", "required": true, "points": 0, "scaleMin": 1, "scaleMax": 5, "leftLabel": "不満", "rightLabel": "満足" }, { "type": "radio", "title": "Q3：講座の内容の難易度はいかがでしたか？", "required": true, "points": 0, "hasOtherOption": false, "choices": [ { "value": "難しい" }, { "value": "ちょうどいい" }, { "value": "易しい" } ] }, { "type": "scale", "title": "Q4：講師の説明はわかりやすかったですか？", "required": true, "points": 0, "scaleMin": 1, "scaleMax": 5, "leftLabel": "わかりにくい", "rightLabel": "わかりやすい" }, { "type": "checkbox", "title": "Q5：特に参考になった内容を教えてください。（複数選択可）", "required": true, "points": 0, "hasOtherOption": true, "choices": [ { "value": "プラットフォームの基本的な概要や文化" }, { "value": "記事の具体的な書き方・Markdown記法" }, { "value": "効果的な記事の検索・閲覧のコツ" }, { "value": "いいねやフォローなどのコミュニティ機能" } ] }, { "type": "radio", "title": "Q6：講座の時間配分はいかがでしたか？", "required": true, "points": 0, "hasOtherOption": false, "choices": [ { "value": "時間が足りない（短い）" }, { "value": "ちょうどいい" }, { "value": "時間が余った（長い）" } ] }, { "type": "scale", "title": "Q7：配布されたテキストや資料の分かりやすさはいかがでしたか？", "required": true, "points": 0, "scaleMin": 1, "scaleMax": 5, "leftLabel": "わかりにくい", "rightLabel": "わかりやすい" }, { "type": "radio", "title": "Q8：講座の受講後、実際に記事執筆や閲覧などのアウトプット活動をしていますか？", "required": true, "points": 0, "hasOtherOption": false, "choices": [ { "value": "記事を書いたり、よく閲覧して活用している", "goToSectionTitle": "セクション2：活用できている人限定" }, { "value": "あまり活用できていない・これから使う予定である", "goToSectionTitle": "セクション3：まだ活用できていない人限定" } ] }, { "type": "section", "title": "セクション2：活用できている人限定", "pageNavigation": "セクション4：今後の要望・その他" }, { "type": "checkbox", "title": "Q9：具体的にどのように活用していますか？（複数選択可）", "required": true, "points": 0, "hasOtherOption": true, "choices": [ { "value": "自分の技術知識のアウトプット（記事投稿）" }, { "value": "開発時の備忘録・メモ代わりとしての利用" }, { "value": "トラブルシューティングや技術情報の検索・閲覧" }, { "value": "他のエンジニアへのフィードバックやコメント等の交流" } ] }, { "type": "paragraph", "title": "Q10：アウトプット活動をしてみて、どのような効果やメリットを感じましたか？", "required": false, "points": 0 }, { "type": "text", "title": "Q11：今後、ブログ等で発信してみたいテーマや技術分野があれば教えてください。", "required": false, "points": 0 }, { "type": "section", "title": "セクション3：まだ活用できていない人限定", "pageNavigation": "CONTINUE" }, { "type": "checkbox", "title": "Q12：現在、アウトプット活動をする上でハードルになっていることは何ですか？（複数選択可）", "required": true, "points": 0, "hasOtherOption": true, "choices": [ { "value": "記事に書くためのネタが見つからない" }, { "value": "Markdownなどの書き方にまだ不安がある" }, { "value": "記事をネット上に公開すること自体に心理的ハードルがある" }, { "value": "日々の業務や学習が忙しく、時間を確保できない" } ] }, { "type": "paragraph", "title": "Q13：今後、どのようなサポートや情報があればより活用できそうですか？", "required": false, "points": 0 }, { "type": "section", "title": "セクション4：今後の要望・その他" }, { "type": "checkbox", "title": "Q14：今後開催してほしい講座や、知りたいテーマはありますか？（複数選択可）", "required": true, "points": 0, "hasOtherOption": true, "choices": [ { "value": "初心者を脱出するためのMarkdown応用テクニック" }, { "value": "読まれる記事にするための構成・ライティング講座" }, { "value": "特定の技術（Python、JavaScript、クラウド等）に特化した勉強会" }, { "value": "執筆効率を上げるための便利な周辺ツールの解説" } ] }, { "type": "paragraph", "title": "Q15：最後に、講師や運営スタッフへのメッセージ、ご意見などがあればご自由にご記入ください。", "required": false, "points": 0 } ] }

【重要】
アクセスすると認証画面が表示され、Googleフォームの権限（作成・編集）を求められます。ツールを実行するために権限の許可をお願いします。

【安心安全】
利用者のメールアドレスなどの個人情報は一切収集していません。

📜 利用規約（自作コードを利用する方へ）

このツールは、完全無料で公開しています！
利用にあたっては、以下の5点を守ってください。

自分用の改造はOK！
- 自分の環境に合わせて、コードを自由にカスタマイズして大丈夫です。
バグ報告のお願い
- もしバグを見つけたら、コメントなどで教えていただけると非常にありがたいです。
二次配布・転売はNG
- 転売や勝手な配布、自作発言は禁止です。改造したコードをネット上で配布するのもお控えください。
業務での利用はOK！
- 仕事や社内の業務効率化として使うのは自由です。
ツール自体の商用利用・販売はNG
- このツールや改造コードを他人に販売したり、有料サービスに組み込んで利益を得る行為は禁止です。

⚠️ お約束（免責事項）
このツールを使って万が一データが消えたり、システムが止まったりしても責任は取れません。あくまで「自己責任」でのご利用をお願いいたします。

📖 使い方

「プロンプトをコピー」 ボタンを押します。
コピーしたプロンプトをAIに投げます。
- ※プロンプトの最後に、どんなフォームを作りたいかの要望を記入してください。
AIの指示に従ってJSONデータを生成させます。
作成されたJSONを入力欄に入れます（既存のテキストは消してください）。
必要に応じて、画面右側でJSONを編集することも可能です。
「Googleフォームを書き出す」 を押すと、自動でフォームが作成されます。

🔒 セキュリティが気になる方へ

「見知らぬウェブアプリに権限を渡すのは不安…」という方は、以下のソースコードを使って、ご自身のGoogleドライブ上でGASプロジェクトを作成してご利用ください。

コード.gs（クリックで展開）

function doGet() {
  // ==========================================
  // 【超軽量】短時間の過剰アクセス一律ブロック機能
  // ==========================================
  const cache = CacheService.getScriptCache();
  
  // 💡 設定：制限をかける秒数と、その間に許容する最大アクセス数
  const LIMIT_SECONDS = 10; 
  const MAX_REQUESTS  = 25; 
  
  const cacheKey = "global_rate_limit_counter";
  
  // 1. キャッシュから現在の合計アクセス数を取得
  let currentRequests = parseInt(cache.get(cacheKey) || "0", 10);
  
  if (currentRequests >= MAX_REQUESTS) {
    // 【ブロック発動】短時間にアクセスが集中したら、HTMLを読み込まずに即拒否
    return ContentService.createTextOutput("ちょっとアクセス多すぎ。少し待ってね。だいぶ上限厳しくしているから待ってね")
                         .setMimeType(ContentService.MimeType.TEXT);
  }
  
  // 2. カウントを1増やして、指定秒数だけキャッシュに保存
  currentRequests++;
  cache.put(cacheKey, currentRequests.toString(), LIMIT_SECONDS); 

  // ==========================================
  // 【正常処理】アクセスが正常な場合はHTMLを表示
  // ==========================================
  return HtmlService.createHtmlOutputFromFile('index')
                    .setTitle('ごまだんご式プロンプトv1')
                    .addMetaTag('viewport', 'width=device-width, initial-scale=1');
}


function createFormFromJson(jsonString) {
  var currentItemTitle = "フォームの基本設定";
  var currentItemIndex = 0;
  
  try {
    var data = JSON.parse(jsonString);
    var form = FormApp.create(data.title || '無題のフォーム');
    
    if (data.isQuiz === true) {
      form.setIsQuiz(true);
    }
    
    if (data.isQuiz === true && data.lockMode === true) {
      try {
        form.setRequiresSubmiterToSignIn(true);
      } catch(e) {
        Logger.log('ロックモード前提設定のスキップ: ' + e.toString());
      }
    }
    
    if (data.description) form.setDescription(data.description);
    if (data.confirmationMessage) form.setConfirmationMessage(data.confirmationMessage);
    
    var items = data.items || [];
    var sectionObjects = {};
    
    // ラジオボタンとプルダウンの管理配列
    var radioItemsToUpdate = [];
    var dropdownItemsToUpdate = [];

    // --- ファーストパス: すべてのアイテムを順番通りに作成 ---
    for (var i = 0; i < items.length; i++) {
      var item = items[i];
      currentItemIndex = i + 1;
      currentItemTitle = item.title || "無題の項目";
      
      if (item.type === 'section') {
        var pageBreak = form.addPageBreakItem().setTitle(item.title);
        sectionObjects[item.title] = pageBreak;
        pageBreak.setGoToPage(FormApp.PageNavigationType.CONTINUE);
        continue;
      }
      
      var formItem;
      switch (item.type) {
        case 'text':
          formItem = form.addTextItem().setTitle(item.title).setRequired(!!item.required);
          if (data.isQuiz === true && item.points !== undefined && parseInt(item.points, 10) > 0) {
            formItem.setPoints(parseInt(item.points, 10));
          }
          if (item.validation) {
            var valBuild = FormApp.createTextValidation();
            if (item.validation.mode === 'email') valBuild.requireTextIsEmail();
            if (item.validation.mode === 'number') valBuild.requireNumber();
            if (item.validation.mode === 'text_length' && item.validation.limit) valBuild.requireTextLengthLessThanOrEqualTo(item.validation.limit);
            formItem.setValidation(valBuild.build());
          }
          break;
          
        case 'paragraph':
          formItem = form.addParagraphTextItem().setTitle(item.title).setRequired(!!item.required);
          if (data.isQuiz === true && item.points !== undefined && parseInt(item.points, 10) > 0) {
            formItem.setPoints(parseInt(item.points, 10));
          }
          break;
          
        case 'date':
          formItem = form.addDateItem().setTitle(item.title).setRequired(!!item.required);
          break;
          
        case 'time':
          formItem = form.addTimeItem().setTitle(item.title).setRequired(!!item.required);
          break;
          
        case 'scale':
          formItem = form.addScaleItem().setTitle(item.title).setRequired(!!item.required);
          var min = item.scaleMin || 1;
          var max = item.scaleMax || 5;
          formItem.setBounds(min, max);
          if (item.leftLabel || item.rightLabel) {
            formItem.setLabels(item.leftLabel || '', item.rightLabel || '');
          }
          break;
          
        case 'radio':
          formItem = form.addMultipleChoiceItem().setTitle(item.title).setRequired(!!item.required);
          if (data.isQuiz === true && item.points !== undefined) {
            formItem.setPoints(parseInt(item.points, 10) || 0);
          }
          radioItemsToUpdate.push({ itemData: item, formItemObject: formItem, index: currentItemIndex });
          break;
          
        case 'dropdown':
          formItem = form.addListItem().setTitle(item.title).setRequired(!!item.required);
          if (data.isQuiz === true && item.points !== undefined) {
            formItem.setPoints(parseInt(item.points, 10) || 0);
          }
          dropdownItemsToUpdate.push({ itemData: item, formItemObject: formItem, index: currentItemIndex });
          break;
          
        case 'checkbox':
          formItem = form.addCheckboxItem().setTitle(item.title).setRequired(!!item.required);
          if (data.isQuiz === true && item.points !== undefined) {
            formItem.setPoints(parseInt(item.points, 10) || 0);
          }
          var rawChoices = item.choices || [];
          var formattedChoices = [];
          for (var c = 0; c < rawChoices.length; c++) {
            if (data.isQuiz === true) {
              formattedChoices.push(formItem.createChoice(rawChoices[c].value, !!rawChoices[c].isCorrect));
            } else {
              formattedChoices.push(formItem.createChoice(rawChoices[c].value));
            }
          }
          if (formattedChoices.length > 0) formItem.setChoices(formattedChoices);
          if (item.hasOtherOption) formItem.showOtherOption(true);
          // ※シャッフル機能（setShuffleChoices）を完全削除しました
          break;
      }
    }

    // --- セカンドパス(A): ラジオボタンの選択肢設定 ---
    for (var j = 0; j < radioItemsToUpdate.length; j++) {
      var targetItem = radioItemsToUpdate[j];
      var d = targetItem.itemData;
      var fItem = targetItem.formItemObject;
      var rawChoices = d.choices || [];
      var formattedChoices = [];
      
      currentItemIndex = targetItem.index;
      currentItemTitle = d.title || "無題のラジオボタン質問";
      
      if (data.isQuiz === true) {
        for (var c = 0; c < rawChoices.length; c++) {
          formattedChoices.push(fItem.createChoice(rawChoices[c].value, !!rawChoices[c].isCorrect));
        }
      } else {
        for (var c = 0; c < rawChoices.length; c++) {
          var choiceText = rawChoices[c].value;
          var branchTitle = rawChoices[c].goToSectionTitle ? rawChoices[c].goToSectionTitle.trim() : "";
          
          if (branchTitle !== "" && branchTitle !== "CONTINUE") {
            var target = branchTitle === 'SUBMIT' ? FormApp.PageNavigationType.SUBMIT : sectionObjects[branchTitle];
            if (target) {
              formattedChoices.push(fItem.createChoice(choiceText, target));
              continue;
            }
          }
          formattedChoices.push(fItem.createChoice(choiceText));
        }
      }
      if (formattedChoices.length > 0) fItem.setChoices(formattedChoices);
      if (d.type === 'radio' && d.hasOtherOption) fItem.showOtherOption(true);
      // ※シャッフル機能（setShuffleChoices）を完全削除しました
    }

    // --- セカンドパス(B): プルダウンの選択肢設定 ---
    for (var m = 0; m < dropdownItemsToUpdate.length; m++) {
      var targetItem = dropdownItemsToUpdate[m];
      var d = targetItem.itemData;
      var fItem = targetItem.formItemObject;
      var rawChoices = d.choices || [];
      var formattedChoices = [];
      
      currentItemIndex = targetItem.index;
      currentItemTitle = d.title || "無題のプルダウン質問";
      
      if (data.isQuiz === true) {
        for (var c = 0; c < rawChoices.length; c++) {
          formattedChoices.push(fItem.createChoice(rawChoices[c].value, !!rawChoices[c].isCorrect));
        }
      } else {
        for (var c = 0; c < rawChoices.length; c++) {
          var choiceText = rawChoices[c].value;
          var branchTitle = rawChoices[c].goToSectionTitle ? rawChoices[c].goToSectionTitle.trim() : "";
          
          if (branchTitle !== "" && branchTitle !== "CONTINUE") {
            var target = branchTitle === 'SUBMIT' ? FormApp.PageNavigationType.SUBMIT : sectionObjects[branchTitle];
            if (target) {
              formattedChoices.push(fItem.createChoice(choiceText, target));
              continue;
            }
          }
          formattedChoices.push(fItem.createChoice(choiceText));
        }
      }
      if (formattedChoices.length > 0) fItem.setChoices(formattedChoices);
    }

    // --- サードパス: セクション遷移確定 ---
    for (var k = 0; k < items.length; k++) {
      if (items[k].type === 'section' && items[k].pageNavigation) {
        var navStr = items[k].pageNavigation.trim();
        var sObj = sectionObjects[items[k].title];
        currentItemTitle = items[k].title;
        if (sObj) {
          if (navStr === 'SUBMIT') {
            sObj.setGoToPage(FormApp.PageNavigationType.SUBMIT);
          } else if (navStr === 'CONTINUE') {
            sObj.setGoToPage(FormApp.PageNavigationType.CONTINUE);
          } else if (sectionObjects[navStr]) {
            sObj.setGoToPage(sectionObjects[navStr]);
          }
        }
      }
    }
    
    return { success: true, id: form.getId(), editUrl: form.getEditUrl(), publishedUrl: form.getPublishedUrl() };
    
  } catch (error) {
    var detailedErrorMessage = "【GAS生成エラー】\n" +
                               "■ 発生場所: 項目 #" + currentItemIndex + "「" + currentItemTitle + "」\n" +
                               "■ エラー内容: " + error.toString();
    return { success: false, message: detailedErrorMessage };
  }

index.html（クリックで展開）

<!DOCTYPE html>
<html>
<head>
  <base target="_top">
  <style>
    /* 白と灰色を基調としたミニマルなフラットデザイン */
    body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; margin: 0; padding: 0; background: #ffffff; color: #1a1a1a; height: 100vh; display: flex; overflow: hidden; }
    
    /* 左右50%ずつの分離配置（z-indexや重なりのバグを完全防止） */
    .panel { width: 50%; height: 100vh; box-sizing: border-box; display: flex; flex-direction: column; padding: 24px; }
    .left-panel { border-right: 1px solid #e5e5e5; background: #f8f9fa; overflow-y: auto; }
    .right-panel { background: #ffffff; display: flex; flex-direction: column; overflow: hidden; }
    
    h2 { font-size: 16px; font-weight: 700; margin-top: 0; margin-bottom: 16px; color: #1a1a1a; display: flex; align-items: center; gap: 8px; }
    
    /* プロンプトコンテナ */
    .prompt-container { background: #ffffff; border: 1px solid #e5e5e5; border-radius: 4px; padding: 16px; margin-bottom: 20px; }
    .prompt-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; font-size: 13px; font-weight: 700; color: #404040; }
    
    /* 入力エリア */
    textarea { width: 100%; min-height: 180px; font-family: monospace; font-size: 12px; padding: 14px; border: 1px solid #d4d4d4; border-radius: 4px; box-sizing: border-box; background: #ffffff; color: #1a1a1a; resize: none; margin-bottom: 12px; }
    textarea:focus { border-color: #737373; outline: none; }

    /* 各種ボタン */
    .btn-group { display: flex; gap: 10px; margin-top: 4px; }
    .btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 36px; padding: 0 16px; border-radius: 4px; font-size: 13px; font-weight: 600; border: 1px solid #d4d4d4; cursor: pointer; background: #ffffff; color: #1a1a1a; user-select: none; }
    .btn-sm { height: 28px; padding: 0 10px; font-size: 11px; border-radius: 3px; }
    .btn-primary { background: #1a1a1a; color: #ffffff; border-color: #1a1a1a; }
    .btn-primary:hover { background: #404040; border-color: #404040; }
    .btn-success { background: #ffffff; color: #1a1a1a; border-color: #1a1a1a; }
    .btn-success:hover { background: #f5f5f5; }
    .btn-danger { background: #ffffff; color: #dc2626; border-color: #dc2626; width: 100%; margin-top: 12px; }
    .btn-danger:hover { background: #fef2f2; }
    
    /* 右側の編集エリア（ここだけを独立スクロール） */
    #visualEditor { flex-grow: 1; overflow-y: auto; padding-right: 4px; margin-bottom: 12px; }

    /* カードデザイン */
    .card { background: #ffffff; border: 1px solid #e5e5e5; border-radius: 4px; padding: 20px; margin-bottom: 16px; position: relative; box-shadow: 0 1px 2px rgba(0,0,0,0.02); }
    .card-header-accent { border-top: 3px solid #1a1a1a; }
    .card-section-accent { border-top: 3px solid #737373; background: #fafafa; }
    
    .field { margin-bottom: 14px; }
    .field-label { font-size: 11px; color: #737373; font-weight: 700; margin-bottom: 4px; display: block; }
    .input-text { width: 100%; border: none; border-bottom: 1px solid #d4d4d4; padding: 6px 0; font-size: 14px; background: transparent; box-sizing: border-box; color: #1a1a1a; }
    .input-text:focus { outline: none; border-bottom: 1px solid #1a1a1a; }
    .select-style { border: 1px solid #d4d4d4; padding: 4px 8px; font-size: 12px; border-radius: 4px; background: #ffffff; cursor: pointer; color: #1a1a1a; }
    
    /* 操作ボタン（右上） */
    .card-actions { position: absolute; top: 16px; right: 16px; display: flex; gap: 4px; }
    .action-icon { background: #ffffff; border: 1px solid #e5e5e5; padding: 2px 6px; cursor: pointer; color: #737373; display: inline-flex; align-items: center; border-radius: 3px; font-size: 11px; user-select: none; }
    .action-icon:hover { background: #f5f5f5; color: #1a1a1a; border-color: #737373; }
    .action-icon-delete:hover { background: #fef2f2; color: #dc2626; border-color: #dc2626; }
    
    /* 選択肢ブロック */
    .choice-block { background: #fafafa; border: 1px solid #e5e5e5; border-radius: 4px; padding: 12px; margin-top: 8px; }
    .choice-row { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
    .choice-row:last-child { margin-bottom: 0; }

    /* クイズ設定 */
    .quiz-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 700; background: #f5f5f5; color: #404040; padding: 2px 6px; border-radius: 3px; margin-bottom: 6px; border: 1px solid #e5e5e5; }
    .quiz-settings-row { display: flex; gap: 12px; align-items: center; background: #fcfcfc; padding: 10px; border-radius: 4px; margin-top: 10px; border: 1px solid #e5e5e5; }

    /* 下部ツールバー固定配置 */
    .editor-footer { background: #ffffff; padding-top: 12px; border-top: 1px solid #e5e5e5; display: flex; justify-content: center; gap: 10px; flex-shrink: 0; }
    
    .toggle-row { display: flex; align-items: center; justify-content: flex-end; gap: 12px; font-size: 13px; margin-top: 12px; border-top: 1px solid #e5e5e5; padding-top: 10px; }
    .success-banner { background: #fafafa; color: #1a1a1a; border: 1px solid #e5e5e5; padding: 20px; border-radius: 4px; margin-top: 16px; }
    .success-banner a { color: #1a1a1a; font-weight: 700; text-decoration: underline; display: inline-flex; align-items: center; gap: 4px; }
    
    .error-box { background: #fef2f2; border: 1px solid #fee2e2; border-radius: 4px; padding: 16px; color: #991b1b; }
    .error-msg { font-family: monospace; font-size: 12px; background: #ffffff; padding: 8px; border: 1px solid #fee2e2; white-space: pre-wrap; color: #dc2626; margin: 8px 0; }
    .prompt-text { font-family: monospace; background: #ffffff; padding: 12px; display: block; margin-top: 8px; user-select: all; cursor: pointer; white-space: pre-wrap; border-radius: 4px; border: 1px solid #e5e5e5; }
  </style>
</head>
<body>

<!-- 左ペイン -->
<div class="panel left-panel">
  <div class="prompt-container">
    <div class="prompt-header">
      <span>💡 AI用万能テスト・クイズ対応プロンプト</span>
      <button id="btnCopy" class="btn btn-sm btn-success" onclick="copyPromptToClipboard()">プロンプトをコピー</button>
    </div>
    <div style="font-size: 11px; color: #525252; line-height: 1.4;">
      ボタンを押してコピーし、AIに渡してください。むやみな必須回答化を防ぐロジックが組み込まれています。
    </div>
  </div>

  <h2>JSONデータ</h2>
  <textarea id="jsonInput" placeholder="AIから返ってきた ```json ... ``` をここに貼り付けてください..." oninput="syncJsonToVisual()"></textarea>
  
  <div class="btn-group">
    <button id="btnCreate" class="btn btn-primary" onclick="generateForm()">Googleフォームを書き出す</button>
  </div>
  
  <div id="status" style="margin-top:12px; font-size:13px; font-weight:bold; display:none;"></div>
  <div id="successArea"></div>
</div>

<!-- 右ペイン -->
<div class="panel right-panel">
  <h2>フォーム編集・構築画面 (プレビュー)</h2>
  <div id="visualEditor"></div>
  
  <div class="editor-footer">
    <button class="btn btn-sm" onclick="addNewItem('text')">＋ 質問を追加</button>
    <button class="btn btn-sm" onclick="addNewItem('radio')">＋ 選択肢質問を追加</button>
    <button class="btn btn-sm" style="border-color:#737373;" onclick="addNewItem('section')">＋ セクションを追加</button>
  </div>
</div>

<script>
var currentFormId = null;
var currentData = { title: "新規フォーム", description: "", confirmationMessage: "", isQuiz: false, lockMode: false, items: [] };

var embeddedPromptText = `【厳守：一発目のJSON出力は絶対禁止】
あなたはGoogleフォームの設計専門家です。最初の回答でいきなりJSONを出力することは【絶対に禁止】します。必ず以下のステップに従ってください。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■ ステップ1：構成案の提案（あなたの最初の回答）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
指示を読み取り、以下の3点を箇条書きで簡潔に提案してください。
1. 【全体方針】：1ページ完結か、複数ページ（セクション区切り）か。
2. 【条件分岐の要否】：回答によるページジャンプや合流ロジックが必要かどうかの判断。
3. 【構成案】：各ページに配置する質問項目の一覧。（それぞれの問題を必須にするか）
4. 【構成案の再確認】：各ページに配置する質問項目をみて無意味な "SUBMIT" が置かれていないか。原則（条件分岐を使わない場合） "SUBMIT" は使わない


最後に必ず「この構成で進めてよろしいですか？問題なければ『OK』と指示してください」と問いかけ、出力を止めてください。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■ ステップ2：調整とJSON出力（ユーザーが『OK』と言ったら実行）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ユーザーから承諾（OK等）を得るまでは、質問の調整を繰り返してください。
承諾を得た段階で、初めて最終構成を以下の【JSON仕様】に落とし込み、\`\`\`json ... \`\`\` のコードブロック【のみ】を出力してください。挨拶や解説は一切不要です。

────────────────────────────────────────
【JSON仕様（スキーマ定義）】
────────────────────────────────────────
{
  "title": "[タイトル]",
  "description": "[説明文]",
  "confirmationMessage": "[送信完了メッセージ]",
  "isQuiz": true | false, // テスト・クイズ・採点機能時は true
  "lockMode": true | false, // 「ロックモードにして」と明示された場合のみ true
  "themeColor": "grey",
  "items": [
    // 以下の【部品】を指定された規模に応じて必要な数だけ連結して配置せよ
    
    // 1. セクション区切り
    { "type": "section", "title": "[タイトル]", "pageNavigation": "CONTINUE" | "SUBMIT" | "[合流先セクション名]" },
    // 2. 記述式・短文
    { "type": "text", "title": "[質問名]", "required": true | false, "points": 10 },
    // 3. 記述式・長文 / 日付 / 時刻
    { "type": "paragraph" | "date" | "time", "title": "[質問名]", "required": true | false, "points": 10 },
    // 4. 段階評価
    { "type": "scale", "title": "[質問名]", "required": true | false, "scaleMin": 1, "scaleMax": 5, "leftLabel": "[最小説明]", "rightLabel": "[最大説明]" },
    // 5. 選択肢（ラジオ/チェック/プルダウン）
   ■ 5. 選択肢（ラジオ/チェック/プルダウン）
{
  "type": "radio" | "checkbox" | "dropdown",
  "title": "[質問名]",
  "required": true | false,
  "hasOtherOption": true | false,
  "choices": [
    // 問題の選択肢を必要な数だけ配列で並べる。1番目、2番目に関わらず、本当に正しい答えのオブジェクトにだけ「"isCorrect": true」を正確に配置せよ。
    { "value": "[選択肢A（これが正解ならここにisCorrectを入れる）]", "isCorrect": true },
    { "value": "[選択肢B（これが不正解ならisCorrectは書かない）]" },
    { "value": "[選択肢C]", "goToSectionTitle": "SUBMIT" | "[ジャンプ先セクション名]" } // goToSectionTitleは分岐時のみ
  ]
}

【⚠️ クイズ（isQuiz: true）時の正解フラグ設置ルール（絶対厳守）】
・テンプレートの並び順に惑わされず、あなたが作成したクイズの「本当の正解のテキスト」を持つ選択肢オブジェクトにだけ、正確に「"isCorrect": true」を仕込んでください。
・1番目の選択肢（配列の先頭）ばかりを思考停止してすべて正解にする悪癖（バグ）を絶対に禁止します。問題ごとに、1番目、2番目、3番目、4番目と、正解の配置位置を完全にバラバラにシャッフルしてデータを出力してください。

  ]
}

【⚠️ 必須設定（required）の厳格ルール】
• 必須（true）にするのは、氏名、出席番号など、未入力だと運用が破綻する重要項目のみ。
• 「任意」「感想」「自由記述」の項目、および「配点0（points: 0）」のアンケート項目は、100%例外なく「\"required\": false」にせよ。
「【超重要】クイズ問題（設問）が並ぶメインのページ（セクション）において、そのセクション自体の "pageNavigation" に "SUBMIT" を指定することは絶対に禁止します。クイズを配置するページの pageNavigation は必ず "CONTINUE" にするか、キー自体を省略してください。」

────────────────────────────────────────
【作成したいフォーム】
[ここに要望を記入してください]`;




window.onload = function() {
  document.getElementById('jsonInput').value = JSON.stringify(currentData, null, 2);
  renderVisualEditor(currentData);
};

function copyPromptToClipboard() {
  navigator.clipboard.writeText(embeddedPromptText).then(function() {
    var btn = document.getElementById('btnCopy');
    btn.innerText = "コピー完了";
    setTimeout(function() { btn.innerText = "プロンプトをコピー"; }, 2000);
  });
}

function syncJsonToVisual() {
  var jsonStr = document.getElementById('jsonInput').value.trim();
  if (!jsonStr) return;
  
  jsonStr = jsonStr.replace(/^```json\s*/i, '').replace(/```$/, '').trim();
  try {
    var parsed = JSON.parse(jsonStr);
    currentData = parsed;
    if (!currentData.items) currentData.items = [];
    if (document.activeElement.id === 'jsonInput') {
      renderVisualEditor(currentData);
    }
  } catch(e) {
    document.getElementById('visualEditor').innerHTML = '<div class="error-box"><div class="error-title">JSON構文エラー</div><div class="error-msg">' + e.message + '</div></div>';
  }
}

function syncVisualToJson() {
  document.getElementById('jsonInput').value = JSON.stringify(currentData, null, 2);
}

function renderVisualEditor(data) {
  var container = document.getElementById('visualEditor');
  container.innerHTML = '';
  
  var quizChecked = data.isQuiz ? 'checked' : '';
  var lockChecked = data.lockMode ? 'checked' : '';
  
  var headerCard = document.createElement('div');
  headerCard.className = 'card card-header-accent';
  headerCard.innerHTML = `
    <div class="field"><div class="field-label">フォームのタイトル</div><input type="text" class="input-text" data-key="title" value="${data.title || ''}"></div>
    <div class="field"><div class="field-label">フォームの説明文</div><input type="text" class="input-text" data-key="description" value="${data.description || ''}"></div>
    <div class="field"><div class="field-label">送信完了メッセージ</div><input type="text" class="input-text" data-key="confirmationMessage" value="${data.confirmationMessage || ''}"></div>
    <div style="display:flex; gap:20px; background:#f5f5f5; padding:10px; border-radius:4px; font-size:12px; border:1px solid #e5e5e5;">
      <label style="cursor:pointer;"><input type="checkbox" id="mainIsQuiz" ${quizChecked}> 🖩 テストモード</label>
      <label style="cursor:pointer;"><input type="checkbox" id="mainLockMode" ${lockChecked}> 🔒 Chromebook ロック</label>
    </div>
  `;
  container.appendChild(headerCard);
  
  headerCard.querySelectorAll('.input-text').forEach(function(input) {
    input.addEventListener('input', function() { currentData[this.getAttribute('data-key')] = this.value; syncVisualToJson(); });
  });
  headerCard.querySelector('#mainIsQuiz').addEventListener('change', function() { currentData.isQuiz = this.checked; syncVisualToJson(); renderVisualEditor(currentData); });
  headerCard.querySelector('#mainLockMode').addEventListener('change', function() { currentData.lockMode = this.checked; syncVisualToJson(); });

  var items = data.items || [];
  items.forEach(function(item, index) {
    var card = document.createElement('div');
    var isSection = (item.type === 'section');
    card.className = 'card ' + (isSection ? 'card-section-accent' : '');
    
    var html = `
      <div class="card-actions">
        <button class="action-icon btn-up" data-idx="${index}">上へ</button>
        <button class="action-icon btn-down" data-idx="${index}">下へ</button>
        <button class="action-icon action-icon-delete btn-del" data-idx="${index}">削除</button>
      </div>
    `;
    
    if (isSection) {
      html += `
        <div class="field"><div class="field-label">セクション区切り</div><input type="text" class="input-text item-title" data-idx="${index}" value="${item.title || ''}"></div>
        <div class="field" style="margin-bottom:0;"><div class="field-label">次ページへの進路設定</div><input type="text" class="input-text item-nav" data-idx="${index}" value="${item.pageNavigation || 'CONTINUE'}"></div>
      `;
    } else {
      var types = { 'text':'短文記述', 'paragraph':'長文記述', 'radio':'ラジオボタン', 'checkbox':'チェックボックス', 'dropdown':'プルダウン', 'date':'日付', 'time':'時刻', 'scale':'段階評価' };
      var selectOptions = Object.keys(types).map(t => `<option value="${t}" ${item.type === t ? 'selected' : ''}>${types[t]}</option>`).join('');
      
      html += `
        <div style="margin-bottom:10px; display:flex; align-items:center; gap:8px;">
          <select class="select-style" data-idx="${index}" id="sel_${index}">${selectOptions}</select>
          ${data.isQuiz ? `<span class="quiz-badge">採点対象</span>` : ''}
        </div>
        <div class="field"><input type="text" class="input-text item-title" data-idx="${index}" placeholder="質問文..." value="${item.title || ''}"></div>
      `;
      
      if (data.isQuiz) {
        html += `
          <div class="quiz-settings-row">
            <span style="font-size:12px; font-weight:bold;">設問の配点:</span>
            <input type="number" class="input-text item-points" data-idx="${index}" style="width:50px; padding:0; text-align:center;" value="${item.points || 0}">
            <span style="font-size:12px;">点</span>
          </div>
        `;
      }
      
      if (['radio', 'checkbox', 'dropdown'].includes(item.type)) {
        html += `<div class="choice-block"><div class="field-label">選択肢（${data.isQuiz ? '正解指定' : '一覧'}）</div><div class="choice-container"></div>`;
        html += `<button class="btn btn-sm btn-add-choice" data-idx="${index}">＋ 選択肢を追加</button></div>`;
      }
      
      var checked = item.required ? 'checked' : '';
      html += `
        <div class="toggle-row">
          <label style="cursor:pointer;"><input type="checkbox" class="item-req" data-idx="${index}" ${checked}> 回答を必須にする</label>
        </div>
      `;
    }
    
    card.innerHTML = html;
    container.appendChild(card);
    
    card.querySelector('.btn-up').addEventListener('click', function() { moveItem(parseInt(this.getAttribute('data-idx'), 10), -1); });
    card.querySelector('.btn-down').addEventListener('click', function() { moveItem(parseInt(this.getAttribute('data-idx'), 10), 1); });
    card.querySelector('.btn-del').addEventListener('click', function() { removeItem(parseInt(this.getAttribute('data-idx'), 10)); });
    
    var txtTitle = card.querySelector('.item-title');
    if(txtTitle) txtTitle.addEventListener('input', function() { currentData.items[parseInt(this.getAttribute('data-idx'), 10)].title = this.value; syncVisualToJson(); });
    
    var txtNav = card.querySelector('.item-nav');
    if(txtNav) txtNav.addEventListener('input', function() { currentData.items[parseInt(this.getAttribute('data-idx'), 10)].pageNavigation = this.value; syncVisualToJson(); });
    
    var selType = card.querySelector('.select-style');
    if(selType) selType.addEventListener('change', function() { changeItemType(parseInt(this.getAttribute('data-idx'), 10), this.value); });
    
    var chkReq = card.querySelector('.item-req');
    if(chkReq) chkReq.addEventListener('change', function() { currentData.items[parseInt(this.getAttribute('data-idx'), 10)].required = this.checked; syncVisualToJson(); });
    
    var numPoints = card.querySelector('.item-points');
    if(numPoints) numPoints.addEventListener('input', function() { currentData.items[parseInt(this.getAttribute('data-idx'), 10)].points = parseInt(this.value,10)||0; syncVisualToJson(); });
    
    var choiceContainer = card.querySelector('.choice-container');
    if (choiceContainer) {
      var choices = item.choices || [];
      choices.forEach(function(choice, cIndex) {
        var cRow = document.createElement('div');
        cRow.className = 'choice-row';
        
        var correctChecked = choice.isCorrect ? 'checked' : '';
        // 【修正】混入していたエスケープ用の余計な記号を綺麗にパージしました
        cRow.innerHTML = `
          ${data.isQuiz ? '<input type="checkbox" class="c-correct" data-idx="' + index + '" data-cidx="' + cIndex + '" ' + correctChecked + '>' : ''}
          <input type="text" class="input-text c-val" data-idx="${index}" data-cidx="${cIndex}" style="font-size:13px; flex:2;" placeholder="テキスト" value="${choice.value || ''}">
          ${item.type !== 'checkbox' ? '<input type="text" class="input-text c-branch" data-idx="' + index + '" data-cidx="' + cIndex + '" style="font-size:12px; font-family:monospace; flex:1;" placeholder="分岐先" value="' + (choice.goToSectionTitle || '') + '">' : ''}
          <button class="btn btn-sm c-del" data-idx="${index}" data-cidx="${cIndex}" style="color:#dc2626; border:none; padding:0 4px;">✕</button>
        `;
        choiceContainer.appendChild(cRow);
        
        cRow.querySelector('.c-val').addEventListener('input', function() { 
          var pIdx = parseInt(this.getAttribute('data-idx'), 10);
          var cIdx = parseInt(this.getAttribute('data-cidx'), 10);
          currentData.items[pIdx].choices[cIdx].value = this.value; 
          syncVisualToJson(); 
        });
        
        var cBranch = cRow.querySelector('.c-branch');
        if(cBranch) cBranch.addEventListener('input', function() { 
          var pIdx = parseInt(this.getAttribute('data-idx'), 10);
          var cIdx = parseInt(this.getAttribute('data-cidx'), 10);
          updateChoiceBranch(pIdx, cIdx, this.value); 
        });
        
        var cCorrect = cRow.querySelector('.c-correct');
        if(cCorrect) cCorrect.addEventListener('change', function() { 
          var pIdx = parseInt(this.getAttribute('data-idx'), 10);
          var cIdx = parseInt(this.getAttribute('data-cidx'), 10);
          updateChoiceCorrect(pIdx, cIdx, this.checked); 
        });
        
        cRow.querySelector('.c-del').addEventListener('click', function() { 
          var pIdx = parseInt(this.getAttribute('data-idx'), 10);
          var cIdx = parseInt(this.getAttribute('data-cidx'), 10);
          removeChoice(pIdx, cIdx); 
        });
      });
      
      card.querySelector('.btn-add-choice').addEventListener('click', function() { 
        addChoiceOption(parseInt(this.getAttribute('data-idx'), 10)); 
      });
    }
  });
}

function changeItemType(idx, newType) {
  currentData.items[idx].type = newType;
  if (['radio', 'checkbox', 'dropdown'].includes(newType) && !currentData.items[idx].choices) {
    currentData.items[idx].choices = [{ value: "選択肢1", isCorrect: false }];
  }
  syncVisualToJson(); renderVisualEditor(currentData);
}
function updateChoiceBranch(idx, cIdx, val) { 
  if(!val) { delete currentData.items[idx].choices[cIdx].goToSectionTitle; } 
  else { currentData.items[idx].choices[cIdx].goToSectionTitle = val; }
  syncVisualToJson(); 
}
function updateChoiceCorrect(idx, cIdx, val) {
  if (currentData.items[idx].type !== 'checkbox' && val) {
    for(var x=0; x<currentData.items[idx].choices.length; x++) {
      currentData.items[idx].choices[x].isCorrect = (x === cIdx);
    }
  } else {
    currentData.items[idx].choices[cIdx].isCorrect = val;
  }
  syncVisualToJson(); renderVisualEditor(currentData);
}
function addChoiceOption(idx) { currentData.items[idx].choices.push({ value: "新しい選択肢", isCorrect: false }); syncVisualToJson(); renderVisualEditor(currentData); }
function removeChoice(idx, cIdx) { currentData.items[idx].choices.splice(cIdx, 1); syncVisualToJson(); renderVisualEditor(currentData); }

function addNewItem(type) {
  var newItem = { type: type, title: type === 'section' ? "新しいセクション" : "新しい質問", required: false };
  if (['radio', 'checkbox', 'dropdown'].includes(type)) newItem.choices = [{ value: "選択肢1", isCorrect: false }];
  if (type === 'section') newItem.pageNavigation = "CONTINUE";
  if (currentData.isQuiz && type !== 'section') newItem.points = 10;
  currentData.items.push(newItem);
  syncVisualToJson(); renderVisualEditor(currentData);
}
function removeItem(idx) { currentData.items.splice(idx, 1); syncVisualToJson(); renderVisualEditor(currentData); }
function moveItem(idx, direction) {
  var targetIdx = idx + direction;
  if (targetIdx < 0 || targetIdx >= currentData.items.length) return;
  var temp = currentData.items[idx]; currentData.items[idx] = currentData.items[targetIdx]; currentData.items[targetIdx] = temp;
  syncVisualToJson(); renderVisualEditor(currentData);
}

function generateForm() {
  var btn = document.getElementById('btnCreate');
  var status = document.getElementById('status');
  var success = document.getElementById('successArea');
  btn.disabled = true; success.innerHTML = ''; status.style.display = 'block'; status.innerHTML = "Googleフォームを生成中...";
  google.script.run.withSuccessHandler(function(res) {
    btn.disabled = false;
    if (res.success) {
      currentFormId = res.id; status.style.display = 'none';
      success.innerHTML = `
        <div class="success-banner">
          <strong>フォームを作成しました。</strong><br><br>
          <a href="${res.editUrl}" target="_blank">🔗 編集画面を開く</a><br>
          <a href="${res.publishedUrl}" target="_blank">🔗 回答画面を開く</a><br>
        </div>`;
    } else { status.innerHTML = 'エラー: ' + res.message; }
  }).createFormFromJson(JSON.stringify(currentData));
}


</script>

</body>
</html>