---
url: "/de/emailify/design/ai-designer.md"
description: "Erstelle Emailify-Vorlagen im eigenen Branding mit einem Agent-Skill, einem Copy-and-paste-Workflow für LLMs oder einem verbundenen KI-Anbieter."
---

# E-Mails mit dem AI Designer erstellen

> Erstelle Emailify-Vorlagen im eigenen Branding mit einem Agent-Skill, einem Copy-and-paste-Workflow für LLMs oder einem verbundenen KI-Anbieter.

Der Tab **AI Designer** verbindet deine Emailify-Komponentenbibliothek mit KI-Tools. Emailify bleibt dabei dafür zuständig, das Ergebnis zu prüfen und die fertige Figma-Vorlage zu erstellen. Wähl je nach Arbeitsweise **Agent (Skill)**, **Copy & Paste Prompt** oder **LLM Provider API**.

> **Note:** Der AI Designer ist derzeit in der Beta und wird aktiv weiterentwickelt. Oberfläche, heruntergeladener Skill, Agent-Anweisungen, Prompts, Prüfung und Workflow-Schritte können sich ändern, während wir das Erlebnis anhand von Kundenfeedback verbessern.

**Agent (Skill)** ist die empfohlene Standardwahl für wiederholte Nutzung und große Bibliotheken im eigenen Branding. Der Skill bündelt deinen Komponentenkatalog, die Referenzen auf bearbeitbare Slots, das Markenprofil, die Textrichtlinie, das Antwortschema und den Validator. Er nutzt einen kompakten Index und öffnet ausführliche Komponentendateien nur bei Bedarf, sodass nicht mit jedem Briefing der komplette Katalog mitgeschickt wird.

> **Warning:** Agent (Skill) und Copy & Paste Prompt senden dein Briefing und deine Komponentenbibliothek nicht aus dem Plugin heraus an ein KI-Modell. LLM Provider API sendet die erzeugte Anfrage mit deinem eigenen API-Schlüssel an den KI-Anbieter, den du auswählst.

## So funktioniert es {#how-it-works}

1. Öffne Emailify in Figma.
2. Klick auf das **+**-Icon neben der E-Mail-Auswahl, um das Modal **New Email** zu öffnen.
3. Wähl **AI Designer** aus.
4. Wähl einen der drei Workflow-Tabs:
   - **Agent (Skill):** Lade einen wiederverwendbaren Skill herunter, lade ihn in Codex oder Claude Code und gib dem Agenten dann dein Briefing.
   - **Copy & Paste Prompt:** Füg dein Briefing hinzu, kopier den erzeugten Prompt in ein beliebiges unterstütztes LLM und füg dessen JSON-Antwort dann wieder in Emailify ein.
   - **LLM Provider API:** Füg dein Briefing hinzu und erzeug das JSON mit deinem eigenen API-Schlüssel direkt über ChatGPT, Claude oder Gemini.
5. Prüf oder importier im letzten Schritt das erzeugte JSON.
6. Wenn die Antwort gültig ist, klick auf **Create Email** bzw. bei einer Antwort mit mehreren E-Mails auf **Create 2 Emails** (usw.).

Emailify prüft die Antwort vor dem Einfügen, erstellt einen neuen Emailify-Frame in Figma, fügt die ausgewählten Komponenteninstanzen in der zurückgegebenen Reihenfolge ein und wendet unterstützte Überschreibungen für Text, Links, Bilder, Alt-Text und ausgeblendete Ebenen an. Komponenten im eigenen Branding bleiben verknüpfte Instanzen, nachdem ihr Inhalt aktualisiert wurde.

## Workflow auswählen {#choose-a-workflow}

### Agent (Skill) {#agent-skill}

Nutze **Agent (Skill)**, wenn du regelmäßig E-Mails aus derselben Komponentenbibliothek im eigenen Branding erzeugst, einen großen Katalog hast oder willst, dass dein Agent Dateien lokal prüft, bevor er sie zurückgibt. Das ist für wiederholte Arbeit der Modus mit dem geringsten Token-Verbrauch, weil der Katalog einmal installiert und schrittweise durchsucht wird.

### Copy & Paste Prompt {#copy-paste-prompt}

Nutze **Copy & Paste Prompt** für einen schnellen manuellen Workflow mit ChatGPT, Claude, Gemini oder einem anderen leistungsfähigen LLM:

