Wenn du Produkte auslieferst, kennst du die Lücke: Das Feature läuft, die Landingpage steht, und jetzt brauchst du ein Hero-Video, einen Header für die README und einen Clip für die Ankündigung. Normalerweise heißt das: raus aus dem Editor, rein in ein anderes Tool, mit einem Asset zurück und viel verlorene Konzentration. Diese Anleitung schließt die Lücke. Füge den MCP-Server von 8frame zu Cursor oder Claude Code hinzu, und du generierst Bilder und Videos im selben Fenster, in dem du Code schreibst.
Der MCP-Server von 8frame bietet Bildgenerierung und Bildbearbeitung, Hintergrundentfernung, Bild-Upscaling, Video und Musik. Cursor und Claude Code sind beide MCP-Clients: Sobald der Server in ihrer Konfiguration steht, kann der Coding-Agent ihn wie jedes andere Tool aufrufen. Du beschreibst das Asset im Chat-Panel, 8frame generiert es, und das Ergebnis kommt als Dateilink zurück. Unten findest du die Konfiguration für beide, die Entwickler-Anwendungsfälle, in die das passt, und die Realität bei der Latenz, damit du weißt, wann es sich lohnt und wann nicht.
Was du im Editor machen kannst
Die Kernschritte des Canvas: ein Standbild generieren, es animieren, ein vorhandenes Bild bearbeiten, ein Standbild hochskalieren. Der Unterschied: Du machst es direkt neben deinem Build, mit weniger Einstellungen pro Modell, als der Canvas bietet. Wofür Entwickler am häufigsten greifen:
- Promo-Clips zum Release für den Launch-Post, die Produktseite oder Anzeigen, die auf deinen Store-Eintrag verweisen (für die Store-Vorschauen selbst gelten strengere Regeln, dazu unten mehr).
- Header-Visuals für README und Doku, die ein Feature einleiten; die Erklärung, wie es funktioniert, bleibt eine Bildschirmaufnahme.
- Hero-Videos für die Landingpage der Marketing-Site, die du im selben Monorepo pflegst.
- Social-Assets zum Launch, wenn du auslieferst und etwas für die Ankündigung brauchst.
Die Kosten gehen zu den Preisen des Connectors von deinen 8frame-Credits ab, ohne separate MCP-Gebühr. Die ersten, auf die ein Entwickler stößt: Ein Nano-Banana-Standbild kostet 6 Credits (der Connector nutzt Nano Banana Classic, nicht Nano Banana 2 oder Pro), ein 5-Sekunden-Clip mit Kling v3 Standard und Ton 86 (Kling ist über den Connector nur v3 Standard und braucht ein Startbild), und ein 8-Sekunden-Veo-Clip 448 mit Veo 3.1 Standard, dem Veo-Standard des Connectors (das Veo-Tool auf dem Canvas startet mit Fast), 168 mit Fast und 54 mit Lite. Nenn die Stufe beim Namen. Die vollständige Preisliste, Tool für Tool, steht in KI-Video mit Claude generieren.
Den Server zu Cursor hinzufügen
Cursor liest MCP-Server aus einer mcp.json-Datei: ~/.cursor/mcp.json für einen globalen Server, der in jedem Projekt verfügbar ist, oder .cursor/mcp.json in einem Repo für einen projektbezogenen. Füge 8frame unter mcpServers hinzu:
{
"mcpServers": {
"8frame": {
"url": "https://mcp.8frame.co/mcp"
}
}
}
Laut Cursor-Doku findest du die MCP-Server unter Customize in der Seitenleiste, wo sich jeder Server ein- und ausschalten lässt; prüf, ob 8frame eingeschaltet ist und seine Tools erscheinen. Cursor unterstützt OAuth für Server, die es verlangen, und 8frame verlangt es: Beim ersten Einsatz meldest du dich bei deinem 8frame-Konto an, damit Generierungen von deinen Credits abgehen. Standardmäßig fragt Cursor nach deiner Freigabe, bevor es ein MCP-Tool nutzt, also wartet jede Generierung auf dein Okay, bevor sie Credits verbraucht.
Den Server zu Claude Code hinzufügen
Claude Code fügt Remote-MCP-Server über HTTP mit einem einzigen Befehl hinzu:
claude mcp add --transport http 8frame https://mcp.8frame.co/mcp
Ohne Scope-Option landet der Server im lokalen Scope: nur dieses Projekt, nur für dich. Mit --scope user registrierst du ihn einmal für alle deine Projekte, mit --scope project schreibst du ihn in .mcp.json im Projektstamm und teilst ihn über die Versionskontrolle mit deinem Team. Prüfen kannst du das mit:
claude mcp list
Führ danach in Claude Code /mcp aus und folge den Schritten im Browser, um dich bei deinem 8frame-Konto anzumelden. Danach kannst du Claude Code direkt in deiner Session generieren lassen. Die vollständige Server-Referenz und den Weg über die Connectors von claude.ai (für Prompts außerhalb eines Editors) findest du unter 8frame.co/mcp.
Wo es sich lohnt
Store-Einträge: rund um die Vorschau, nicht darin. Apples App Store Review Guidelines (2.3.4) sagen, dass Vorschauen "may only use video screen captures of the app itself" (nur Videoaufnahmen des Bildschirms der App selbst verwenden dürfen), also gehört generiertes Material nicht in eine App-Store-Vorschau. Google Plays Hinweise zu Vorschauvideos lauten "Aim for at least 80% of the video to be representative of the user experience" (mindestens 80 % des Videos sollten die Nutzererfahrung zeigen) und verlangen, "pre-rendered or promotional content" (vorgerenderte oder werbliche Inhalte) zu begrenzen. Generierte Clips passen zu allem, was rund um den Release auf den Eintrag verweist: Launch-Post, Produktseite, Anzeigen.
README-Visuals. Ein generierter Clip kann deine echte Oberfläche nicht zeigen, also bleibt der Teil einer README, der erklärt, wie es funktioniert, eine Bildschirmaufnahme oder ein GIF. Ein kurzer generierter Clip oder ein Standbild kann darüber als Header für den Launch oder die Doku-Seite stehen. Generier ihn, solange du das Feature noch frisch im Kopf hast, verlink ihn in der README, weiter geht's.
Hero-Video für die Landingpage. Wenn du die Marketing-Site im selben Repo pflegst, kannst du den Hero-Clip generieren, ohne den Editor zu verlassen. Feile im Chat-Panel am Briefing, generier ein paar Optionen, wähl eine aus und liefer aus.
Social Media am Launch-Tag. Wenn du ein Release rausbringst, willst du oft einen Clip für den Ankündigungs-Thread. Lass dir aus einem 9:16-Standbild drei oder vier vertikale Varianten machen, und du hast ein Set zum Hook-Testing: das Standbild für 6 Credits plus vier Kling-v3-Standard-Clips zu je 86 ergeben 350 Credits, etwa 3,50 US-Dollar.
Ein durchgespieltes Beispiel in Claude Code
Angenommen, du hast gerade ein Feature gemergt und willst ein Hero-Video für die Landingpage. In der Claude-Code-Session:
"Generiere mit Nano Banana ein fotorealistisches 16:9-Standbild von einem eleganten Laptop auf einem minimalistischen Schreibtisch in weichem Morgenlicht, der Bildschirm leuchtet. Animiere es dann mit Kling zu einer langsamen 5-Sekunden-Kamerafahrt nach vorn."
Claude Code ruft das Nano-Banana-Tool für das Standbild auf (6 Credits), gibt es als Startbild an Kling weiter (86 mit Ton) und liefert die Dateilinks zurück. Gesamt: 92 Credits, etwa 0,92 US-Dollar. Du hast das Konzept als Text geprüft, zwei Generierungen ausgegeben und keine andere App geöffnet. Für einen Clip nur aus Text nennst du stattdessen ein Text-zu-Video-Modell: "nimm Veo 3.1 Lite" kostet 54 Credits für 8 Sekunden mit Ton, während einfach "Veo" Standard nutzt, für 448.
Eine 4K-Version des Clips anzufordern, funktioniert nicht: 8frame hat keinen Video-Upscaler, und die Upscaler des Connectors nehmen nur Bilder an. Du kannst das Standbild vor dem Animieren hochskalieren, aber der Clip kommt in der eigenen Auflösung des Modells zurück (720p bei Kling v3 Standard).
Das Setup mit dem Team teilen
Wenn dein ganzes Team im selben Repo arbeitet, committe eine projektbezogene Konfiguration, damit niemand sie einzeln einrichten muss. In Cursor ist das .cursor/mcp.json im Repo-Stamm mit dem 8frame-Serverblock von oben; wer das Projekt in Cursor öffnet, übernimmt den Server aus dieser Datei und meldet sich beim ersten Einsatz mit dem eigenen 8frame-Konto an. In Claude Code führst du claude mcp add --transport http --scope project 8frame https://mcp.8frame.co/mcp aus, was den Server in .mcp.json im Projektstamm schreibt; committe diese Datei, und Claude Code bittet jedes Teammitglied, den Projektserver freizugeben, bevor er genutzt wird.
Credits werden nicht geteilt: Jede Generierung wird dem Konto der Person berechnet, die sie startet. Der praktische Vorteil: Ein Launch-Asset zu generieren ist nicht mehr Sache der "einen Person, die das Design-Tool beherrscht", sondern etwas, das jede Entwicklerin und jeder Entwickler mit einem 8frame-Plan erledigen kann, während sie ohnehin im Code sind. Wer im Backend eine API ausliefert, kann einen Clip fürs Changelog machen, ohne jemanden anzupingen. Der 8frame-Eintrag enthält nur eine URL, also steckt kein Geheimnis darin; für andere Server, die Schlüssel brauchen, halte diese aus der committeten Konfiguration heraus und nutze stattdessen die Umgebungsvariablen-Interpolation des Clients.
Ehrliche Hinweise zu Latenz und Qualitätskontrolle
Es geht nicht sofort. Das sind echte generative Modelle. Gemessen auf 8frame (Mediane über 120 Tage) braucht ein 5-Sekunden-Clip mit Kling v3 Standard, dem Kling des Connectors, etwa eine Minute (60 Sekunden); ein Seedream-5-Pro-Bild, das Seedream des Connectors, etwa zwei Minuten (119 Sekunden); und ein Seedance-2.5-Clip in 720p mit 7 bis 11 Sekunden, die Seedance-Version, die der Connector nutzt, etwa fünf Minuten (296 Sekunden) (wie lange KI-Videogenerierung dauert). Für Nano Banana Classic, das Nano Banana des Connectors, haben wir keine gemessene Zeit, also nennen wir keine. Läuft eine Generierung länger als 10 Minuten, gibt der Connector eine Task-ID zurück, die du später abfragst. Für eine asynchrone Schleife nach dem Motto "generier, während ich weiter code" passt das, aber erwarte keine Autocomplete-Geschwindigkeit.
In voller Größe prüfen. Der Editor-Chat gibt dir einen Dateilink. Für alles, was rausgeht (ein Launch-Post, ein öffentliches Hero-Video), öffne die Datei und prüf sie in voller Größe. Generatives Video kann verzerrte Details erzeugen, und ein Thumbnail versteckt sie.
Der Editor ist eine Eingangstür, nicht die ganze Fläche. Konfigurationsgesteuerte Generierung aus Cursor oder Claude Code eignet sich für einzelne Assets und schnelle Iteration. Für eine Komposition mit mehreren Referenzen, ein präzises Layout oder eine wiederverwendbare Workflow-Vorlage, die dein Team immer wieder nutzt, ist der volle Canvas der richtige Ort. Anfragen über den Connector haben außerdem ein tägliches Credit-Limit, als Sicherheitsgrenze für Ausgaben, die ein Agent auslöst; der Canvas hat das nicht.
Häufige Fragen
Kann ich KI-Videos aus Cursor generieren?
Ja. Trag https://mcp.8frame.co/mcp in ~/.cursor/mcp.json (oder .cursor/mcp.json in einem Projekt) unter mcpServers ein, melde dich beim ersten Einsatz bei 8frame an und bitte den Agenten um einen Clip.
Was kostet ein Clip aus Claude Code? Die Preise des Connectors: 86 Credits für einen 5-Sekunden-Clip mit Kling v3 Standard aus einem Startbild, 54 für einen 8-Sekunden-Clip mit Veo 3.1 Lite und Ton, 448 für Veo 3.1 Standard, den Veo-Standard des Connectors.
Kann ich Nano Banana Pro oder Kling v3 Pro aus meinem Editor nutzen? Nein. Über den Connector ist Nano Banana das Classic-Modell (6 Credits) und Kling ist v3 Standard (86 Credits für 5 Sekunden, aus einem Startbild). Nano Banana 2 und Pro sowie Kling v3 Pro gibt es auf dem Canvas.
Kann der MCP-Server Videos hochskalieren? Nein. 8frame hat keinen Video-Upscaler; seine Upscaler (Clarity, BRIA, Topaz) arbeiten mit Bildern.
Quellen
- MCP-Konfigurationspfade in Cursor, Ein-/Ausschalten von Servern unter Customize, OAuth-Unterstützung, standardmäßige Tool-Freigabe und Interpolation in der Konfiguration: cursor.com/docs/context/mcp, abgerufen am 2026-10-01
claude mcp addin Claude Code, Scopes,.mcp.json, Freigabe von Projektservern und Anmeldung mit/mcp: Claude Code docs, MCP, abgerufen am 2026-10-01- App-Store-Vorschauen nur mit Bildschirmaufnahmen der App: App Store Review Guidelines, 2.3.4, abgerufen am 2026-10-01
- Google-Play-Hinweise zu Vorschauvideos: Add preview assets to showcase your app, abgerufen am 2026-10-01
- Anmeldung bei 8frame beim Verbinden: 8frame.co/mcp, abgerufen am 2026-10-01
- Tools, Modelle, Standardwerte, Preise, Wartelimit und Tageslimit des Connectors: Konfiguration des 8frame-MCP-Servers, gelesen am 2026-10-01
- Veo-Standard auf dem Canvas (Fast), Canvas-Modelle und Credit-Abrechnung pro Nutzer: Tool-Registry und Backend-Code von 8frame, gelesen am 2026-10-01
- Generierungszeiten: Produktionsdaten von 8frame, nur lesend, Mediane über 120 Tage bis 2026-09-30
Verwandte Anleitungen
Lieber außerhalb eines Editors prompten? KI-Video mit Claude generieren erklärt die Einrichtung über die Connectors von claude.ai. Du baust ein automatisiertes System, statt von Hand zu prompten? Videogenerierung für deinen KI-Agenten behandelt denselben MCP-Server als Agenten-Tool. Und wenn das Protokoll neu für dich ist, erklärt was MCP ist, wie das alles zusammenhängt.
Füg den MCP-Server von 8frame zu deinem Editor hinzu und generiere dort, wo du ohnehin arbeitest, oder starte mit einem fertigen Board aus den 8frame-Workflows.
Probier es ohne Anmeldung aus: Du landest direkt auf einem echten Board. Der 8frame-Canvas ist kostenlos und unbegrenzt; die Generierung ist kostenpflichtig ab 19 US-Dollar im Monat.