Figma デザインから GPT-4 による QA テストケース生成を Google Sheets

• •ターゲットAPIの認証情報が必要な場合あり
• •Google Sheets API認証情報
• •OpenAI API Key

{
  "id": "gILrUPCbGHiFohxP",
  "meta": {
    "instanceId": "8443f10082278c46aa5cf3acf8ff0f70061a2c58bce76efac814b16290845177",
    "templateCredsSetupCompleted": true
  },
  "name": "Generate QA Test Cases from Figma Designs to Google Sheets using GPT-4",
  "tags": [],
  "nodes": [
    {
      "id": "dc0b7549-a744-4aa6-9d81-6570eae6acdb",
      "name": "ワークフロー概要",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -1616,
        -320
      ],
      "parameters": {
        "color": 4,
        "width": 400,
        "height": 540,
        "content": "## 🎨 Figma to Test Cases Generator\n\nThis workflow automates QA test case generation from Figma designs using AI.\n\n**What it does:**\n- Fetches Figma file data via API\n- Analyzes UI elements and design structure\n- Generates 5-10 comprehensive test cases using OpenAI\n- Exports test cases to Google Sheets\n\n**Use Case:**\n- QA teams needing automated test case generation\n- Product teams documenting user flows\n- Design handoff with test coverage\n\n**Requirements:**\n- Figma Personal Access Token\n- OpenAI API key (gpt-4o-mini)\n- Google Sheets OAuth2 connection\n\n**Time Saved:** ~2-3 hours per design review"
      },
      "typeVersion": 1
    },
    {
      "id": "ef9db14b-34a0-497f-82c4-e0eb0d0fc498",
      "name": "セットアップガイド",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -1200,
        -560
      ],
      "parameters": {
        "color": 2,
        "width": 360,
        "height": 500,
        "content": "## ⚙️ Setup Instructions\n\n**Step 1: Get Figma Token**\n- Go to Figma → Settings → Personal Access Tokens\n- Create new token with read access\n- Save in n8n Credentials (Header Auth)\n- Header name: `X-Figma-Token`\n\n**Step 2: Configure OpenAI**\n- Add OpenAI API key in Credentials\n- Model: gpt-4o-mini (cost-effective)\n- Est. cost: $0.02-0.05 per run\n\n**Step 3: Connect Google Sheets**\n- Create sheet with columns: `title`, `steps`\n- Authorize Google Sheets OAuth2\n- Share sheet with service account\n\n**Step 4: Input Figma File ID**\n- Get file ID from Figma URL\n- Format: `figma.com/file/{FILE_ID}/...`\n- Pass as input to workflow"
      },
      "typeVersion": 1
    },
    {
      "id": "39541f14-cfd3-4c11-89b9-8e6aedc363fc",
      "name": "Figma API ノート",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -816,
        -480
      ],
      "parameters": {
        "color": 2,
        "width": 300,
        "height": 428,
        "content": "## 📌 Figma API Configuration\n\n**What it fetches:**\n- Complete file structure\n- Canvas and frame data\n- Component properties\n- Text and layer info\n\n**API Parameters:**\n- `depth=1`: Single level traversal\n- `geometry=paths`: Include vector data\n\n**Important:**\n- Replace file ID with dynamic input\n- Use: `={{$json.figmaFileId}}`\n- Timeout: 30s for large files\n- Rate limit: 500 requests/min"
      },
      "typeVersion": 1
    },
    {
      "id": "b24caffc-87cf-458e-aecb-bf00ca9309be",
      "name": "AI処理詳細",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -464,
        -448
      ],
      "parameters": {
        "color": 2,
        "width": 280,
        "height": 368,
        "content": "## 🤖 AI Test Generation\n\n**Analysis Includes:**\n- UI elements and interactions\n- User flow identification\n- Edge case scenarios\n- Accessibility checks (WCAG 2.1)\n- Responsive design validation\n\n**Output Format:**\nStructured JSON with test cases\n\n**Temperature:** 0.7 for creative variety\n\n**Token Usage:** ~2000-4000 per run"
      },
      "typeVersion": 1
    },
    {
      "id": "be300909-97ca-4d0c-b7f5-077cddc16f8f",
      "name": "コードロジック詳細",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -144,
        96
      ],
      "parameters": {
        "color": 2,
        "width": 280,
        "height": 260,
        "content": "## 📊 Data Extraction\n\n**Processes AI output:**\n- Extracts test_cases array\n- Maps to Google Sheets format\n- Handles multiple test cases\n\n**Output fields:**\n- title: Test case name\n- steps: Step-by-step instructions\n\n**Error handling:**\nReturns empty array if parsing fails"
      },
      "typeVersion": 1
    },
    {
      "id": "8aee5f1a-9b28-4951-a8c1-3438119266e9",
      "name": "Sheets設定",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        80,
        -560
      ],
      "parameters": {
        "color": 2,
        "width": 300,
        "height": 476,
        "content": "## 📝 Google Sheets Export\n\n**Configuration:**\n- Operation: Append (adds new rows)\n- Auto-map columns enabled\n- Columns: `title`, `steps`\n\n**Sheet Structure:**\n```\n| title              | steps                |\n|--------------------|-----------------------|\n| Test login flow    | Step 1: Click...     |\n| Validate form      | Step 1: Enter...     |\n```\n\n**Before sharing:**\n- Remove document ID\n- Use dynamic sheet reference\n- Clear cached result data"
      },
      "typeVersion": 1
    },
    {
      "id": "f2dee891-a0a2-4426-9f3e-b818a11b1e40",
      "name": "手動開始",
      "type": "n8n-nodes-base.manualTrigger",
      "position": [
        -960,
        -48
      ],
      "parameters": {},
      "typeVersion": 1
    },
    {
      "id": "a5cb1f68-d567-46f3-8aea-b462cede73c9",
      "name": "Figmaデザインデータ取得",
      "type": "n8n-nodes-base.httpRequest",
      "position": [
        -736,
        -48
      ],
      "parameters": {
        "url": "=https://api.figma.com/v1/files/{{ $json.figmaFileId }}",
        "options": {
          "timeout": 30000,
          "response": {
            "response": {
              "neverError": true,
              "responseFormat": "json"
            }
          }
        },
        "sendQuery": true,
        "authentication": "genericCredentialType",
        "genericAuthType": "httpHeaderAuth",
        "queryParameters": {
          "parameters": [
            {
              "name": "depth",
              "value": "1"
            },
            {
              "name": "geometry",
              "value": "paths"
            }
          ]
        }
      },
      "credentials": {
        "httpHeaderAuth": {
          "id": "VzF0MtEE87bk9mIH",
          "name": "Figma token"
        }
      },
      "typeVersion": 4.2
    },
    {
      "id": "96587a6a-4e70-4c6d-a9a8-a1da7e87e7a4",
      "name": "OpenAI GPT-4o-mini",
      "type": "@n8n/n8n-nodes-langchain.lmChatOpenAi",
      "position": [
        -512,
        192
      ],
      "parameters": {
        "model": {
          "__rl": true,
          "mode": "list",
          "value": "gpt-4o-mini",
          "cachedResultName": "gpt-4o-mini"
        },
        "options": {
          "maxTokens": 4000,
          "temperature": 0.7
        }
      },
      "credentials": {
        "openAiApi": {
          "id": "5Kzt6hGSZ1JHZqWN",
          "name": "OpenAi account 2"
        }
      },
      "typeVersion": 1.2
    },
    {
      "id": "1b3d7d55-f24f-4d95-a098-7128696e7e87",
      "name": "テストケース解析・フォーマット",
      "type": "n8n-nodes-base.code",
      "position": [
        -48,
        -48
      ],
      "parameters": {
        "jsCode": "// Extract test cases from AI agent output\nconst aiOutput = $json.output;\n\n// Safely extract test cases array\nconst testCases = aiOutput?.test_cases || [];\n\n// Validate and map to Google Sheets format\nif (!Array.isArray(testCases) || testCases.length === 0) {\n  console.log('No test cases generated');\n  return [];\n}\n\n// Transform to structured output\nreturn testCases.map(tc => ({\n  json: {\n    title: tc.title || 'Untitled Test Case',\n    steps: tc.steps || 'No steps provided'\n  }\n}));"
      },
      "typeVersion": 2
    },
    {
      "id": "1efaa8c3-a934-4702-9783-7da965178a27",
      "name": "Google Sheetsへエクスポート",
      "type": "n8n-nodes-base.googleSheets",
      "position": [
        176,
        -48
      ],
      "parameters": {
        "columns": {
          "value": {},
          "schema": [
            {
              "id": "title",
              "type": "string",
              "display": true,
              "removed": false,
              "required": false,
              "displayName": "title",
              "defaultMatch": false,
              "canBeUsedToMatch": true
            },
            {
              "id": "steps",
              "type": "string",
              "display": true,
              "removed": false,
              "required": false,
              "displayName": "steps",
              "defaultMatch": false,
              "canBeUsedToMatch": true
            }
          ],
          "mappingMode": "autoMapInputData",
          "matchingColumns": []
        },
        "options": {},
        "operation": "append",
        "sheetName": {
          "__rl": true,
          "mode": "list",
          "value": "Test Cases"
        },
        "documentId": {
          "__rl": true,
          "mode": "id",
          "value": "={{ $('Configure Figma File ID').item.json.googleSheetId }}"
        }
      },
      "credentials": {
        "googleSheetsOAuth2Api": {
          "id": "kpPEOLCGn963qpoh",
          "name": "automations@techdome.ai"
        }
      },
      "typeVersion": 4.7
    },
    {
      "id": "f3e20439-3b50-414a-a67f-2dd3d0324365",
      "name": "JSON 出力スキーマ",
      "type": "@n8n/n8n-nodes-langchain.outputParserStructured",
      "position": [
        -256,
        192
      ],
      "parameters": {
        "jsonSchemaExample": "{\n  \"test_cases\": [\n    {\n      \"title\": \"Test case title\",\n      \"steps\": \"Step 1: Action\\nStep 2: Verification\\nStep 3: Expected result\"\n    }\n  ]\n}"
      },
      "typeVersion": 1.3
    },
    {
      "id": "52e4bce6-4656-4658-833a-1d461fb743e5",
      "name": "会話メモリ",
      "type": "@n8n/n8n-nodes-langchain.memoryBufferWindow",
      "position": [
        -384,
        192
      ],
      "parameters": {
        "sessionKey": "=\"figma_test_generation_\" & $('Configure Figma File ID').item.json.figmaFileId",
        "sessionIdType": "customKey"
      },
      "typeVersion": 1.3
    },
    {
      "id": "0a245b2b-7d42-4dc4-9393-f07af71321f6",
      "name": "AIテストケースジェネレーター",
      "type": "@n8n/n8n-nodes-langchain.agent",
      "position": [
        -464,
        -48
      ],
      "parameters": {
        "text": "=Here is the Figma design data:\n\n{{ JSON.stringify($json, null, 2) }}\n\n**Generate 5-10 comprehensive test cases covering:**\n\n1. **UI Elements & Interactions**\n   - Button states and actions\n   - Form field validations\n   - Navigation flows\n\n2. **User Flows**\n   - Primary user journeys\n   - Alternative paths\n   - Error scenarios\n\n3. **Edge Cases**\n   - Empty states\n   - Maximum character limits\n   - Invalid inputs\n\n4. **Accessibility**\n   - Keyboard navigation\n   - Screen reader compatibility\n   - Color contrast (WCAG 2.1 AA)\n\n5. **Responsive Design**\n   - Mobile viewport behavior\n   - Tablet adjustments\n   - Desktop optimization\n\n**Return ONLY valid JSON in this exact structure:**\n\n```json\n{\n  \"test_cases\": [\n    {\n      \"title\": \"Descriptive test case title\",\n      \"steps\": \"Step 1: Detailed action\\nStep 2: Expected behavior\\nStep 3: Verification criteria\"\n    }\n  ]\n}\n```\n\n**Important:** Ensure each test case has clear, actionable steps.",
        "options": {
          "systemMessage": "You are an expert QA engineer and UX analyst specializing in test case generation.\n\n**Your expertise includes:**\n- Analyzing Figma design files and extracting testable elements\n- Creating comprehensive test scenarios for web and mobile applications\n- Identifying edge cases and accessibility requirements\n- Following industry-standard QA practices (ISTQB, Agile QA)\n\n**Your task:**\nReceive Figma file data as JSON and generate detailed, actionable test cases that cover:\n- Functional requirements\n- User experience flows\n- Accessibility compliance (WCAG 2.1)\n- Cross-browser/device compatibility\n- Edge cases and error handling\n\n**Output requirements:**\n- Return ONLY valid JSON matching the provided schema\n- Each test case must have a clear title and numbered steps\n- Steps should be specific, measurable, and executable\n- Include expected results in each step\n- Prioritize critical user paths first"
        },
        "promptType": "define",
        "hasOutputParser": true
      },
      "typeVersion": 2.1
    }
  ],
  "active": false,
  "pinData": {},
  "settings": {
    "executionOrder": "v1"
  },
  "versionId": "00a00b80-93a1-44c8-be7b-3cd1f78686fb",
  "connections": {
    "f2dee891-a0a2-4426-9f3e-b818a11b1e40": {
      "main": [
        [
          {
            "node": "a5cb1f68-d567-46f3-8aea-b462cede73c9",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "f3e20439-3b50-414a-a67f-2dd3d0324365": {
      "ai_outputParser": [
        [
          {
            "node": "0a245b2b-7d42-4dc4-9393-f07af71321f6",
            "type": "ai_outputParser",
            "index": 0
          }
        ]
      ]
    },
    "96587a6a-4e70-4c6d-a9a8-a1da7e87e7a4": {
      "ai_languageModel": [
        [
          {
            "node": "0a245b2b-7d42-4dc4-9393-f07af71321f6",
            "type": "ai_languageModel",
            "index": 0
          }
        ]
      ]
    },
    "52e4bce6-4656-4658-833a-1d461fb743e5": {
      "ai_memory": [
        [
          {
            "node": "0a245b2b-7d42-4dc4-9393-f07af71321f6",
            "type": "ai_memory",
            "index": 0
          }
        ]
      ]
    },
    "0a245b2b-7d42-4dc4-9393-f07af71321f6": {
      "main": [
        [
          {
            "node": "1b3d7d55-f24f-4d95-a098-7128696e7e87",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "a5cb1f68-d567-46f3-8aea-b462cede73c9": {
      "main": [
        [
          {
            "node": "0a245b2b-7d42-4dc4-9393-f07af71321f6",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "1b3d7d55-f24f-4d95-a098-7128696e7e87": {
      "main": [
        [
          {
            "node": "1efaa8c3-a934-4702-9783-7da965178a27",
            "type": "main",
            "index": 0
          }
        ]
      ]
    }
  }
}