1. Füg dein Briefing in **Add Email Brief** ein.
2. Klick auf **Copy Prompt**.
3. Füg den Prompt in dein LLM ein und bitte es, nur das angeforderte JSON zurückzugeben.
4. Füg die Antwort in **Paste LLM Result** ein oder importiere sie dort.
5. Klick auf **Create Email**, sobald die Prüfung erfolgreich ist.

Bei Briefings mit mehreren E-Mails konzentriert Emailify den kopierten Prompt jeweils auf eine E-Mail. Der Button zeigt die Nummer der aktuellen E-Mail, damit jede Antwort vollständig bleibt und innerhalb des Ausgabelimits des Modells liegt.

### LLM Provider API {#llm-provider-api}

Nutze **LLM Provider API**, wenn Emailify das Erzeugen von Prompt und JSON übernehmen soll, ohne dass du zwischen Apps kopieren musst:

1. Füg dein Briefing in **Add Email Brief** ein.
2. Wähl ChatGPT, Claude oder Gemini aus.
3. Füg den API-Schlüssel des Anbieters hinzu, falls er im AI Designer noch nicht konfiguriert ist.
4. Klick auf **Generate 1 Email Draft**. Die Zahl entspricht der Anzahl der E-Mails in deinem Briefing, zum Beispiel **Generate 3 Email Drafts**.
5. Prüf das erzeugte JSON und klick dann auf **Create Email**, sobald die Prüfung erfolgreich ist.

Das Feld für den API-Schlüssel wird standardmäßig angezeigt. Nachdem du einen Schlüssel gespeichert hast, zeigt Emailify ihn als maskiertes, schreibgeschütztes Passwortfeld an. Klick auf den Stift-Button **Edit**, um ihn zu ersetzen. API-Schlüssel werden pro Figma-Nutzer auf deinem Gerät gespeichert und nicht in die Figma-Datei geschrieben. Briefings mit mehreren E-Mails werden als separate Anfragen an den Anbieter erzeugt und zu einem geprüften Ergebnis zusammengeführt, um abgeschnittene Antworten zu vermeiden.

Emailify prüft jedes erzeugte Ergebnis, bevor **Create Email** aktiviert wird. Wenn der Anbieter gültiges JSON mit falschen Referenzen auf Komponenten oder bearbeitbare Slots zurückgibt, sendet Emailify automatisch eine katalogbezogene Reparaturanfrage an denselben Anbieter. Das Modal „New Email“ bleibt während der Erzeugung und der automatischen Reparatur deaktiviert. Wenn das reparierte Ergebnis die Prüfung besteht, wird **Create Email** ohne weiteren Schritt verfügbar.

Wenn die automatische Reparatur die Antwort nicht korrigieren kann, behält Emailify das erzeugte JSON, zeigt das verbleibende Prüfungsproblem an und blendet **Repair** ein, damit du es erneut versuchen kannst. Eine automatische Reparatur nutzt nur dann eine zusätzliche API-Anfrage beim Anbieter, wenn das erste Ergebnis einen blockierenden Prüfungsfehler hat.

> **Note:** Die API-Nutzung wird von deinem ausgewählten Anbieter abgerechnet. Emailify berechnet keine zusätzlichen Gebühren für die Modellnutzung.

## Workflow mit Agent (Skill) {#agent-skill-workflow}

### Schritt 1: Skill herunterladen {#step-1-download-skill}

Der AI Designer verwendet automatisch die Emailify-Komponenten in der aktuellen Figma-Datei als primären Katalog des Skills. Dazu gehören lokale Komponenten und Instanzen von Design-System-Komponenten, die bereits in der Datei verwendet werden. Ein separater Schritt zur Auswahl der Quelle entfällt also.

Wenn die aktuelle Datei keine Emailify-Komponenten enthält, verwendet der AI Designer stattdessen automatisch **Default Emailify Presets**. Wenn Figma-Komponenten im eigenen Branding vorhanden sind, werden die Emailify-Vorlagen nicht als Fallback einbezogen, sodass die erzeugte E-Mail strikt im eigenen Branding bleibt.

Schritt 1 hat bewusst nur eine Aktion: **Download Skill**. Lade ihn erneut herunter, sobald sich die aktuelle Komponentenbibliothek ändert oder **Copy Instructions** deaktiviert wird, und ersetze dann den älteren installierten Skill durch das neue Paket.

