The AI Designer (BETA) tab helps you turn a campaign brief, draft copy, and your Emailify component library into one or more ready-to-review Emailify templates in Figma.

AI Designer currently uses a manual LLM workflow. Emailify prepares a structured prompt from your selected component source, you paste that prompt into an AI tool such as Claude, ChatGPT, or Gemini, then you paste the JSON response back into Emailify.

AI Designer does not send your brief to an AI model from inside the plugin. You choose which AI tool to use and where to paste the generated prompt.

How it works

1. Open Emailify in Figma.
2. Click the + icon in the plugin header to open the New Email modal.
3. Select the AI Designer (BETA) tab.
4. Choose your component source.
5. Paste your campaign brief and draft copy.
6. Click Copy Prompt, then paste the prompt into your preferred LLM.
7. Paste the raw JSON response into Emailify.
8. Click Create Email Template.

Emailify creates a new Emailify frame in Figma, inserts the selected component instances, and applies supported text, link, image, alt text, and hidden-layer overrides.

Step 1: Component Source

Choose which components the LLM should use when planning the email.

• Current Figma Emailify Library uses Emailify components found in the current Figma file. This is best when you already have approved branded components.
• Default Emailify Presets uses Emailify's included preset components. If the current Figma file does not contain any Emailify components, AI Designer selects this source automatically.

When Current Figma Emailify Library is selected, you can keep Fallback to built-in presets enabled. This lets the LLM use built-in Emailify presets only when no branded component is a good fit.

For the most branded result, keep reusable headers, footers, hero rows, CTA rows, disclaimers, product rows, and content blocks in the same Figma file before generating the prompt.

Step 2: Brief + Draft Copy

Paste everything the AI tool needs to design the email:

• Campaign goal, audience, lifecycle stage, timing, and offer.
• Subject line and preheader.
• Approved draft copy, CTA copy, links, image URLs, and alt text.
• Brand guidance, legal requirements, disclaimer copy, ESP requirements, and merge tags.
• Any preferred module order or exact Emailify component names.

Click Copy Prompt after pasting the brief. The copied prompt is generated from the latest text in the brief field, so edits or re-pasted content are included the next time you copy it.

Example brief

# Product Launch Email - Brief + Draft Copy

Audience: Trial users who created an account but have not exported an email.
Goal: Announce the new AI Designer beta and drive users to create a test template.
Tone: Practical, confident, helpful.

Subject: Build branded emails faster with AI Designer
Preheader: Turn approved Emailify components into ready-to-review templates.

Module order:
- Header: use the standard logo header.
- Hero: introduce AI Designer and the main value proposition.
- Content: explain that the workflow uses approved Emailify components first.
- CTA: button linking to https://www.hypermatic.com/emailify/
- Footer: keep the standard footer unchanged.

Hero copy:
Create on-brand emails from your approved components.

Body copy:
Brief your campaign, copy a structured prompt into your preferred AI tool, and let Emailify assemble the response in Figma using your reusable branded components.

CTA:
Try AI Designer

Compliance:
Do not invent claims, discounts, testimonials, or legal copy.

Step 3: JSON Response

Ask your AI tool to return strict JSON only, then paste the raw JSON into the JSON Response field.

AI Designer accepts:

• One email draft as a single JSON object.
• Multiple email drafts in an emails array.
• Multiple email drafts in a templates array.

If the JSON is not valid, Emailify shows The JSON could not be parsed.

Example JSON response

{
  "name": "AI Designer Launch",
  "subject": "Build branded emails faster with AI Designer",
  "preheader": "Turn approved Emailify components into ready-to-review templates.",
  "components": [
    {
      "role": "header",
      "componentId": "",
      "componentName": "Logo Center",
      "presetKey": "headerLogoCenter",
      "overrides": {
        "text": {},
        "links": {},
        "images": {},
        "altText": {},
        "hidden": []
      }
    },
    {
      "role": "hero",
      "componentId": "",
      "componentName": "Title, Paragraph, Button",
      "presetKey": "contentTextParagraphTitleButton",
      "overrides": {
        "text": {
          "title": "Create on-brand emails from your approved components",
          "body": "Brief your campaign, copy a structured prompt into your preferred AI tool, and let Emailify assemble the response in Figma using your reusable branded components.",
          "button": "Try AI Designer"
        },
        "links": {
          "button": "https://www.hypermatic.com/emailify/"
        },
        "images": {},
        "altText": {},
        "hidden": []
      }
    },
    {
      "role": "footer",
      "componentId": "",
      "componentName": "Footer Social Logo Center",
      "presetKey": "footerSocialLogoCenter",
      "overrides": {
        "text": {},
        "links": {},
        "images": {},
        "altText": {},
        "hidden": []
      }
    }
  ]
}

JSON fields

Each email draft can include:

• name: the Figma frame name for the generated email.
• subject: the email subject line.
• preheader: the email preheader text.
• components: the ordered list of Emailify components to insert.

Each component can include:

• role: a simple layout role such as header, hero, content, cta, disclaimer, or footer.
• componentId: the Figma component ID for a component from the current file.
• componentName: the exact component name from the selected catalog.
• presetKey: the built-in Emailify preset key, when using default presets.
• fallbackPresetKey: an optional built-in preset key to use when a Figma component is unavailable.
• overrides.text: text layer replacements.
• overrides.links: link replacements using plain http or https URLs.
• overrides.images: image replacements with url, alt, and optional href.
• overrides.altText: alt text replacements for image slots.
• overrides.hidden: exact layer or slot names to hide when a component has unused placeholder content.

Best practices

• Use exact component names from your Emailify component library when you want specific branded modules.
• Keep header components first and footer components last unless your brief says otherwise.
• Use a hero or feature component near the top when the campaign needs a strong opening message.
• Use one clear CTA per email unless the brief specifically asks for multiple CTAs.
• Use plain absolute URLs, not markdown-formatted links.
• Include useful alt text for every image URL.
• Preserve legal, compliance, discount, timing, merge tag, and disclaimer copy exactly where required.
• Review the generated Figma template before exporting it to your ESP.

Troubleshooting

• If Emailify says The JSON could not be parsed, remove markdown fences, comments, trailing commas, or any text before or after the JSON.
• If a component does not match, ask the LLM to use only component names, IDs, preset keys, and slot names from the copied prompt.
• If placeholder content remains visible, add the unused layer or slot name to overrides.hidden, or choose a simpler component.
• If the output feels generic, switch to Current Figma Emailify Library and make sure your branded Emailify components are in the current file.