Motion-Rezepte und Techniken für jeden KI-Agenten

Verbinde deinen Agenten

Der Server heißt motion-fab-library. Füg ihn einmal hinzu, und dein Agent wählt die Tools selbst.

claude mcp add --transport http motion-fab-library https://motionfab.app/api/library/mcp

codex mcp add motion-fab-library --url https://motionfab.app/api/library/mcp

{
  "mcpServers": {
    "motion-fab-library": {
      "url": "https://motionfab.app/api/library/mcp"
    }
  }
}

{
  "servers": {
    "motion-fab-library": {
      "type": "http",
      "url": "https://motionfab.app/api/library/mcp"
    }
  }
}

Was dein Agent damit kann

Vier Tools, die nur lesen. Der Agent wählt sie anhand deiner Frage selbst.

search_recipes

Findet Community-Prompts über Wörter aus Titel oder Text, nach Vorlage oder Tag, in allen 8 Sprachen der Website. Liefert Titel, Zusammenfassung, Video und Seite.

get_recipe

Ein Prompt komplett: der Text für Motion Fab, was du vorbereiten solltest, und die Techniken in seinem Video.

search_techniques

Findet Techniken danach, wie der Effekt aussieht oder wofür er gut ist, nach Art oder Bibliothek. Liefert Beschreibungen, eine Vorschau und den Prompt, aus dem sie stammen.

get_technique

Eine Technik mit Code: eine eigenständige Komposition aus HTML, CSS und JavaScript mit GSAP, die im Browser läuft.

Neueste Prompts in der Bibliothek

Simple Motion

Kinetisches App-Launch-Video mit animiertem UI-Mockup