> **Note:** Für ein Ergebnis, das möglichst genau deinem Branding entspricht, lege wiederverwendbare Header, Footer, Hero-Rows, CTA-Rows, Disclaimer, Produkt-Rows und Inhaltsblöcke in dieselbe Figma-Datei, bevor du den Skill herunterlädst.

### Feste und rechtliche Inhalte schützen {#protect-fixed-and-legal-content}

Damit ein Agent feste Texte nicht ändert, sperr die Ebene oder ihre übergeordnete Gruppe in Figma. Du kannst dem Namen der Ebene oder Gruppe auch `🔒` voranstellen, zum Beispiel `🔒 Legal`.

Der AI Designer exportiert diese Ebenen als geschützte Slots. Der heruntergeladene Skill weist den Agenten an, sie weder zu überschreiben noch auszublenden, sein Validator lehnt jede versuchte Änderung ab, und Emailify lässt den ursprünglichen Komponenteninhalt beim Import unverändert. Nutze das für freigegebene Rechtstexte, Disclaimer, Footer-Angaben, Compliance-Texte oder andere Inhalte, die unverändert bleiben müssen.

### Direkt mit Figma MCP bauen {#build-directly-with-figma-mcp}

Wenn Schreibwerkzeuge für Figma verfügbar sind, kann der heruntergeladene Skill eine E-Mail direkt in Figma zusammenstellen oder aktualisieren. Die Emailify-Komponenten bleiben dabei mit ihren ursprünglichen Hauptkomponenten verknüpft. Der Agent muss die genauen Konventionen von Emailify für Frames, Instanzen und Metadaten zu Betreffzeile und Preheader einhalten, damit das Plugin das Ergebnis übernehmen kann.

Unter [Emailify mit Figma MCP verwenden](/de/emailify/design/figma-mcp) findest du die maßgebliche Agent-Anweisung, die Namenskonventionen, Schutzmechanismen beim Bearbeiten und Schritte zur Fehlerbehebung. Der Import per geprüftem JSON bleibt verfügbar, wenn direktes Schreiben in Figma nicht möglich ist.

### Schritt 2: Mit deinem Agenten erzeugen {#step-2-generate-with-your-agent}

Der in Schritt 1 heruntergeladene Emailify-Skill ist eine versionierte ZIP-Datei mit einem installationsbereiten Ordner `emailify-ai-designer`. Ihr eindeutiger Dateiname enthält die Skill-Version, den Exportzeitpunkt in UTC auf die Millisekunde genau, den Katalog-Fingerprint und den Konfigurations-Fingerprint, zum Beispiel `emailify-ai-designer-v11-20260722T130512123Z-a1-5bixn7-k11-abc123.zip`.

- `SKILL.md` mit dem wiederverwendbaren Agent-Workflow und den Ausgaberegeln.
- `INSTALL.md` mit den Einrichtungspfaden für Codex und Claude Code und der kombinierten Agent-Anweisung.
- `manifest.json` mit dem genauen Paketdateinamen, der Skill-Version, dem Exportzeitpunkt, dem Katalog-Fingerprint, dem Konfigurations-Fingerprint, der Quelle, dem Fallback-Status und dem aktiven Profil.
- `profile.json` mit Textrichtlinie, erforderlichen Rollen, freigegebenen Links und Team-Anweisungen.
- `catalog-index.json`, ein kompakter Komponentenindex für die Suche.
- `previews/*.jpg`, eine visuelle 1x-Referenz für jede erfolgreich exportierte Komponente.
- `components/*.json`, nach Rollen gruppierte Dateien mit genauen Komponenten- und Slot-Referenzen, einschließlich geschützter Slots.
- `plan-schema.json` und `scripts/validate-plan.js` zum Prüfen des Komponentenplans, bevor Texte zugeordnet werden.
- `response-schema.json` für schemagebundene Erzeugung.
- `scripts/search-components.js` und `scripts/inspect-component.js` für die tokensparende Suche im Katalog, ohne die komplette Bibliothek in den Kontext zu laden.
- `scripts/create-response-skeleton.js` zum Erstellen der genauen JSON-Hülle und der Überschreibungs-Arrays aus einem geprüften Plan.
- `scripts/validate-response.js`, ein lokaler Validator, den der Agent ausführt, bevor er eine Datei zurückgibt.
- `scripts/self-test.js` und `integrity.json` zum Prüfen von Paketdateien, Katalogreferenzen, Vorschaubildern und SHA-256-Hashes.
- `data-inventory.json`, das den Inhalt des Pakets auflistet und bestätigt, dass es keine Briefings, erzeugten E-Mail-Texte, API-Schlüssel oder Figma-Zugriffstokens enthält.
- `agents/openai.yaml` mit aktuellen Skill-Metadaten für Codex.
- `integration-contract.json`, eine kleine Übersicht der Abläufe, die den Frame-Vertrag für den direkten Weg über Figma MCP und die URL der maßgeblichen Dokumentation enthält.

