LLM 모델을 사용하여 AI 드라이브드 UX/UI 프로토타입 이름(템플릿) 생성

• •HTTP Webhook 엔드포인트(n8n이 자동으로 생성)
• •OpenAI API Key

{
  "id": "ENCyyiKrIdlmcYTk",
  "meta": {
    "instanceId": "506e1eb999b7a8cf86103921b3e1b94e371534d9bae39d44754933678dc6697d",
    "templateCredsSetupCompleted": true
  },
  "name": "Generate AI-powered names for UX/UI mockups using any LLM model (template)",
  "tags": [
    {
      "id": "XnTVyrQY30pP85Ic",
      "name": "Personal",
      "createdAt": "2025-07-07T12:25:22.847Z",
      "updatedAt": "2025-07-07T12:25:22.847Z"
    }
  ],
  "nodes": [
    {
      "id": "9b60f8d7-3dab-4343-8d75-da64a798e273",
      "name": "메인 템플릿 설명",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -1136,
        256
      ],
      "parameters": {
        "width": 700,
        "height": 1316,
        "content": "# Description\n---\n\nThis n8n template demonstrates how to build an AI-powered name generator that creates realistic names perfect for UX/UI designers, developers, and content creators.\n\n**Use cases:** User persona creation, mockup development, prototype testing, customer testimonials, team member listings, app interface examples, website content, accessibility testing, and any scenario requiring realistic placeholder names.\n\n## How it works\n- **AI-Powered Generation:** Uses any LLM to generate names based on your specifications\n- **Customizable Parameters:** Accepts gender preferences, name count, and optional reference names for style matching\n- **UX/UI Optimized:** Names are specifically chosen to work well in design mockups and prototypes\n- **Smart Formatting:** Returns clean JSON arrays ready for integration with design tools and applications\n- **Reference Matching:** Can generate names similar in style to a provided reference name\n\n## How to set up\n1. Replace \"Dummy LLM API\" credentials with your preferred language model API key\n2. Update webhook path and authentication as needed for your application\n3. Test with different parameters: gender (masculine/feminine/neutral), count (1-20), reference_name (optional)\n4. Integrate webhook URL with your design tools, Bubble apps, or other platforms\n\n## Requirements\n- LLM API access (OpenAI, Claude, or other language model)\n- n8n instance (cloud or self-hosted)\n- Platform capable of making HTTP POST requests\n\n## API Usage\nPOST to webhook with JSON body:\n```json\n{\n  \"gender\": \"masculine\",\n  \"count\": 5,\n  \"reference_name\": \"Alex Chen\" // optional\n}\n```\n\nResponse:\n```json\n{\n  \"success\": true,\n  \"names\": [\"Marcus Johnson\", \"David Kim\", \"Sofia Rodriguez\", \"Chen Wei\", \"James Wilson\"],\n  \"count\": 5\n}\n```\n\n## How to customize\n- Modify AI prompt for specific naming styles or regions\n- Add additional parameters (age, profession, cultural background)\n- Connect to databases for persistent name storage\n- Integrate with design tools APIs (Figma, Sketch, Adobe XD)\n- Create batch processing for large mockup projects"
      },
      "typeVersion": 1
    },
    {
      "id": "feb931d7-b708-4d4c-8477-3b2ed547263d",
      "name": "Webhook 입력 노트",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -304,
        272
      ],
      "parameters": {
        "color": 4,
        "width": 400,
        "height": 128,
        "content": "## Webhook Input Processing\n\nReceives parameters: gender, count, reference_name (optional)"
      },
      "typeVersion": 1
    },
    {
      "id": "e1c1a53b-2f3e-44e8-ade2-d66e90da4d0d",
      "name": "AI 생성 노트",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        176,
        272
      ],
      "parameters": {
        "color": 3,
        "width": 400,
        "height": 128,
        "content": "## AI Name Generation\n\nGenerates names using OpenAI with specialized UX/UI prompting"
      },
      "typeVersion": 1
    },
    {
      "id": "b958e180-b34f-4d77-bc0a-82e65133ef4f",
      "name": "응답 형식 지정 노트",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        656,
        272
      ],
      "parameters": {
        "color": 5,
        "width": 400,
        "height": 128,
        "content": "## Response Formatting\n\nCleans and formats names into structured JSON array for easy integration"
      },
      "typeVersion": 1
    },
    {
      "id": "4deb7a89-e0bc-48c8-bca2-12cbb1f00fc1",
      "name": "Webhook 트리거 (이름 요청)",
      "type": "n8n-nodes-base.webhook",
      "position": [
        -112,
        432
      ],
      "webhookId": "generate-names",
      "parameters": {
        "path": "generate-names",
        "options": {},
        "httpMethod": "POST",
        "responseMode": "responseNode"
      },
      "typeVersion": 2
    },
    {
      "id": "6a42f135-a198-4da6-b588-5f3f373b9e7d",
      "name": "AI 이름 생성 에이전트",
      "type": "@n8n/n8n-nodes-langchain.agent",
      "position": [
        240,
        432
      ],
      "parameters": {
        "text": "={{ $json.body.reference_name ? \n   'Generate ' + $json.body.count + ' ' + $json.body.gender + ' names similar in style to: \"' + $json.body.reference_name + '\"' \n   : 'Generate ' + $json.body.count + ' random ' + $json.body.gender + ' names' }}",
        "options": {
          "systemMessage": "=Current date and time: {{$now}}\n\n# Overview\nYou are a UX/UI naming expert who generates diverse, realistic names that designers use in mockups, personas, prototypes, and user interface examples.\n\n# Task\nGenerate culturally diverse names from all continents that UX/UI designers would use in their work. Names should be:\n- Realistic and professional\n- Culturally authentic and respectful\n- Suitable for user personas, mockups, and prototypes\n- Representative of global diversity\n- Easy to pronounce and remember\n\n## Name Distribution by Region\nInclude names from:\n- **North America**: English, Spanish, French Canadian, Indigenous\n- **South America**: Spanish, Portuguese, Indigenous variants\n- **Europe**: Nordic, Germanic, Romance, Slavic, Celtic\n- **Africa**: West African, East African, North African, South African\n- **Asia**: East Asian, Southeast Asian, South Asian, Middle Eastern\n- **Oceania**: Australian, Polynesian, Melanesian, Micronesian\n\n## UX/UI Context Examples\nNames should work well in:\n- User persona profiles\n- Customer testimonials in mockups\n- User account examples\n- Team member listings\n- Contact forms and directories\n- App user interfaces\n- Website testimonials\n\n## Output Format\n- Generate exactly {{ $json.body.count }} names\n- Return ONLY names, one per line\n- \"First Last\" format\n- NO numbering or extra text\n- Ensure continental diversity across the full list\n\nExample output:\nChen Wei-Ming\nSofia Andersson\nRaj Patel\nIsabella Rodriguez"
        },
        "promptType": "define"
      },
      "typeVersion": 2
    },
    {
      "id": "1408c494-f7f0-4223-affd-44b1eeae6790",
      "name": "OpenAI GPT-4.1 Mini",
      "type": "@n8n/n8n-nodes-langchain.lmChatOpenAi",
      "position": [
        64,
        656
      ],
      "parameters": {
        "model": {
          "__rl": true,
          "mode": "list",
          "value": "gpt-4.1-mini"
        },
        "options": {
          "maxTokens": 150,
          "temperature": 0.7
        }
      },
      "credentials": {
        "openAiApi": {
          "id": "mvWns3smwtPV0N7O",
          "name": "Dummy OpenAI"
        }
      },
      "typeVersion": 1.2
    },
    {
      "id": "8fd94983-793e-418c-90ab-5955b92d5578",
      "name": "이름 결과 형식 지정",
      "type": "n8n-nodes-base.code",
      "position": [
        656,
        432
      ],
      "parameters": {
        "jsCode": "// Get the AI output\nconst aiOutput = $input.first().json.output || $input.first().json.text;\n\nconsole.log('Raw AI Output:', aiOutput);\n\nif (!aiOutput) {\n  return {\n    json: {\n      success: false,\n      error: \"No output from AI\",\n      names: []\n    }\n  };\n}\n\n// Split the names into an array\nlet names = [];\n\ntry {\n  // Split by lines and clean up\n  names = aiOutput.toString()\n    .split('\\n')\n    .map(line => line.trim())\n    .filter(line => line.length > 0)\n    .map(line => {\n      // Remove numbering if present (1. 2. etc.)\n      let cleaned = line.replace(/^\\d+[\\.\\)]\\s*/, '');\n      return cleaned.trim();\n    })\n    .filter(name => name.length > 0 && name.length < 50); // Filter out overly long responses\n  \n} catch (error) {\n  console.error('Error parsing names:', error);\n  return {\n    json: {\n      success: false,\n      error: \"Failed to parse names\",\n      names: []\n    }\n  };\n}\n\n// Return structured response for easy integration\nreturn {\n  json: {\n    success: true,\n    names: names,\n    count: names.length,\n    generated_at: new Date().toISOString(),\n    request_params: {\n      gender: $('Webhook Trigger (Name Request)').item.json.body.gender,\n      requested_count: $('Webhook Trigger (Name Request)').item.json.body.count,\n      reference_name: $('Webhook Trigger (Name Request)').item.json.body.reference_name || null\n    }\n  }\n};"
      },
      "typeVersion": 2
    },
    {
      "id": "a0544c45-089c-4f97-8a59-12ea041fa84b",
      "name": "이름 응답 반환",
      "type": "n8n-nodes-base.respondToWebhook",
      "position": [
        928,
        432
      ],
      "parameters": {
        "options": {},
        "respondWith": "json",
        "responseBody": "={{ $json }}"
      },
      "typeVersion": 1.4
    }
  ],
  "active": false,
  "pinData": {},
  "settings": {
    "executionOrder": "v1"
  },
  "versionId": "26e8803f-c519-494c-867c-6e88ebdf6553",
  "connections": {
    "8fd94983-793e-418c-90ab-5955b92d5578": {
      "main": [
        [
          {
            "node": "a0544c45-089c-4f97-8a59-12ea041fa84b",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "1408c494-f7f0-4223-affd-44b1eeae6790": {
      "ai_languageModel": [
        [
          {
            "node": "6a42f135-a198-4da6-b588-5f3f373b9e7d",
            "type": "ai_languageModel",
            "index": 0
          }
        ]
      ]
    },
    "6a42f135-a198-4da6-b588-5f3f373b9e7d": {
      "main": [
        [
          {
            "node": "8fd94983-793e-418c-90ab-5955b92d5578",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "4deb7a89-e0bc-48c8-bca2-12cbb1f00fc1": {
      "main": [
        [
          {
            "node": "6a42f135-a198-4da6-b588-5f3f373b9e7d",
            "type": "main",
            "index": 0
          }
        ]
      ]
    }
  }
}