<direction> Mach ein 42 Sekunden langes kinetisches Produkt-Launch-Video im Querformat 1920x1080 für [your app]. Es zeigt, wie ein Gründer allein durch Chatten in der App ein Launch-Video für sein Startup erstellt. Baue die Oberfläche meiner App anhand meiner Screenshots als sauberes animiertes Mockup aus Formen und Text nach, nah am Original. In diesem Video ist es eine dunkle marineblau-violette App mit einer Live preview links, den Tabs Chat / Files / Panels rechts und pinken Akzent-Buttons. Zeige die Screenshots niemals als Standbilder: Jedes Element muss sich bewegen. Halte eine durchgehende Oberfläche ohne harte Schnitte. Die Kamera fährt zwischen den Panels heran, schwenkt und zieht zurück, während sich ein Cursor bewegt und klickt. Bleib im 120-BPM-Beat-Raster (ein Beat = 0,5 s) und lass auf jedem Beat etwas passieren. Riesige kinetische Wörter schlagen zwischen den Schritten über die UI. Das Startup des Gründers ist eine erfundene App, zum Beispiel "Pulse — standups your team actually reads" (durch deine ersetzen). Vermeide harte Schnitte, statische Screenshots, alles, was am Bildrand abgeschnitten wird, und Text oder Highlight-Balken, die in benachbarte Spalten laufen. </direction> <structure> 1) Hook, 0–3 s: "YOUR LAUNCH VIDEO.", dann "IN ONE CHAT." in riesiger Schrift, Wort für Wort auf den Beat geschnitten. "CHAT." morpht in den Chat-Tab und die Kamera zieht auf das ganze App-Fenster zurück. 2) Referenzen, 3–8 s: Ein Link "pulse-demo.app" wird in den Chat eingefügt. Ein PDF-Pitchdeck und ein Logo fliegen als Anhangskarten herein und rasten ein. Großes Wort "DROP". 3) Prompt, 8–13 s: Der Gründer tippt "Make a 30-second launch video for Pulse, kinetic style, our colours" Buchstabe für Buchstabe, dann tippt der Cursor auf Senden. Großes Wort "ASK". 4) Plan, 13–18 s: Der Agent antwortet mit einem fünfstufigen Plan als Checkliste. Die Schritte erscheinen und werden nacheinander abgehakt, und die Kamera weicht mit jeder neuen Zeile etwas zurück, damit das Bild nie leer wirkt. Großes Wort "PLAN". 5) Sketch und Go, etwa 18–21 s: Eine graue Drahtgitter-Skizze des Promos füllt schnell die Live preview, mit dem Label "Live preview" und der Wiedergabeleiste im Bild. Der Gründer klickt auf Go, und ein pinker Hintergrund wächst aus dem gedrückten Button und flutet den Bildschirm hinter einem riesigen "GO!". 6) Live, etwa 21–31 s: Statuszeilen erscheinen im Chat ("Picking fonts", "Animating the title", "Writing a soundtrack"), während sich die Skizze in das fertige Promo verwandelt. Die Kamera fährt heran, bis das Promo das Bild füllt. Etwa bei 27 s gleitet die Promo-Headline "Standups your team actually reads." herein, und ein limettengrüner Highlight-Balken zeichnet sich unter "actually reads.". Daneben steht eine Statistikspalte mit "92%" und "updates read". Großes Wort "LIVE". 7) Export, etwa 31–37 s: Die Kamera zieht zur App zurück. Der Export-Button und die Tabs sind vollständig sichtbar, während der Export läuft und abgeschlossen wird. Großes Wort "DONE". 8) Endcard, etwa 37–42 s: Das Logo von [your app] und "Live on [launch site] today" (durch deine ersetzen), das auf dem letzten Beat landet und bis zum Ende stehen bleibt. </structure> <composition> Palette: dunkle marineblau-violette UI, magentapinke Akzent-Buttons und die pinke Flut, ein Pink-Orange-Verlauf auf dem Logo und Limette als Highlight-Farbe im Demo-Promo. Die kinetischen Wörter sind riesig, fett, in Großbuchstaben, serifenlos in den Markenschriften und füllen den Großteil der Bildbreite. Verkleinere ein langes Wort lieber leicht, statt es abschneiden zu lassen. Halte überall sichere Ränder ein. In Weitaufnahmen ist das ganze App-Fenster im Bild. Im Chat ist das Eingabefeld vollständig sichtbar. In der Export-Szene sind Export-Button und Tabs im Bild. Im Promo bleiben Headline und Limetten-Balken in ihrer eigenen Spalte mit reichlich Platz. Der Balken entspricht exakt der Breite seiner Wörter und überlappt nie die "92%"-Spalte. </composition> <techniques> Eine durchgehende virtuelle Kamera mit weichen Ease-in-out-Heranfahrten, Schwenks und Rückzügen zwischen den Panels und ohne Schnitte. Der Cursor gleitet zu seinen Zielen und klickt mit einer kleinen Skalierung beim Drücken. Hook-Wörter schneiden pro Beat eines herein. Anhangskarten fliegen herein und rasten mit leichtem Überschwingen ein. Chat-Text wird Buchstabe für Buchstabe getippt. Checklisten-Einträge erscheinen und werden auf aufeinanderfolgenden Beats abgehakt. Die graue Skizze füllt sich schnell und verwandelt sich dann Element für Element in das fertige Promo. Die pinke Flut unter "GO!" wächst radial vom geklickten Button aus. Die großen Wörter schlagen mit einem schnellen Herunterskalieren über die UI ein und verschwinden auf dem nächsten Beat schnell wieder. Jeder Beat hat ein sichtbares Ereignis: ein Wort, einen Klick, eine Karte, ein Häkchen, eine Statuszeile oder eine Kamerabewegung. </techniques> <music> Ein energiegeladener Elektro-Track mit 120 BPM, bei dem jeder Schnitt, jeder Wort-Slam und jedes UI-Ereignis auf den Beat gelegt ist. Er baut sich durch die Vorbereitungsschritte auf, steigt zu "GO!" an, treibt durch den Live-Aufbau und löst sich mit einem letzten Schlag auf der Endcard auf. </music> <sound> Tastaturklicks, die genau auf jeden getippten Buchstaben fallen. Mausklicks bei jedem Cursor-Tipp. Whooshes bei Kamerabewegungen und beim Hereinfliegen der Anhangskarten und Snaps, wenn die Karten landen. Leise Ticks für die Checklistenschritte und die Statuszeilen. Ein kraftvoller Impact unter jedem großen Wort, ein Riser zu "GO!" und ein letzter Schlag auf der Endcard. Halte die Musik unter den Effekten, damit Klicks und Impacts klar zu hören sind. </sound> <references> Kinetische Typografie-Trailer für App-Launches, die eine SaaS-Oberfläche als scharfes animiertes Mockup mit einer durchgehenden Kamerafahrt nachbauen, im Stil von Produkt-Launch-Day-Promos. </references>

2-mal verwendet

Simple Motion

Promo mit Ticket, Koffer und Formaten samt Logo-Reveal