Der Skill lädt deterministisch und schrittweise. Der Agent durchsucht den kompakten Index mit dem mitgelieferten Skript, sieht sich nur die vorausgewählten Komponenten und ihre `previewFile`-Bilder an, prüft einen kompakten Komponentenplan, erstellt ein Antwortgerüst, füllt die genauen Slot-Referenzen aus und prüft die fertige Antwort. Der komplette Katalog muss nicht in den Kontext des Modells.

### Skill installieren {#install-the-skill}

Klick nach dem Herunterladen des aktuellen Pakets auf **Copy Instructions**. Der Button ändert sich zu **Instructions Copied**, und Emailify bestätigt den nächsten Schritt. Füg die kopierte Anweisung in eine neue Aufgabe in Codex oder Claude Code ein. Die Anweisung nennt die genaue heruntergeladene ZIP-Datei, installiert oder ersetzt den Projekt-Skill und prüft Dateiname, Version, Exportzeitpunkt, Katalog-Fingerprint und Konfigurations-Fingerprint. Wenn ein Wert nicht übereinstimmt, hält der Agent an und bittet um einen neuen Download. Sobald der Agent bestätigt, dass `emailify-ai-designer` bereit ist, schick dein E-Mail-Briefing als nächste Nachricht:

```text
Find the exact Emailify Skill ZIP named [filename copied by Emailify] in my Downloads folder; if it is not there, ask me where I saved it. Replace any existing project skill named emailify-email-assembler or emailify-ai-designer with the skill from that ZIP. Read its manifest.json and verify the exact package filename, Skill version, export time, catalog fingerprint, and configuration fingerprint supplied in this instruction. If any value does not match exactly, stop and ask me to download the current Skill again. Run the installed skill's scripts/self-test.js and stop if it reports an integrity or catalog error. Confirm the installed project-skill path and complete package identity, and that emailify-ai-designer is ready. Then use the emailify-ai-designer skill to turn my attached or pasted email brief into one validated .emailify-ai.json file per email. Preserve supplied copy, use only components from the installed catalog, and write the files locally instead of pasting JSON into chat. If this message does not include an email brief, ask me to attach or paste it before generating anything.
```

Mit der kombinierten Anweisung wählt der aktuelle Agent selbst einen unterstützten Speicherort für Projekt-Skills und macht direkt mit dem Briefing weiter. Durch den Projektbereich bleiben der Katalog und das Profil der Figma-Datei im eigenen Branding an den passenden Workspace gebunden, statt einen globalen Skill zu ersetzen.

> **Note:** Skill-Version 11 ergänzt den abgesicherten direkten Workflow über Figma MCP um die Übernahme von Betreffzeile und Preheader und behält die Prüfung verknüpfter Instanzen, die Durchsetzung geschützter Slots und die genaue Prüfung der Paketidentität bei. Pakete, die in einer früheren Beta des AI Designer heruntergeladen wurden, werden nach diesem Update absichtlich als veraltet markiert. Lade den aktuellen Skill deshalb einmal herunter und installiere ihn, bevor du neue E-Mails erzeugst.

Für eine manuelle Installation entpackst du die ZIP-Datei und verschiebst den enthaltenen Ordner `emailify-ai-designer` an einen dieser Orte:

- **Persönlicher Skill in Codex:** `~/.agents/skills/emailify-ai-designer/`
- **Projekt-Skill in Codex:** `.agents/skills/emailify-ai-designer/`
- **Persönlicher Skill in Claude Code:** `~/.claude/skills/emailify-ai-designer/`
- **Projekt-Skill in Claude Code:** `.claude/skills/emailify-ai-designer/`

Der Ordner selbst muss `SKILL.md`, `manifest.json`, `catalog-index.json`, `previews/`, `components/` und die anderen heruntergeladenen Ressourcen enthalten. Starte nach der Installation eine neue Agent-Aufgabe, falls der Skill nicht sofort erscheint.

