Scroll-Video-Website mit Claude und Seedance: Alle Prompts, mit denen beim Scrollen ein KI-Video abläuft
Stell dir vor, jemand öffnet deine Website und scrollt nach unten. Mit jedem Stück Seite wächst vor seinen Augen ein Haus: erst das Fundament, dann der Rohbau, dann das Dach, bis unten das fertige Haus steht. Scrollt er zurück, baut sich das Haus wieder ab. Früher war so ein Effekt eine teure Spezialanfertigung. Heute brauchst du dafür zwei Dinge: ein KI-Video und einen Prompt, der das Video ans Scrollen koppelt.
Auf dieser Seite bekommst du alle Prompts zum Kopieren, eine Übersicht, wo du das Videomodell ohne Technikkenntnisse nutzen kannst, und Ideen, wie das für Coaches, Berater und Handwerksbetriebe aussieht.
Das bekommst du am Ende
- ✅ Eine Website, die beim Scrollen lebt: Ein KI-Video läuft vorwärts, wenn man nach unten scrollt, und rückwärts, wenn man hochscrollt
- ✅ Zwei Copy-Paste-Prompts: einen für das Videomodell Seedance, einen für Claude Code
- ✅ Eine Liste von Anbietern, bei denen du Seedance im Browser nutzt, ohne Technik
- ✅ Ideen für deine Branche, damit du nicht bei „Haus“ hängen bleibst
Das brauchst du
- 💻 Einen Computer (Mac oder Windows) mit der Claude-Desktop-App
- 🤖 Ein bezahltes Claude-Abo. Claude Code, der Teil von Claude, der Dateien anlegt und Websites für dich baut, ist im kostenlosen Plan nicht enthalten. Welcher Plan genau reicht, steht bei Anthropic und kann sich ändern.
- 🎬 Zugang zu Seedance 2.5 bei einem der Anbieter unten. Das Modell kostet Geld, aber nur, wenn du wirklich Videos erzeugst.
- 🖼️ Ein Bild vom fertigen Ergebnis, also dein Foto oder ein KI-Bild. Wie du es erzeugst, steht in Schritt 2.
Wo du Seedance ohne Technik nutzt
Seedance 2.5 ist ein KI-Videomodell von ByteDance, dem Konzern hinter TikTok. Du tippst eine Beschreibung ein, lädst bei Bedarf ein Bild hoch und bekommst ein Video. Laut den Anbietern selbst gibt es das Modell inzwischen an mehreren Stellen. Welche davon in deinem Land und mit deinem Konto freigeschaltet sind, unterscheidet sich, schau deshalb direkt auf der jeweiligen Seite nach.
- 🎬 kie.ai: Bezahlung pro erzeugter Sekunde ohne Abo. Ich nutze kie.ai selbst für meine Videos. Laut Preisliste (Beta, kann sich ändern) kostet eine Sekunde ohne Video-Vorlage je nach Auflösung etwa 0,14 Dollar (480p), 0,32 Dollar (720p) oder 0,79 Dollar (1080p). Ein zehn Sekunden langer Clip in 720p liegt damit bei rund drei Dollar. Es gibt außerdem einen Entwurfsmodus mit 480p zum Testen. Mehr dazu auf meiner Seite kie.ai statt Higgsfield-Abo.
- 🎬 Dreamina (die Video-Oberfläche von CapCut, ebenfalls von ByteDance): Das Modell erscheint dort laut Anbieter zuerst, die Freischaltung hängt aber von Region und Konto ab.
- 🎬 Higgsfield: Oberfläche im Browser, Monatsabo mit Credits. Laut Higgsfield selbst ist Seedance 2.5 dort verfügbar.
- 🎬 Runway, OpenArt und Magnific: nennt Higgsfield ebenfalls als Plattformen mit Seedance 2.5. Prüf dort selbst, ob es für dein Konto freigeschaltet ist.
Welche Funktionen du brauchst: Das Modell muss aus einem Bild ein Video machen können. Bei kie.ai kannst du zusätzlich ein Start- und ein Endbild festlegen, das ist für unseren Trick Gold wert (dazu gleich mehr). Fehlt dir die Endbild-Funktion bei deinem Anbieter, gibt es unten einen Ausweg.
Schritt 1: Die Website mit Claude Code bauen
Zuerst bekommst du eine ganz normale Website ohne Video. So geht es los:
- Öffne die Claude-Desktop-App und melde dich an.
- Wähle den Bereich „Code“.
- Lege auf deinem Rechner einen neuen, leeren Ordner an (zum Beispiel „Meine-Scroll-Website“) und wähle ihn aus. Dort legt Claude alles ab.
- Kopiere den Prompt unten, ersetze die Angaben in den eckigen Klammern durch deine und schick ihn ab.
Entwirf und baue mir eine moderne One-Page-Website für [MEIN ANGEBOT, zum Beispiel: eine Baufirma aus Berlin, die Einfamilienhäuser baut]. Ruhiges, hochwertiges Design, viel Weißraum, eine Akzentfarbe. Abschnitte: Hero, So arbeite ich (4 Schritte), Referenzen, Kontakt. Leg die Seite als einfache HTML-Datei an, die ich direkt im Browser öffnen kann. Erkläre mir danach in einfachen Worten, wie ich sie ansehe.
Wenn dir die Oberfläche anders aussieht, als hier beschrieben, frag Claude einfach: „Führe mich durch die Einrichtung.“ Die Programme ändern sich öfter, Claude kennt den aktuellen Weg.
Schritt 2: Das fertige Bild erzeugen
Das Video braucht einen Anker: ein Bild vom fertigen Ergebnis. Am Ende des Videos soll genau dieses Bild stehen. Du kannst ein eigenes Foto nehmen (zum Beispiel eines deiner Projekte) oder dir mit einem Bildmodell deiner Wahl eines erzeugen lassen. Mein Beispiel:
Photorealistic modern family house in Germany, white render and dark timber facade, large windows, flat roof, neat garden and driveway, late afternoon sun, shot from the street at eye level, wide angle, no people, no text.
Wichtig ist der feste Blickwinkel: Das Bild sollte aus einer Position aufgenommen sein, die auch eine starre Kamera im Video hätte.
Schritt 3: Der Seedance-Prompt (Bau rückwärts als Video)
Jetzt kommt der Trick. Statt das Haus „abzubauen“, lässt du den ganzen Bau erzeugen: von der leeren Wiese bis zum fertigen Haus. Dein Bild aus Schritt 2 setzt du als Referenz, am besten als letztes Bild des Videos. Wähle das Format 16:9 und eine Länge von etwa 10 bis 15 Sekunden.
Use the reference image as the final frame. Show the complete construction of this exact house, from an empty plot of land to the finished building: excavation, concrete foundation, walls going up, roof frame, roof tiles and facade, windows, garden and driveway. Locked-off static camera, same angle and framing as the reference the whole time, smooth continuous time-lapse with no cuts, consistent daylight, no people in focus, no text.
Ich schreibe Videoprompts auf Englisch, so sind sie knapper. Teste zuerst mit der kleinsten Auflösung oder dem Entwurfsmodus und erzeuge die gute Fassung erst, wenn die Bewegung passt. Das spart Geld.
Schritt 4: Der Claude-Code-Prompt (Video ans Scrollen koppeln)
Lade das fertige Video herunter und leg es in den Ordner deiner Website (im Beispiel heißt es
haus-bau.mp4). Dann gib Claude Code diesen Auftrag:
Hier ist das Video haus-bau.mp4. Koppel das Video an das Scrollen: Im Abschnitt „So arbeite ich“ bleibt das Video im Vollbild stehen, und die Abspielposition folgt der Scroll-Position. Ganz oben ist das Grundstück leer, ganz unten steht das fertige Haus, beim Zurückscrollen baut es sich wieder zurück. Blende passend zum Fortschritt die vier Etappen als Textkarten ein: Fundament, Rohbau, Dach und Fassade, Einzug. Es soll flüssig laufen, auch auf dem Handy. Wenn nötig, zerlege das Video dafür in Einzelbilder.
Dann öffnest du die Seite im Browser und scrollst langsam durch. Ruckelt es oder passt eine Textkarte nicht, sag Claude einfach, was dich stört: „Die Karte kommt zu früh“ oder „Auf dem Handy ruckelt es“. Das ist normal und genau dafür ist die KI da.
Ideen für Coaches, Berater und Handwerk
Das Muster ist immer gleich: ein Prozess, der sich von „leer“ zu „fertig“ entwickelt. Setz dein Ergebnis als Endbild und lass Seedance den Weg dorthin erzeugen.
- 🌱 Coaching: Ein kleiner Setzling wächst zu einem großen, gesunden Baum. Im Seedance-Prompt: „A tiny seedling in soft morning light slowly grows into a large, healthy tree, static camera, smooth time-lapse, no cuts.“ Die Textkarten dazu: Klarheit, erste Schritte, Wachstum, Ergebnis.
- 🧩 Beratung: Ein chaotischer Schreibtisch voller Zettel räumt sich Schritt für Schritt zu einem aufgeräumten Arbeitsplatz auf. Zeigt, wie aus deinem Prozess Ordnung wird.
- 🧾 Steuer oder Buchhaltung: Ein Aktenberg sortiert sich in saubere Ordner.
- 🏠 Handwerk und Bau: das Haus aus dem Beispiel, genauso ein Dachstuhl, ein Anbau oder eine Terrasse.
- 🪑 Tischlerei: Aus einem rohen Holzblock wird Schritt für Schritt ein fertiger Esstisch.
- 🎨 Maler: Eine kahle Wand wird gestrichen, bis der Raum fertig eingerichtet ist.
- 🌳 Garten- und Landschaftsbau: Aus einer Baugrube wird ein blühender Garten.
- 🛋️ Immobilien oder Raumgestaltung: Eine leere Wohnung wird Möbelstück für Möbelstück eingerichtet.
Kein Beispiel dabei, das zu dir passt? Beschreib Claude oder einer anderen KI dein Angebot und frag: „Welcher Vorher-nachher-Prozess lässt sich als zehn Sekunden langes Zeitraffer-Video zeigen, und wie lautet dafür ein Videoprompt?“
Die 6 Stolperfallen
- Kamera wackelt oder wechselt den Blickwinkel. Beim Scrollen fällt jeder Sprung auf. Schreib „locked-off static camera, no cuts“ in den Prompt, und wenn das Video trotzdem springt, erzeuge es neu.
- Das Ergebnis am Ende sieht anders aus als dein Bild. Lass das Bild als letztes Bild fest setzen und prüf die letzte Sekunde, bevor du das Video einbaust.
- Zu langes oder zu großes Video. Zehn bis fünfzehn Sekunden reichen. Lass Claude das Video verkleinern und für das Netz optimieren, sonst lädt deine Seite zu langsam.
- Handy vergessen. Viele Besucher kommen vom Smartphone. Bitte Claude ausdrücklich, den Effekt auf dem Handy zu testen und im Zweifel einzelne Bilder statt eines Videos zu nutzen.
- Der Effekt lenkt von deinem Angebot ab. Er soll deine Botschaft verstärken, nicht ersetzen. Setz ihn an eine Stelle, an der er etwas erklärt, und halte den Rest der Seite ruhig.
- Nutzungsbedingungen ignorieren. Lies bei deinem Anbieter nach, ob du die erzeugten Videos geschäftlich einsetzen darfst, und bau nur Bilder und Marken ein, deren Rechte du hast.
Häufige Fragen
Was kostet das?
Du brauchst ein bezahltes Claude-Abo für Claude Code. Dazu kommen die Kosten für das Video: Bei kie.ai sind es laut aktueller Beta-Preisliste grob drei Dollar für einen zehn Sekunden langen Clip in 720p. Rechne mit ein paar Versuchen, bis das Video sitzt. Die Preise können sich ändern, schau auf der Seite des Anbieters nach.
Geht das auch mit einer anderen KI als Claude?
Ja, jeder KI-Coding-Agent, der Dateien anlegen darf, kommt in Frage. Der Prompt aus Schritt 4 ist nicht an Claude gebunden. Ich arbeite mit Claude Code, weil ich damit die besten Ergebnisse habe.
Geht das auch mit einem anderen Videomodell als Seedance?
Ja. Der Trick funktioniert mit jedem Videomodell, das aus einem Bild ein Video machen kann. Seedance 2.5 ist das Modell aus dem Reel. Der Claude-Code-Prompt bleibt in jedem Fall gleich.
Funktioniert das in meinem Website-Baukasten (Wix, Jimdo, WordPress)?
Das ist deutlich umständlicher. Der Prompt oben geht davon aus, dass Claude Code deine Seite selbst anlegt. Im Baukasten kommst du oft nicht an den nötigen Code. Die einfachste Lösung ist eine eigene kleine Seite, die du mit Claude Code baust und von deiner Hauptseite aus verlinkst.
Keine Lust, das selbst zu bauen?
Verständlich 😄 In meiner kostenlosen Community kannst du jederzeit in einen bezahlten Plan (Premium oder VIP) upgraden. Dort bekommst du meine fertigen Setups und Workflows, und Claude passt sie nur noch an dein Business an.
Und jetzt du
Überleg dir, welches Ergebnis deine Kunden am Ende sehen wollen, und mach daraus ein Bild. Dann erzeuge zuerst ein kurzes Testvideo in kleiner Auflösung und lass Claude den Rest bauen. Schreib mir danach auf Instagram, was bei dir beim Scrollen wächst. Ich freue mich über jede Nachricht. ❤️
PS: Falls du über „Kommentiere SCROLL“ hierher gekommen bist – die DM kam von meinem selbstgebauten ManyChat-Ersatz. Wie du dir das baust, zeige ich dir in meiner kostenlosen Community: hier geht's direkt zum Video. 😉