<direction> Erstelle ein 15-sekündiges Motion-Graphics-Promo im Querformat (1920x1080, 60 fps) für [your brand], ein Produkt, das aus einer Beschreibung ein fertiges Video macht (passe die Worte an deine an). Die Idee: Eine Anfrage wird zu einem Ticket, das Ticket öffnet sich zu einem Versprechen, ein Koffer liefert die Schritte nacheinander, drei Formate ziehen vorbei und alles landet auf meinem Logo. Es gibt keinen Sprecher: Die Worte stehen auf dem Bildschirm und die Musik trägt alles. Alles ist gezeichnet: flache 2D-Grafik mit einer in 3D gekippten Karte, kein Filmmaterial. Der Look ist hell, klar und energiegeladen: ein pinker Akzent auf heller Seite, mit einem tiefen tintenfarbenen dunklen Feld. Vermeide Filmmaterial, Sprecher, Unschärfe in Textmasken sowie jedes Driften oder Verzerren des Logos. Das Logo bildet sich als Ganzes, genau wie gezeichnet, und bleibt von etwa 13,3 s bis zum Ende absolut ruhig. </direction> <structure> 1. 0–1,9 s, die Anfrage. Links steht ein kleiner, gesperrter pinker Kicker „YOUR AI MOTION DESIGNER“ über einer dreizeiligen Schlagzeile von etwa 180 px, „Describe“ / „the“ / „video.“ (ersetze sie durch deine; die letzte Zeile ist pink). Die Zeilen steigen nacheinander von ihren Grundlinien auf. Die erste bewegt sich schon bei Frame 0, die anderen folgen im Abstand von 0,13 s, linear, je 0,17 s. Rechts ist eine weiße Ticketkarte in Perspektive gekippt, ihre linke Seite näher. Sie hat einen pinken Kopf „FROM IDEA TO VIDEO“ und mein kleines Logo mit „[your brand]“ daneben. Zwei Felder, „FROM IDEA · Your idea“ und „TO MP4 · Video“, sind durch eine gestrichelte Linie mit pinkem Play-Dreieck verbunden. Dazu kommen kleine Beschriftungen „EDIT WORDS“, „STEP 03“, „EFFECTS 3D“ und „PREVIEW LIVE“, ein Barcode und „03“ auf dem Abschnitt. Die Karte fliegt bei 0,23 s von rechts ein (power3.out, 0,35 s), schießt etwa 125 px nach links über und pendelt sich zurück (sine.inOut, 0,37 s). Währenddessen wechselt der „MP4“-Code 15-mal pro Sekunde zufällige Buchstaben und rastet Buchstabe für Buchstabe bei 0,67, 0,8 und 0,93 s ein. Bei 1,17 s schlägt ein pinker Umriss-Stempel „MP4 EXPORT“, um -14° gekippt, aus 2,4x in 8 Frames mit winzigem Nachfedern ein. Bei 1,67 s schrumpft das Play-Dreieck zu einem pinken Punkt, der zu einer Kreisblende wächst, die auf ihm zentriert ist, mit zwei blassrosa Ringen knapp außerhalb ihres Rands. Der Radius durchläuft 15, 36, 66, 120, 210, 330, 540, 900 und 1500 px, ein Schritt alle zwei Frames. Die Schlagzeilenzeilen verlassen der Reihe nach nach oben das Bild, während der Kreis wächst. 2. 1,9–4,0 s, das Versprechen, auf einem vollständig pinken Feld (radial, in der Mitte heller). Ein weißes Play-Dreieck, etwas länger als breit, damit es in seine Richtung zeigt, entsteht im Kreis. Es fliegt eine Schleife um die Worte, entlang seines Wegs gedreht: nach oben, links über die Oberseite, die linke Seite hinunter, am unteren Rand entlang, die rechte Seite hinauf und oben rechts hinaus. Hinter sich zeichnet es eine gepunktete weiße Umlaufbahn, deren ältere Punkte zu einer dünnen, schwachen Linie verblassen. Zwei große blasse Kreise liegen im Hintergrund. „No keyframes.“ (etwa 220 px, weiß) schwingt Buchstabe für Buchstabe im Abstand von 0,03 s auf einem Bogen von unten rechts herein, beginnt bei 38° und richtet sich auf. Bei 2,8 s fliegt es Buchstabe für Buchstabe nach oben hinaus. Gleichzeitig steigt „The agent animates it.“ (etwa 157 px) Buchstabe für Buchstabe im Abstand von 16 ms von seiner Grundlinie auf. Bei 3,03 s wischt eine weiße abgerundete Pille in 0,18 s von links hinter „animates it.“ herein, und diese Worte werden darin pink. Bei 3,77 s verschwimmen die Worte und blenden aus. Ein tiefer tintenfarbener Koffer mit pinkem Gurt und einem „MP4“-Anhänger fällt von oben und landet bei 4,02 s mit leichtem Stauchen. 3. 4,0–8,95 s, die Schritte. Aus dem Koffer öffnet sich ein heller Kreis mit zwei blassrosa Ringen, und zwei pinke Wellen-Ellipsen breiten sich von seiner Basis aus. Oben steigt „Edit in words.“ (gedämpft, etwa 56 px) auf. Dann steigt „Your idea is ready to move.“ (etwa 93 px) Wort für Wort auf, mit „move.“ in Pink und einer handgezeichneten pinken Unterstreichung darunter. Über dem Koffer erscheinen sechs weiße Schrittkarten, eine alle 0,58 s. Jede Karte ist 900x165 px groß und abgerundet, mit einer Icon-Kachel links und einem Status-Chip rechts. Jede steigt hinter dem Koffer auf (von 100 px tiefer und mit 72 % Größe, 0,3 s, power2.inOut) mit einem lavendelfarbenen „Animating“-Chip und einem Spinner. Dann leuchtet sie in zwei Schlägen auf: zuerst ein pinker Rand und ein weicher äußerer Halo, 0,07 s später wird die Icon-Kachel pink und der Chip zu einem pinken „✓ Ready“. Wenn die nächste Karte kommt, rückt die alte 40 px nach oben und blendet in 0,15 s aus. Die Karten lauten: „Kinetic type“, „Shapes“, „3D effects“, „Sound“, „Your own footage“, „Fonts for every script“ (ersetze sie durch deine). Unter dem Koffer schalten sich sechs Punkte und ein Zähler mit jeder Karte weiter, von „1 / 6 in motion“ bis „6 / 6 in motion“. Bei 7,9 s wechselt die letzte Karte an Ort und Stelle zu „Ready to move.“ mit einer Häkchen-Kachel und einem pinken „6 / 6“-Chip. Der Zähler wird durch „✓ Live preview. MP4 export.“ ersetzt. Bei 8,4 s hebt alles außer dem Koffer ab und verschwimmt. Bei 8,7 s taucht die Kamera in den Koffer, bis sein tiefer tintenfarbener Körper das Bild füllt. 4. 8,95–11,4 s, die Formate. Eine Gruppe aus drei schrägen Bändern fegt in 0,2 s von rechts nach links über das Bild und öffnet hinter ihrer Hinterkante ein bildfüllendes Panel. Die Bänder sind um etwa 18° geneigt: ein dunkelpinker schmaler Streifen, ein breites pinkes Band und ein hellpinker schmaler Streifen. Derselbe Schwung kommt bei 9,76 s und 10,5 s erneut. Die drei Panels sind weiche Verlaufsblöcke mit Horizont: - Lavendel zu Violett, mit warmem Licht in der unteren Hälfte; - ein violetter Himmel über einem tiefen tintenfarbenen „Meer“; - ein orangefarbener Himmel über tiefem Tintenton, mit einem türkisen Nebelband. Jedes Panel schiebt sich langsam von 1,07 auf 1 heran und hat unten einen tiefen tintenfarbenen Verlauf. Sein Name steigt Buchstabe für Buchstabe unten links auf, etwa 226 px, weiß: „Vertical“, „Horizontal“, „Square“. Oben links sitzt ein kleines, gesperrtes HUD: „01 / 03“ in hellem Pink, dann „9:16“, dann tippt sich „MP4 EXPORT“ ein, mit einer wachsenden pinken Unterstreichung darunter. Es wechselt zu „02 / 03 · 16:9 · LIVE PREVIEW“ und dann zu „03 / 03 · 1:1 · NO KEYFRAMES“. 5. 11,4–12,5 s, das Raster. Das letzte Panel schrumpft zur rechten Karte, während die anderen beiden von links hereingleiten. Zusammen bilden sie drei Hochformat-Karten (580x780 px, 30 px Abstand) auf einem tiefen tintenfarbenen Feld. Das Raster schiebt sich sanft auf 1,05 heran und setzt sich in einer halben Sekunde wieder. „Vertical, horizontal or square.“ steigt in Weiß darüber auf. Sobald sich das Raster gesetzt hat, blenden kleine Namen auf den Karten ein („Vertical“, „Horizontal“, „Square“), gut innerhalb des Bildes. 6. 12,2–15 s, das Logo. Ein pinker Punkt wächst aus der mittleren Karte, mit blassen Halo-Ringen, während das Raster auf einer weißen Seite auf 0,9 schrumpft. Sein Radius wird alle zwei Frames von 12 bis 1150 px gekeyt. Dann schrumpft der Punkt schnell und wird langsamer (260, 125, 90, 75 px), während er links von der Mitte wandert. Dort öffnet er sich direkt zur Hintergrundform meines Logos, ohne das Logo je zu überlappen, und die inneren Teile des Logos wachsen als ein Stück ein, genau wie das Logo gezeichnet ist. Bei 13,03 s gleitet „[your brand]“ hinter dem Logo nach rechts heraus (power3.out, 0,32 s), während sich ein dünner pinker Ring um das Logo ausbreitet und verblasst. Der Name ist etwa 150 px groß, tief tintenfarben, seine Buchstaben sind auf der Mittellinie des Logos zentriert, und das ganze Lockup ist im Bild zentriert. Dann steigt „Describe the video. The agent animates it.“ Wort für Wort darunter auf, der zweite Satz in Pink. Drei lavendelfarbene Chips poppen auf: „• Vertical“, „• Horizontal“, „• Square“. „[your website]“ steigt in gedämpftem Grau auf. Das Logo bleibt ab etwa 13,3 s absolut ruhig, und alles hält bis zum Ende. </structure> <composition> Die Basis ist eine helle Seite #FAF9FF mit einem schwachen 40-px-Punktraster #E9E4F2 und weichen pinken radialen Glühen. Tiefes Tintenblau #1C0B5D ist für dunkle Schrift, dunkle Objekte und das dunkle Feld. Es gibt einen Akzent, Pink #FB2D89, für Hervorhebungen, das Akzentfeld und den Fortschritt. Gedämpftes #6B6385 ist für Nebenzeilen und Lavendel #F0EDFF für weiche Chips. Orange #FE9117, Violett #7C6CF2 und Türkis #2DD4B0 erscheinen nur in den drei Format-Panels (und in meinem Logo, falls es sie verwendet). Schlagzeilen sind in einer kräftigen geometrischen Sans, Manrope ExtraBold, mit enger Laufweite von etwa -0,05em. Kleine Beschriftungen, HUD-Text und die Website sind in einer klaren Sans, Inter SemiBold. Layout je Shot: - Shot 1: Schlagzeile links, gekipptes Ticket rechts. - Shot 2: Worte zentriert auf dem pinken Feld. - Shot 3: Schrittkarten über dem Koffer gestapelt, Punkte und Zähler darunter, Schlagzeile oben. - Shot 4: Formatnamen unten links, HUD oben links. - Shot 6: End-Lockup zentriert, darunter Tagline, Chips und Website gestapelt. </composition> <techniques> Einblendungen sind sauber. Text steigt von seiner eigenen Grundlinie in einem Ausschnitt auf, der sich mit ihm bewegt, niemals als Unschärfe in einer Maske. Ausblendungen beschleunigen und sind in etwa 0,1 s verschwunden. - Kreisblenden wachsen in gestuften Radien, alle zwei Frames gekeyt, mit blassrosa Ringen knapp außerhalb des Rands. - Der Ticketcode wechselt Buchstaben und rastet Buchstabe für Buchstabe ein. - Der Stempel schlägt aus 2,4x mit winzigem Nachfedern ein. - Buchstaben kommen auf einem rotierenden Bogen herein, und die Hervorhebungs-Pille wischt hinter Worte, die darin die Farbe wechseln. - Schrittkarten leuchten in zwei Schlägen auf: zuerst Rand und Halo, dann Kachel und Chip. - Die Kamera taucht in den Koffer bei Skalierung 1,5, 3,1, 6,2 und 7 über eine Viertelsekunde. - Schräge Drei-Band-Schwünge tragen die Übergänge zwischen den Format-Panels, und jedes Panel schiebt sich langsam heran. - Das einzelne Panel kollabiert zu einem Raster aus drei Karten. - Ein Punkt wandert und öffnet sich zum Logo, das sich als Ganzes aufbaut und sich nach der Bildung nie bewegt oder verformt. </techniques> <music> Verwende einen originalen, beschwingten, optimistischen Electronic-House-Track mit 120 BPM, genau 15 s lang. Der volle Groove läuft ab dem ersten Frame, mit einer Kick auf jedem Beat bei etwa x,05 und x,55 s. Er bleibt unter den Karten und Formaten gleichmäßig. Die Drums fallen bei 12,55 s weg, wenn der Punkt das Raster verschluckt, und lassen ein warmes Pad und ein aufsteigendes Arpeggio zurück, die bis 15 s ausklingen. Schnitte und wichtige Akzente liegen auf dem Beat-Raster. </music> <sound> Das Sounddesign liegt über dem Track, ohne zusätzliche Drums: - ein Whoosh, wenn das Ticket einfliegt; - leise Ticks, wenn der Code einrastet; - ein sanfter Impact beim Stempel; - Whooshes bei jeder Kreisblende und der Hervorhebungs-Pille; - ein dumpfer Schlag, wenn der Koffer landet; - ein im Ton ansteigender Blip, wenn jede Karte pink wird; - ein Chime, wenn die letzte Karte landet; - ein Riser in den Tauchgang und ein Impact, wenn sich das erste Panel öffnet; - Whooshes bei jedem Band-Schwung und wenn die Karten zusammenkommen; - ein Riser in den Drop; - eine Glocke, wenn sich das Logo bildet; - sanfte Klicks bei den Chips. Mische auf etwa -14 LUFS mit einem True Peak unter -1 dBTP. </sound> <references> Eine moderne App-Launch-Werbung im flachen Vektorstil, aufgebaut auf kinetischer Typografie und einer Reise-Metapher: eine Bordkarte, ein Koffer und Horizont-Panels. Sie endet mit einem sauberen, zentrierten Logo-Lockup. </references>