### Dem Agenten dein Briefing geben {#give-the-agent-your-brief}

Gib, soweit vorhanden, Kampagnenziel, Zielgruppe, Lifecycle-Phase, Timing, Betreffzeile, Preheader, freigegebene Texte, CTA-Texte, Links, Bild-URLs, Alt-Texte, Markenrichtlinien, rechtliche Anforderungen, ESP-Anforderungen, Merge-Tags und die gewünschte Reihenfolge der Module an.

Der Skill schreibt eine geprüfte `.emailify-ai.json`-Datei in dein Arbeitsverzeichnis. Bei großen Kampagnen erstellt er bevorzugt eine vollständige Datei pro E-Mail, statt unvollständiges oder abgeschnittenes JSON im Chat auszugeben.

Optional kannst du die Zuordnung von Komponenten eindeutiger machen, indem du der Beschreibung einer Figma-Komponente Zeilen wie `AI role: hero`, `AI intent: product launch`, `AI usage: use when an image and CTA are required` oder `AI notes: preserve the secondary legal line` hinzufügst. Diese Hinweise sind optional. Der AI Designer leitet Rollen und Kapazität von Komponenten auch aus Namen, Beschreibungen, bearbeitbaren Ebenen und Emailify-Metadaten ab.

### Schritt 3: Ergebnis des Agenten importieren {#step-3-import-agent-result}

Füg rohes JSON ein, zieh eine oder mehrere erzeugte `.emailify-ai.json`-Dateien auf das Antwortfeld oder klick auf **Choose File**. Emailify prüft das komplette Ergebnis automatisch.

Wenn das gesamte Ergebnis gültig ist, wird **Create Email** verfügbar. Bei einer gültigen Antwort mit mehreren E-Mails zeigt der Button die Anzahl der E-Mails, die erstellt werden. Wenn ein Teil ungültig ist, bleibt das Erstellen deaktiviert, und **Copy Fix Prompt** kopiert eine kompakte Reparaturanfrage, die du in dieselbe Agent-Aufgabe einfügen kannst. Die Reparaturanfrage nutzt den Skill, den dein Agent bereits geladen hat, statt den Komponentenkatalog zu wiederholen.

Du kannst den mitgelieferten Validator auch manuell im Ordner des installierten Skills ausführen:

```sh
node scripts/validate-response.js /path/to/email.emailify-ai.json
```

Emailify warnt dich, wenn der zuletzt heruntergeladene Skill nicht mehr zum aktuellen Komponentenkatalog, zur Quelle, zum Profil, zur Textrichtlinie, zur Fallback-Einstellung oder zur Version des Skill-Pakets passt. Lade den Skill neu herunter und ersetze den installierten, sobald sich eine dieser Eingaben ändert. Dein laufendes Ergebnis im AI Designer bleibt erhalten, wenn du im selben Modal **New Email** zu einem anderen Tab wechselst.

Die Aktualität des Katalogs umfasst Komponentennamen, Rollen, Kategorien, Beschreibungen, KI-Hinweise, Kapazitäten, Metadaten zu bearbeitbaren und geschützten Slots sowie eine schlanke visuelle Signatur. Lade den Skill herunter und installiere ihn neu, sobald Emailify ihn als veraltet markiert. Unveränderte Vorschaubilder werden in der aktuellen Plugin-Sitzung wiederverwendet, damit wiederholte Paket-Downloads schneller gehen.

Antworten des Emailify-Skills sind an den Katalog gebunden, nicht an das Briefing, und brauchen deshalb keinen `requestFingerprint`. Sie müssen `workflowMode: "external"`, die aktive `contentPolicy`, für jede E-Mail ein `unresolved`-Array und für jede Textüberschreibung `source: "provided"` oder `source: "generated"` angeben.

## Beispiel-Briefing {#example-brief}

```md
# 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 in Codex or Claude Code, let the Emailify Skill create a validated JSON response, and import it into Figma using your reusable branded components.

CTA:
Try AI Designer

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

## Prüfung und Formate von Antworten {#response-validation-and-formats}

Das Feld **JSON Response** akzeptiert rohes JSON, das du aus einem KI-Tool einfügst, abgelegte Dateien sowie eine oder mehrere importierte `.json`- oder `.emailify-ai.json`-Dateien.

Der AI Designer akzeptiert:

- einen E-Mail-Entwurf als einzelnes JSON-Objekt;
- mehrere E-Mail-Entwürfe in einem `emails`-Array;
- mehrere E-Mail-Entwürfe in einem `templates`-Array.

Antworten des Emailify-Skills werden mit dem Katalog-Fingerprint des Downloads abgeglichen. So kann Emailify veraltetes JSON blockieren, wenn sich die Komponentenbibliothek nach dem Herunterladen des Skills geändert hat.

Bevor **Create Email** aktiviert wird, prüft Emailify im Hintergrund Komponentenreferenzen, bearbeitbare Slots, URLs, freigegebene Links, Alt-Texte von Bildern, Platzhalterinhalte, erforderliche Rollen, die Position von Header und Footer, die Textrichtlinie und die Verwendung von Fallbacks.

Wenn das JSON ungültig ist, klick auf **Copy Fix Prompt** und füg den Prompt in dieselbe Aufgabe in Codex oder Claude Code ein, die das Ergebnis erzeugt hat. Ersetze den Inhalt des Antwortfelds durch das korrigierte JSON des Agenten.

## Beispiel einer JSON-Antwort {#example-json-response}

```json
{
  "schemaVersion": 1,
  "workflowMode": "external",
  "contentPolicy": "preserve",
  "catalogFingerprint": "a1-example",
  "emails": [
    {
      "name": "AI Designer Launch",
      "subject": "Build branded emails faster with AI Designer",
      "preheader": "Turn approved Emailify components into ready-to-review templates.",
      "timing": "",
      "job": "Introduce the feature and drive a test template",
      "unresolved": [],
      "components": [
        {
          "role": "hero",
          "componentRef": "c-example",
          "overrides": {
            "text": [
              {
                "slotRef": "t-example-title",
                "value": "Create on-brand emails from your approved components",
                "source": "provided"
              },
              {
                "slotRef": "t-example-body",
                "value": "Brief your campaign in Codex or Claude Code, let the Emailify Skill create a validated JSON response, and import it into Figma using your reusable branded components.",
                "source": "provided"
              },
              {
                "slotRef": "t-example-button",
                "value": "Try AI Designer",
                "source": "provided"
              }
            ],
            "links": [
              {
                "slotRef": "l-example-button",
                "value": "https://www.hypermatic.com/emailify/"
              }
            ],
            "images": [],
            "hidden": []
          }
        }
      ]
    }
  ]
}
```

Die Komponenten- und Slot-Referenzen oben dienen nur zur Veranschaulichung. Verwende immer die Referenzen, die im aktuellen Emailify-Skill exportiert wurden.

## JSON-Felder {#json-fields}

Die Antwort enthält auf oberster Ebene:

- `schemaVersion`: die Version des Antwortvertrags des AI Designer.
- `workflowMode`: `external` für Antworten des Emailify-Skills.
- `contentPolicy`: die Richtlinie des aktiven Profils: `preserve`, `light-edit` oder `draft-missing`.
- `catalogFingerprint`: kennzeichnet die erkannte Komponentenbibliothek, die im Skill exportiert wurde.
- `emails`: ein oder mehrere vollständige E-Mail-Entwürfe. Fokussierte Prompts für mehrere E-Mails enthalten jeweils eine E-Mail.

Jeder E-Mail-Entwurf enthält:

- `name`: den Namen des Figma-Frames für die erzeugte E-Mail.
- `subject`: die Betreffzeile der E-Mail.
- `preheader`: den Preheader-Text der E-Mail.
- `timing`: optionales Versand-Timing aus dem Briefing oder einen leeren String.
- `job`: optionales Ziel aus dem Briefing oder einen leeren String.
- `unresolved`: fehlende Texte, Links, Bilder, Aussagen oder rechtliche Inhalte, die vor dem Einfügen geklärt werden müssen.
- `components`: die geordnete Liste der einzufügenden Emailify-Komponenten.

Jede Komponente enthält:

- `role`: eine einfache Layout-Rolle wie `header`, `hero`, `content`, `cta`, `disclaimer` oder `footer`.
- `componentRef`: die kompakte Komponentenreferenz, die in den Prompt kopiert wurde. Emailify löst sie lokal in die genaue Figma-Komponente oder integrierte Vorlage auf.
- `overrides.text`: ein Array von Textersetzungen der Form `{slotRef, value, source}`, wobei `source` entweder `provided` oder `generated` ist.
- `overrides.links`: ein Array von Linkersetzungen der Form `{slotRef, value}` mit einfachen `http`- oder `https`-URLs.
- `overrides.images`: ein Array von Bildersetzungen der Form `{slotRef, url, alt, href}`.
- `overrides.hidden`: Slot-Referenzen, die ausgeblendet werden, wenn eine Komponente ungenutzte optionale oder Platzhalterinhalte hat.

Ältere Antworten mit genauen `componentId`-, `componentName`- und `presetKey`-Werten und benannten Überschreibungsobjekten werden aus Kompatibilitätsgründen weiterhin unterstützt.

## Best Practices {#best-practices}

- Verwende die genauen Komponentennamen aus deiner Emailify-Komponentenbibliothek, wenn du bestimmte Module im eigenen Branding willst.
- Setz Header-Komponenten an den Anfang und Footer-Komponenten ans Ende, sofern dein Briefing nichts anderes vorgibt.
- Verwende eine Hero- oder Feature-Komponente weit oben, wenn die Kampagne einen starken Einstieg braucht.
- Verwende einen klaren CTA pro E-Mail, sofern das Briefing nicht ausdrücklich mehrere CTAs verlangt.
- Verwende einfache absolute URLs, keine als Markdown formatierten Links.
- Gib für jede Bild-URL einen sinnvollen Alt-Text an.
- Übernimm Rechts-, Compliance-, Rabatt-, Timing-, Merge-Tag- und Disclaimer-Texte genau, wo es nötig ist.
- Verwende bei Kampagnen mit mehreren E-Mails eine klare Überschrift für jede E-Mail. Der Skill schreibt eine vollständige Antwortdatei pro E-Mail.
- Prüf die erzeugte Figma-Vorlage, bevor du sie zu deinem ESP exportierst.

## Fehlerbehebung {#troubleshooting}

- Wenn Emailify **The JSON could not be parsed** meldet, entferne Markdown-Codezäune, Kommentare, abschließende Kommas oder Text vor oder nach dem JSON.
- Wenn eine Komponente nicht passt, lade den aktuellen Skill herunter, installiere ihn neu und stell sicher, dass der Agent nur die exportierten `componentRef`- und `slotRef`-Werte verwendet.
- Wenn Platzhalterinhalte sichtbar bleiben, füg den Namen der ungenutzten Ebene oder des Slots zu `overrides.hidden` hinzu oder wähl eine einfachere Komponente.
- Wenn das Ergebnis generisch wirkt, stell sicher, dass deine Emailify-Komponenten im eigenen Branding in der aktuellen Datei sind, bevor du den Skill herunterlädst. Der Fallback auf Vorlagen wird automatisch deaktiviert, wenn Komponenten im eigenen Branding vorhanden sind.
- Wenn Emailify meldet, dass sich die Komponentenbibliothek geändert hat, lade den aktuellen Skill herunter, installiere ihn neu und erzeug das JSON dann mit dem neuen Fingerprint erneut.
- Wenn der Agent die genaue ZIP-Datei aus der kopierten Anweisung nicht findet, sag ihm, wo du diese Datei gespeichert hast, statt ihn einen anderen oder älteren Download wählen zu lassen.
- Wenn ein wiederverwendbarer KI-Workflow zu viele Tokens verbraucht, prüf, ob er `scripts/search-components.js` und `scripts/inspect-component.js` ausführt, statt `catalog-index.json` oder alle Rollendateien in den Kontext zu laden.
- Wenn ein heruntergeladenes Paket unvollständig oder verändert wirkt, führ im Ordner des installierten Skills `node scripts/self-test.js` aus und lade einen neuen Skill herunter, falls eine Integritätsprüfung fehlschlägt.
- Wenn der Preflight-Check unter der Richtlinie „preserve“ erzeugte Texte meldet, ändere die Textquelle, liefere die fehlenden Texte nach oder verwende ein Profil, das Entwürfe erlaubt.
- Bitte den Agenten bei einer großen Kampagne mit mehreren E-Mails, eine vollständige `.emailify-ai.json`-Datei pro E-Mail zu schreiben, und verwende im Briefing Überschriften wie `Email 1 - Welcome`, `Email 2 - Follow-up` und `Email 3 - Offer`.