2-mal verwendet

Simple Motion

Split-Screen-Sting für Apps mit zwei Bildraten

<direction> Erstelle einen 12-sekündigen horizontalen Split-Screen-Produkt-Sting für meine App, 1920x1080 bei 59,94 fps. Zwei quadratische Panels spielen nebeneinander dieselbe helle Interface-Animation ab. Das linke Panel läuft mit dem Gefühl von 29,97 fps, das rechte mit voller Bildrate, sodass der Unterschied in der Flüssigkeit sichtbar wird. Sieben schnelle Einstellungen landen auf dem Beat: Ein Cursor klickt in einem App-Fenster auf mein Logo, das Icon platzt in kreisende Quadrate auf, ein Klick in der Menüleiste lässt eine gläserne Eingabebox herausspringen, in der Text getippt wird, eine Textseite rauscht mit einer Karte vorbei, zwei gestapelte Karten driften nach oben, mein Logo steht allein, und ein leuchtender Schriftzug schlägt auf Fast-Schwarz ein. Der Look ist sauber und hell, mit weichen Schatten und Bewegungsunschärfe bei jeder Bewegung. Vermeide Standbild-Starts, Überblendungen, Filmkorn und Voice-over. </direction> <structure> 1. 0,00–2,39 s, Header und Klick. Ein violett getönter Dunst klärt sich in 0,9 s zur weißen Seite und hinterlässt unten ein lavendelfarbenes Leuchten. Ein einzeiliger Header steigt von etwa y 930 auf 537 mit exponentiellem Ease-out (etwa 1,2 s), anfangs stark verwischt. Er enthält mein Logo in einer lavendelfarbenen Scheibe von 132 px, den Namen „[deine Marke]“ in Inter Medium in tiefem Tintenblau und eine tiefblaue Kapsel „App öffnen“. Der Name poppt im zweiten Frame auf, schon unscharf. Die Kapsel folgt zwei Frames später und gleitet 15 px nach links, während sie scharf wird. Ab 0,45 s blendet sich ein weißes App-Fenster mit 93 px Eckenradius um den Header ein (53 %, 70 %, dann 100 % bis 0,78 s). Darin sind eine lavendelfarbene Suchpille „Beschreibe das Video“, eine Spalte gedämpfter Icons und eine Karte über einem Cover von Tiefblau zu Violett. Die Karte lautet im linken Panel „Deine Idee ist bereit, sich zu bewegen“ / „Live-Vorschau · MP4-Export“ und im rechten „Chat statt Timeline“. Das Cover lautet „Von der Idee zum Video in einem Chat“ oder „Beschreibe deine Idee“. Bei 0,88 s erscheint oben rechts ein schwarzer Pfeil-Cursor mit weißem Rand und gleitet bremsend nach links. Er dreht sich um -85 Grad, um beim Sturzflug nach unten zu zeigen, landet aufrecht auf dem Logo und wächst auf das 1,55-Fache, während ein weicher rosa Ring um die Scheibe aufleuchtet. Die Kamera fährt auf 1,2 um die Mitte ein (Ease-in-out, 0,47 s) und hält einen Frame. Dann zieht sie auf einer beschleunigenden Kurve auf 1,04 zurück, während der Cursor drückt (schrumpft um 15 %), direkt in den Schnitt. 2. 2,39–3,35 s, Icon und Orbit. Harter Schnitt auf den Musik-Drop: Mein Logo als App-Icon landet bei 276 px und schrumpft auf 178 px (Expo-out, 0,47 s). Vier abgerundete Quadrate, bewegungsunscharf und 32 Grad voraus, setzen sich in Kreuzform mit 222 px Radius um es herum (Expo-out, 0,9 s). Links sind sie violett, türkis, pink und gelb, rechts pink, orange, türkis und weiß. Eine zweifarbige lavendelfarbene Scheibe wächst in 0,2 s hinter dem Icon. Ab 3,12 s falten sich die Quadrate nach rechts zu einer Reihe und schrumpfen, und das Icon schrumpft auf etwa 70 px unter einer Unschärferampe. 3. 3,35–5,29 s, Menüleiste und Eingabe. Schnitt auf die obere rechte Ecke eines Computerbildschirms unter einer weißen Seite. Sie zeigt eine 46 px breite fast schwarze Blende und eine dunkle, durchscheinende Menüleiste mit WLAN-, Akku- und Steuerungs-Icons, meinem Logo, drei Akzentpunkten, „[deine Marke]“ und „App öffnen“. Der Hintergrund geht von Tiefblau zu Violett, mit diagonalen Lichtstreifen links, einem rosa Glühen, einem dünnen Raster und einem Funkeln rechts. Der Cursor steigt zum Logo auf und klickt (skaliert 0,1 s lang auf 0,82). Eine matte gläserne Eingabebox springt aus dem Icon: 740 x 226 px, 56 px Radius, durchscheinend lavendelfarben mit feinem weißem Rand. Sie skaliert in 0,19 s mit Überschwingen von 0,18 auf 1, ihre Unschärfe fällt von 9 px auf 0, während die Kamera 115 px nach rechts schwenkt. Sie tippt mit 27 Zeichen pro Sekunde hinter einem weißen Cursorstrich: „In Worten bearbeiten, keine Keyframes“ links, „Größer, langsamer, andere Farbe“ rechts. Ein rosa runder Senden-Button und drei kleine Symbole sitzen in der unteren Reihe. Die Einstellung driftet nach oben und verlässt das Bild auf einer vertikalen Unschärferampe, während ein lavendelfarbener Schleier auf 75 % steigt. 4. 5,29–7,16 s, Antwortseite und Karte. Aus dem lavendelfarbenen Flash scrollt eine Seite mit grau-violettem Text in Inter 42–45 px von 291 px unterhalb nach oben. Sie bewegt sich auf einer exponentiellen Kurve (Zeitkonstante 0,2 s), mit vertikaler Unschärfe, die an die Geschwindigkeit gekoppelt ist. Eine Wendung in tiefblauem SemiBold steht unter einem kleinen aufrechten Cursor: „KI-Motion-Designer“ links, „„langsamer“, „andere Farbe““ rechts. Beispielzeilen: „Von der Idee zum Video in einem Chat“, „01 Wähle eine Vorlage“, „02 Beschreibe deine Idee“, „03 Verfeinere in Worten, dann exportiere“, „Sag dem Chat, was er zeigen soll. Der Agent baut die Animation.“, „Kinetische Typografie, Formen, 3D-Effekte und Sound“. Bei 6,22 s poppt unten eine unscharfe Karte auf. Sie steigt auf einem schnellen Ease-out mit einem gleichmäßigen Aufwärtsdrift von 158 px/s, während die Seite auf 45 % abdunkelt und 3 px unscharf wird. Links zeigt die Karte ein abstraktes Dreieck in Tiefblau, Violett, Orange und Gelb mit der Beschriftung „Ideen in Bewegung“ / „[deine Website]“. Rechts zeigt sie ein Cover von Tiefblau zu Violett mit einer weißen Karte „Beschreibe deine Idee“, beschriftet „Chat statt Timeline“ / „Live-Vorschau · MP4-Export“. Ab 6,9 s beschleunigt sie nach oben, schrumpft auf 0,9 und blendet unscharf aus. 5. 7,16–8,16 s, gestapelte Karten. Eine Unschärfe-Überblendung über drei Frames bringt zwei gestapelte Karten (534 x 343 px, 51 px Radius) herein. Sie kommen 165 px tiefer, 15 % größer und unscharf an, setzen sich in 0,3 s und driften weiter nach oben, dann verlassen sie das Bild mit einer beschleunigenden Bewegung und einer Unschärferampe. Jede trägt einen riesigen weißen Titel mit 60 % Deckkraft, vom unteren Rand abgeschnitten. Links lauten die Titel „Schriften“ und „Musik“ über Dreiecks-Artwork mit einer „App öffnen“-Pille. Rechts lauten sie „Formen“ und „Sound“ über Covern von Tiefblau zu Violett mit „02“- und „03“-Pillen und weißen inneren Karten „Kinetische Typografie, Formen“ und „Musik und Soundeffekte“; die zweite Karte hat ein rosa-oranges Glühen. 6. 8,16–10,03 s, das Logo allein. Unschärfeschnitt auf mein Logo in einer lavendelfarbenen Scheibe von 167 px auf Weiß. Es steigt 115 px auf einer exponentiellen Kurve (0,17 s) an seinen Platz, hält, dann schrumpft es in den Schnitt. 7. 10,03–12,00 s, Endkarte. Harter Schnitt auf Fast-Schwarz mit einem tiefblauen radialen Glühen. Ein weißer Schriftzug mit weichem zweischichtigem Glühen schlägt von 3,85x ein: „[deine Marke]“ links, „[deine Website]“ rechts. Seine horizontale Unschärfe vergeht in 0,1 s. Er setzt sich in etwa einer Sekunde auf einer immer langsameren Kurve auf 1x, zieht dann langsam zurück und beschleunigt im letzten Frame auf 0,72x. </structure> <composition> Der Hintergrund ist Fast-Schwarz #0D0B1E. Zwei quadratische Panels mit je 930 x 930 px sitzen nebeneinander bei y 100 (links bei x 20, rechts bei x 970). Über jedem steht ein kleines Label in Inter SemiBold 28 px, helles Lavendel #E9E4F2: „Live-Vorschau“ über dem linken Panel und „[deine Marke] · MP4-Export“ über dem rechten. Beide Panels spielen dieselben sieben Einstellungen gleichzeitig ab, mit demselben Timing und derselben Bewegung. Das linke Panel zeigt jeden zweiten Frame ein neues Bild und das rechte jeden Frame. Nur einige Wörter unterscheiden sich zwischen den Panels, wie in den Einstellungen vermerkt. Innerhalb eines Panels ordne alles auf einer 1080 x 1080 Bühne an, die passend skaliert wird. Palette: helle Seite #FAF9FF; Lavendel #F0EDFF für weiche Flächen und Glühen; Linien #E9E4F2; gedämpftes Graviolett #6B6385 für Sekundärtext; Tiefblau #1C0B5D für dunkle Schrift und dunkle Flächen; Fast-Schwarz #0D0B1E. Akzente sind Pink #FB2D89 (der Hauptakzent) und Orange #FE9117, mit Violett #7C6CF2, Türkis #2DD4B0 und Gelb #FFD23F, wo vier Farben gebraucht werden. Verwende durchgehend Inter 400/500/600/700. Mein Logo ist überall dort, wo ein Logo erscheint, das App-Icon. Ein abgerundetes quadratisches Icon passt am besten zum Layout, zum Beispiel ein tiefblaues Quadrat mit einem pink-orange-weißen Wirbel und einem pinken Play-Dreieck. </composition> <techniques> Nichts startet aus einem Standbild. Jedes Element tritt bereits in Bewegung mit exponentiellem Ease-out ein und verlässt das Bild mit einer beschleunigenden Bewegung oder einer Unschärferampe. Bewegungsunschärfe folgt Geschwindigkeit und Richtung jeder Bewegung. Es gibt keine Überblendungen: Einstellungen wechseln durch harte Schnitte, Unschärfeschnitte und eine kurze Unschärfe-Überblendung, alle auf dem Beat. Die Kamera fährt auf 1,2 ein (Ease-in-out, 0,47 s), hält einen Frame und zieht in Einstellung 1 auf einer beschleunigenden Kurve auf 1,04 zurück und schwenkt in Einstellung 3 um 115 px nach rechts. Der Cursor ist ein schwarzer Pfeil mit weißem Rand; seine Klicks lassen ihn schrumpfen (15 % oder auf 0,82 für 0,1 s). Getippt wird mit 27 Zeichen pro Sekunde hinter einem weißen Cursorstrich. Pop-ins schwingen über. Aufwärts-Abgänge nutzen vertikale Unschärferampen, und der Einschlag der Endkarte nutzt eine horizontale Unschärfe. </techniques> <music> Mach ein beschwingtes Funky-House-Bett mit 124 BPM, exakt 12 Sekunden lang. Es beginnt mit einem gefilterten Intro unter der ersten Einstellung. Der volle Groove (Four-on-the-floor-Kick, Claps, Slap-Bass, perlende Akkorde) setzt beim Schnitt zum Icon bei 2,39 s ein. Ein gefilterter Breakdown läuft unter dem einzelnen Logo, und ein Hall-Ausklang folgt dem Schlag der Endkarte. Jeder Schnitt sitzt auf dem Beat. Mische auf etwa -14 LUFS mit einem True Peak unter -1 dBTP. </music> <sound> Füge zusätzlich zur Musik diese Soundeffekte hinzu: - ein Riser in den Drop und ein Boom darauf - ein sanfter Klick, wenn der Cursor das Logo drückt, und ein weiterer auf dem Menüleisten-Icon - ein Pop, wenn die Eingabebox herausspringt - leichte Tipp-Ticks - ein Whoosh beim Falten in die Menüleiste und beim Wischen zur Textseite - Swishes, wenn die Karte aufsteigt und wenn die gestapelten Karten hereinblenden - ein leichter Impact auf dem einzelnen Logo - ein Boom mit fallendem Ton auf der Endkarte Keine Stimme. </sound> <references> Ein polierter App-Launch-Sting im Stil moderner Produkt-UI-Motion: helle Interface-Mockups, kinetische Kamerabewegungen, starke gerichtete Bewegungsunschärfe und beatsynchrone Schnitte. Er ist als Bildraten-Vergleich aufgebaut. </references>