dein KI-Motion-Designer

DE

App öffnen beta

Simple Motion

Lebendiges Mathe-Showreel mit Glitch-Schnitten im Beat

Ein 20-sekündiges leuchtendes Mathe-Showreel: Sinuswelle, Fourier-π, 3D-Knoten, Wellenfläche, Fraktal, Sonnenblumenspirale und Eulersche Identität mit Glitch-Schnitten im Beat.

Veröffentlicht 10. November 2026

Prompt verwenden

Der Prompt öffnet sich in der App: Füg dein eigenes Material hinzu und der Agent baut das Video.

Konzept

Erstelle ein 20-sekündiges Motion-Graphics-Showreel, das vollständig aus Mathematik besteht: Jedes Bild wird aus der laufenden Zeit t erzeugt, ohne Fotos, Filmmaterial oder Bilder. Querformat 1920x1080 bei 60 fps. Es soll sich wie ein präzises Laborinstrument anfühlen, das plötzlich schön wird: dunkel, leuchtend, exakt, mit einem Glitch-Schnitt alle zwei Sekunden im Beat. Acht Mathe-Szenen laufen in einem festen Instrumenten-Rahmen (Eckklammern, Wortmarke, Szenenzähler und -label, Beat-Punkt, laufende Uhr, Fortschrittslinie, Live-Gleichung), danach eine Endkarte mit der Marke. Vermeide Körnung, Stockbilder und jede Dekoration, die nicht aus der Mathematik stammt.

Ablauf

Schnitte bei 2, 4, 8, 10, 12, 14, 16 und 18 s, alle im Beat. 1) 0-2 s, Ursprung: Ein blasser türkiser Ring wächst aus der Mitte bis r 238 px (0-0,45 s, ease out); Achsen mit Teilstrichen alle 60 px wachsen aus einem leuchtenden Mittelpunkt; bei jedem Beat verlässt ein Wellenring den Punkt. Eine weit gesperrte Zeile wie "YOUR AI MOTION DESIGNER" löst sich aus Zufallszeichen auf (0,3-0,78 s); eine kurze Serifenzeile wie "Ideas in motion" wird neben dem Ursprung Buchstabe für Buchstabe getippt (0,5-1,12 s). Von 1,35 bis 1,95 s windet sich ein türkiser Bogen mit r 220 einmal um den Ursprung, mit einem weißen Punkt an der Spitze, und die Worte blenden aus. 2) 2-4 s, Einheitskreis: ein türkiser Kreis (r 220) links, der Winkel wächst mit 4,52 rad/s. Weißer Radius, türkiser Kosinus-Schenkel, pinker Sinus-Schenkel, ein orangener Winkelbogen mit der Beschriftung θ, eine gestrichelte pinke Linie zu einem pinken Punkt bei x 820, wo der Sinus geschrieben steht; die Winkelhistorie zieht sich als leuchtender pinker Sinus (104 px pro Radiant) nach rechts, mit einem blassen türkisen Kosinus daneben und gepunkteten +1/-1-Hilfslinien. Live-Anzeigen "θ = 4.524 rad" und "sin θ = -0.982". Gleichung: y = sin θ. 3) 4-8 s, Fourier-Epizykel: Eine Kette aus 180 rotierenden Kreisen (nach Größe sortiert, blasse lavendelfarbene Ringe, weiße Radien) zeichnet von 4,3 bis 7,2 s (Sinus-in-out-Fortschritt) den Umriss eines großen π in leuchtendem Orange, danach füllt sich die Form mit einem weichen Verlauf von Pink zu Violett, während die Kette ausblendet. Links leuchtet ein Spektrum von |cₙ| für n = -24...24 (Balkenhöhe nach der Wurzel der Amplitude) von der Mitte nach außen auf, während die Zeichnung fortschreitet; Anzeigen "K = 180 terms" und "t/2π = 0.527". Gleichung: f(t) = Σ cₙ e^{int}. 4) 8-10 s, ein 3D-Lissajous-Knoten (sin 3t, sin 2t, sin 5t) wird in 0,6 s gezeichnet und dreht sich dann in Perspektive: ein Band, dessen Farbe entlang der Kurve von Türkis über Violett zu Pink läuft und dessen Breite und Helligkeit der Tiefe folgen. Rechts zeichnet sich ein 3x3-Raster kleiner ebener Lissajous-Figuren mit den Beschriftungen 1:1, 2:3, 4:5, 1:2, 3:4, 5:6, 1:3, 3:5, 3:2 nacheinander mit driftender Phase; die letzte wird türkis in einem dünnen Kasten. 5) 10-12 s, eine Drahtgitter-Wellenfläche z = cos(kr - ωt)/(1 + r) auf einem 48x48-Gitter aus 67° von oben gesehen, in 0,55 s von der Mitte nach außen eingeblendet und langsam drehend, Linien nach Höhe von Türkis über Violett zu Pink gefärbt. Ein oranger Sondenpunkt reitet bei r = 3.2 auf der Fläche, mit Hilfslinie und Live-Anzeigen "r = 3.200", "z = 0.276". 6) 12-14 s, eine Julia-Menge z² + c füllt das Bild, geöffnet durch ein kreisförmiges Portal, das sich mit weißem Rand aus der Mitte ausdehnt. c = 0.7885·e^{iα} gleitet auf seinem Kreis (sine in-out), sodass das Fraktal von getrennten Spiralen zu einer zusammenhängenden Form mit schwarzem Inneren morpht; langsamer Zoom und Rotation. Farben nach Fluchtzeit: Indigo, Violett, Pink, Orange, helles Creme bis Weiß. Ein Einschub zeigt c auf seinem Kreis mit den Anzeigen "Re c" und "Im c". 7) 14-16 s, Phyllotaxis: 1500 Samen bei θₙ = n·137.508°, rₙ = c√n erscheinen von der Mitte nach außen und drehen sich, zuerst weiß, dann pink, violett und türkis. Links schreibt sich φ = 1.6180339887... Ziffer für Ziffer, eine Fibonacci-Reihe wächst (21 und 34 in Türkis), mit "seeds n = 1500" und "spirals 21 ⟲ 34 ⟳". 8) 16-18 s, Eulersche Identität: Die Samen wirbeln zu einem Ring, der links zum türkisen Einheitskreis wird; ein Punkt läuft von 1 nach -1 und hinterlässt einen orangen Bogen über der Oberseite; e^{iπ} erscheint groß, dann nacheinander "+", "1", "=" im Beat, bei -1 pulsiert ein Ring, und "0" landet bei 18 s in einem pinken Ring. 9) 18-20 s, Endkarte: Die Identität schrumpft nach oben; eine große, weit gesperrte Wortmarke wie "YOUR BRAND" (durch deine ersetzen) steigt Buchstabe für Buchstabe von unten innerhalb einer Maske auf (0,06 s Versatz), eine türkis-violett-pinke Unterstreichung wird darüber gezogen, eine gesperrte Zeile wie "IDEAS IN MOTION × [your web address]" löst sich aus Zufallszeichen auf, und eine kursive Serifenzeile "From idea to video in one chat" blendet ein. Alles blendet von 19,35 bis 19,95 s zu Schwarz aus.

Bildaufbau

Hintergrund: ein tiefes indigoschwarzes radiales Leuchten, Mitte #10063A, zu den Rändern hin #03030A, ohne Körnung. Akzente: Pink #FB2D89 (Hauptfarbe), Orange #FE9117, Violett #7C6CF2, Türkis #2DD4B0 und Weiß. Linien und Beschriftungen in lavendelgrauen Tönen: #9A98A4 für Labels, #57516F für blasse Bildunterschriften, #433E53 für Achsen. Striche leuchten weich mit 12-16 px Unschärfe in ihrer eigenen Farbe. Schrift: Gleichungen in einer Computer-Modern-artigen Serife (Old Standard TT, Variablen kursiv, Funktionen aufrecht); jede Anzeige, jeder Zähler und jede Beschriftung in einer Monospace (Liberation Mono oder ähnlich), klein und weit gesperrt; der Markenname in einer fetten Grotesk mit sehr weiter Sperrung. Ein fester Rahmen bleibt die ganze Zeit stehen und blendet in 0,15-0,9 s ein: dünne Eckklammern, 27 px lang, 47 px von jeder Ecke eingerückt. Oben links: eine Wortmarke wie "YOUR BRAND" (fett, 22 px, Sperrung etwa 0,35 em) mit einer winzigen gesperrten Zeile darunter wie "IDEAS IN MOTION · [your web address]". Oben rechts: ein Szenenzähler "01 / 08" und darunter ein kurzes Label pro Szene, zum Beispiel "DESCRIBE YOUR IDEA", "EDIT IN WORDS", "NO KEYFRAMES", "3D EFFECTS", "LIVE PREVIEW", "SHAPES AND SOUND", "MUSIC TO THE RHYTHM", "MP4 EXPORT" (durch deine Claims ersetzen), mit einem kleinen pinken Punkt links davon. Unten rechts: eine laufende Uhr "t = 03.35 s" (zwei Dezimalstellen) und eine winzige Zeile mit der Bildnummer. Unten: eine 1 px dicke Fortschrittslinie von x 80 bis 1840, die sich im Lauf der Zeit mit einem türkis-violett-pinken Verlauf füllt, mit kleinen Teilstrichen an jeder Szenengrenze. Unten links: die Gleichung der aktuellen Szene.

Techniken

Jeder Schnitt ist ein 0,2 s langer Glitch: Das ausgehende Bild wird in horizontale, seitlich verschobene Bänder zerschnitten, 3-6 dünne Linien über die ganze Breite in Türkis, Pink, Orange und Weiß flackern, das ganze Bild blitzt bei etwa 14 % weiß auf und klingt in 0,25 s ab, und die Labels des Rahmens laufen einige Frames lang durch Zufallszeichen. Der pinke Beat-Punkt blitzt bei jedem Beat hell auf und klingt in einem halben Beat ab. Die Gleichung der Szene blendet 0,1-0,35 s nach jedem Schnitt ein. Anzeigen, Uhr und Zähler aktualisieren sich live mit der Animation. Gesperrte Zeilen lösen sich aus Zufallszeichen auf; Serifenzeilen werden Buchstabe für Buchstabe getippt; die End-Wortmarke steigt von unten innerhalb einer Maske mit 0,06 s Versatz auf. Einzeichnungen und Morphs nutzen ease-out oder sine in-out, wie pro Szene angegeben.

Musik

Ein mitreißender Elektro-Track mit 120 BPM (Klavierakkorde, warme Pads, Synth-Bass, Four-on-the-Floor-Beat), genau 20 s lang, jeder Schnitt landet auf einem Beat. In den ersten zwei Sekunden weich und gefiltert mit einem Riser zu einem Boom bei 2 s, bis 16 s voller Drive, ein gefilterter Breakdown mit einem Riser zu einem finalen Boom bei 18 s, danach Ausblenden bis 20 s. Mix auf etwa -14 LUFS mit True Peak unter -1 dBTP.

Sound

Ein sanftes Whoosh und drei Glitch-Ticks bei jedem Schnitt sowie ein tieferes Whoosh und ein Boom, wenn sich bei 12 s das Fraktal-Portal öffnet, alles über der Musik und auf dem Beat-Raster. Kein Voice-over.

Referenzen

Mathe-Erkläranimationen gekreuzt mit generativer Creative-Coding-Kunst und einem Sci-Fi-Oszilloskop- oder Laborinstrument-HUD: dünne leuchtende Linien auf fast Schwarz, Monospace-Anzeigen, Lehrbuch-Serifengleichungen.

Was du vorbereiten solltest

Dein Markenname, ein kurzer Claim für jedes der acht Szenen-Labels und die Endkarte sowie deine Webadresse.

Die Motion-Design-Kniffe, aus denen das Video besteht, jeweils mit eigenständigem Code, den du im Browser öffnen oder deinem Agenten geben kannst.

Vorschau der Technik „Glitch-Schnitt: zerschnittene Bänder, Farblinien und weißer Blitz“ — Bei 0:02 im Video

Übergang

Glitch-Schnitt: zerschnittene Bänder, Farblinien und weißer Blitz

Die ausgehende und die eingehende Szene werden auf ein Offscreen-Canvas gezeichnet; 0,13 s rund um den Schnitt wird es in horizontalen Bändern von 18–128 px Höhe zurückkopiert, etwa die Hälfte davon um bis zu 70 px seitlich verschoben (Seed über die Bildnummer, schrumpfend auf null). 3–6 Linien in voller Breite mit 1–2 px in Türkis, Pink, Orange und Weiß flackern 0,15 s lang, und eine weiße Ebene mit 14 % klingt linear über 0,25 s ab.

Wann einsetzen Ein harter Schnitt mit digitaler, energiegeladener Wirkung, alle zwei Sekunden im Takt.

Code anzeigen

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Glitch-Schnitt: zerschnittene Bänder, Farblinien und weißer Blitz</title>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gsap.min.js"></script>
<style>
html, body { margin: 0; height: 100%; overflow: hidden; background: #000; }
#root { position: relative; overflow: hidden; transform-origin: 0 0; }
</style>
<style>
#root{position:relative;width:100%;height:100%;background:#03030a;overflow:hidden}#c{position:absolute;inset:0;width:100%;height:100%;display:block}
</style>
</head>
<body>
<div id="root" data-composition-id="main" data-start="0" data-duration="4" data-width="1920" data-height="1080"><canvas id="c" class="clip" data-start="0" data-duration="4" width="1920" height="1080"></canvas></div>
<script>
const W=1920,H=1080,TAU=Math.PI*2,c=document.getElementById('c'),X=c.getContext('2d');
const clamp=(v,a=0,b=1)=>Math.min(b,Math.max(a,v)),seg=(t,a,b)=>clamp((t-a)/(b-a)),sio=u=>(1-Math.cos(Math.PI*u))/2;
const L=document.createElement('canvas');L.width=W;L.height=H;const S=L.getContext('2d');
const CUT=2.0, SLICE=0.13, LINES=0.15, FLASH=0.25, FLASH_ALPHA=0.137; // cut time and glitch phases (s)
const COLORS=['#2DD4B0','#FB2D89','#FE9117','#FFFFFF'];
function rng(a){return()=>{a=(a+0x6d2b79f5)|0;let t=Math.imul(a^(a>>>15),1|a);t=(t+Math.imul(t^(t>>>7),61|t))^t;return((t^(t>>>14))>>>0)/4294967296;};}
function sceneA(g,t){g.strokeStyle='#2DD4B0';g.lineWidth=4;g.shadowColor='#2DD4B0';g.shadowBlur=16;g.beginPath();g.arc(960,540,220,0,-Math.min(1,t/1.8)*TAU,true);g.stroke();}
function sceneB(g,t){g.strokeStyle='#FB2D89';g.lineWidth=5;g.shadowColor='#FB2D89';g.shadowBlur=16;g.beginPath();for(let x=200;x<=1720;x+=4){const y=540-220*Math.sin((x-200)/104-(t-CUT)*4.5);x===200?g.moveTo(x,y):g.lineTo(x,y);}g.stroke();}
function draw(t){const fr=Math.round(t*60),u=t-CUT;X.fillStyle='#03030a';X.fillRect(0,0,W,H);S.clearRect(0,0,W,H);S.save();(t<CUT?sceneA:sceneB)(S,t);S.restore();
 if(u>-0.04&&u<SLICE){const amp=u<0?0.6:1-u/SLICE,r=rng(fr*13+1);let y=0;while(y<H){const h=18+(r()*110|0),dx=r()<0.55?(r()*2-1)*70*amp:0;X.drawImage(L,0,y,W,h,dx,y,W,h);y+=h;}}else X.drawImage(L,0,0);
 if(u>=0&&u<FLASH){X.fillStyle=`rgba(255,255,255,${FLASH_ALPHA*(1-u/FLASH)})`;X.fillRect(0,0,W,H);}
 if(u>-0.04&&u<LINES){const r=rng(fr*7+3),n=3+(r()*4|0);for(let i=0;i<n;i++){X.globalAlpha=0.35+0.5*r();X.fillStyle=COLORS[r()*4|0];X.fillRect(0,r()*H|0,W,r()<0.7?1:2);}X.globalAlpha=1;}}
const tl=gsap.timeline({paused:true});const st={t:0};tl.to(st,{t:4,duration:4,ease:'none'},0);
tl.eventCallback('onUpdate',()=>draw(tl.time()));draw(0);
window.__timelines=window.__timelines||{};window.__timelines["main"]=tl;
</script>
<script type="module">
// Fit the composition to the window and play its timeline on a loop.
const root = document.getElementById('root');
const width = Number(root?.dataset.width) || 1080;
const height = Number(root?.dataset.height) || 1920;
const fit = () => {
  if (!root) return;
  const scale = Math.min(innerWidth / width, innerHeight / height);
  Object.assign(root.style, {
    width: width + 'px',
    height: height + 'px',
    transform: 'scale(' + scale + ')',
    marginLeft: (innerWidth - width * scale) / 2 + 'px',
    marginTop: (innerHeight - height * scale) / 2 + 'px',
  });
};
fit();
addEventListener('resize', fit);
window.__timelines?.main?.repeat(-1).play(0);
</script>
</body>
</html>

Vorschau der Technik „Fourier-Epizykel zeichnen eine geschlossene Kontur“ — Bei 0:05 im Video

Formen

Fourier-Epizykel zeichnen eine geschlossene Kontur

Eine geschlossene Kontur wird auf 180 Punkte neu abgetastet und in 180 Fourier-Terme umgewandelt; die Kreise werden vom Schwerpunkt aus, der größte zuerst, verkettet und drehen sich jeweils n-mal pro Umlauf, die Spitze hinterlässt eine leuchtende Spur. Der Fortschritt läuft mit sine in-out über etwa 3 s, schwache Ringe und weiße Radien zeigen die Maschine, und die Kontur füllt sich beim Schließen mit einem weichen Verlauf, während die Kette ausblendet.

Wann einsetzen Um beliebige Logos, Glyphen oder Pfade zu zeichnen, als würde sie eine Maschine aus Kreisen nachfahren.

Code anzeigen

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Fourier-Epizykel zeichnen eine geschlossene Kontur</title>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gsap.min.js"></script>
<style>
html, body { margin: 0; height: 100%; overflow: hidden; background: #000; }
#root { position: relative; overflow: hidden; transform-origin: 0 0; }
</style>
<style>
#root{position:relative;width:100%;height:100%;background:#03030a;overflow:hidden}#c{position:absolute;inset:0;width:100%;height:100%;display:block}
</style>
</head>
<body>
<div id="root" data-composition-id="main" data-start="0" data-duration="4" data-width="1920" data-height="1080"><canvas id="c" class="clip" data-start="0" data-duration="4" width="1920" height="1080"></canvas></div>
<script>
const W=1920,H=1080,TAU=Math.PI*2,c=document.getElementById('c'),X=c.getContext('2d');
const clamp=(v,a=0,b=1)=>Math.min(b,Math.max(a,v)),seg=(t,a,b)=>clamp((t-a)/(b-a)),sio=u=>(1-Math.cos(Math.PI*u))/2;
const POLY=[[700,300],[1500,300],[1500,400],[1320,400],[1320,820],[1440,780],[1460,860],[1300,920],[1220,880],[1220,400],[960,400],[900,820],[780,920],[700,880],[800,760],[860,400],[700,400]]; // any closed outline
const N=180, DRAW=[0.3,3.2]; // terms, drawing window (s)
function resample(p,n){const seg=[];let L=0;for(let i=0;i<p.length;i++){const a=p[i],b=p[(i+1)%p.length],l=Math.hypot(b[0]-a[0],b[1]-a[1]);seg.push([a,b,l]);L+=l;}const out=[];for(let k=0;k<n;k++){let d=k*L/n;for(const[a,b,l]of seg){if(d<=l){out.push([a[0]+(b[0]-a[0])*d/l,a[1]+(b[1]-a[1])*d/l]);break;}d-=l;}}return out;}
const S=resample(POLY,N),CO=[];for(let n=-N/2;n<N/2;n++){let re=0,im=0;S.forEach(([x,y],k)=>{const a=-TAU*n*k/N;re+=x*Math.cos(a)-y*Math.sin(a);im+=x*Math.sin(a)+y*Math.cos(a);});CO.push({n,re:re/N,im:im/N,a:Math.hypot(re,im)/N});}
const C0=CO.find(c=>c.n===0),CH=CO.filter(c=>c.n!==0).sort((a,b)=>b.a-a.a);
const at=u=>{let x=C0.re,y=C0.im;for(const c of CH){const a=TAU*c.n*u;x+=c.re*Math.cos(a)-c.im*Math.sin(a);y+=c.re*Math.sin(a)+c.im*Math.cos(a);}return[x,y];};
const PATH=[];for(let i=0;i<=600;i++)PATH.push(at(i/600));
function draw(t){const u=sio(seg(t,DRAW[0],DRAW[1])),fill=seg(t,3.2,3.6),chain=1-seg(t,3.25,3.8);X.fillStyle='#03030a';X.fillRect(0,0,W,H);
 if(fill>0){X.beginPath();PATH.forEach(([x,y],i)=>i?X.lineTo(x,y):X.moveTo(x,y));const g=X.createLinearGradient(700,300,1460,920);g.addColorStop(0,'rgba(251,45,137,.3)');g.addColorStop(1,'rgba(124,108,242,.3)');X.globalAlpha=fill;X.fillStyle=g;X.fill();X.globalAlpha=1;}
 if(chain>0){let x=C0.re,y=C0.im;X.lineWidth=1;for(const c of CH.slice(0,48)){const a=TAU*c.n*u,nx=x+c.re*Math.cos(a)-c.im*Math.sin(a),ny=y+c.re*Math.sin(a)+c.im*Math.cos(a);X.strokeStyle=`rgba(150,140,210,${0.22*chain})`;X.beginPath();X.arc(x,y,c.a,0,TAU);X.stroke();X.strokeStyle=`rgba(255,255,255,${0.75*chain})`;X.beginPath();X.moveTo(x,y);X.lineTo(nx,ny);X.stroke();x=nx;y=ny;}}
 const n=Math.floor(u*600);if(n>0){X.beginPath();for(let i=0;i<=n;i++){const[x,y]=PATH[i];i?X.lineTo(x,y):X.moveTo(x,y);}X.strokeStyle='#FE9117';X.lineWidth=4.5;X.lineJoin='round';X.shadowColor='#FE9117';X.shadowBlur=16;X.stroke();X.shadowBlur=0;}}
const tl=gsap.timeline({paused:true});const st={t:0};tl.to(st,{t:4,duration:4,ease:'none'},0);
tl.eventCallback('onUpdate',()=>draw(tl.time()));draw(0);
window.__timelines=window.__timelines||{};window.__timelines["main"]=tl;
</script>
<script type="module">
// Fit the composition to the window and play its timeline on a loop.
const root = document.getElementById('root');
const width = Number(root?.dataset.width) || 1080;
const height = Number(root?.dataset.height) || 1920;
const fit = () => {
  if (!root) return;
  const scale = Math.min(innerWidth / width, innerHeight / height);
  Object.assign(root.style, {
    width: width + 'px',
    height: height + 'px',
    transform: 'scale(' + scale + ')',
    marginLeft: (innerWidth - width * scale) / 2 + 'px',
    marginTop: (innerHeight - height * scale) / 2 + 'px',
  });
};
fit();
addEventListener('resize', fit);
window.__timelines?.main?.repeat(-1).play(0);
</script>
</body>
</html>

Vorschau der Technik „Einheitskreis speist eine laufende Sinuskurve“ — Bei 0:03 im Video

Daten

Einheitskreis speist eine laufende Sinuskurve

Ein Punkt dreht sich mit konstanter Winkelgeschwindigkeit auf einem leuchtenden Kreis; seine Kosinus- und Sinusstrecken werden als farbige Segmente gezeichnet, und eine gestrichelte Linie trägt seine Höhe zu einem Punkt am Anfang eines Graphen. Der gesamte Verlauf des Winkels zieht mit etwa 104 px pro Radiant nach rechts, sodass die Sinuskurve in Echtzeit aus dem Kreis wächst, mit einer schwachen Kosinuskurve daneben und Live-Anzeigen.

Wann einsetzen Um ein periodisches Signal, einen Rhythmus oder jeden zyklischen Wert zu erklären.

Code anzeigen

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Einheitskreis speist eine laufende Sinuskurve</title>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gsap.min.js"></script>
<style>
html, body { margin: 0; height: 100%; overflow: hidden; background: #000; }
#root { position: relative; overflow: hidden; transform-origin: 0 0; }
</style>
<style>
#root{position:relative;width:100%;height:100%;background:#03030a;overflow:hidden}#c{position:absolute;inset:0;width:100%;height:100%;display:block}
</style>
</head>
<body>
<div id="root" data-composition-id="main" data-start="0" data-duration="4" data-width="1920" data-height="1080"><canvas id="c" class="clip" data-start="0" data-duration="4" width="1920" height="1080"></canvas></div>
<script>
const W=1920,H=1080,TAU=Math.PI*2,c=document.getElementById('c'),X=c.getContext('2d');
const clamp=(v,a=0,b=1)=>Math.min(b,Math.max(a,v)),seg=(t,a,b)=>clamp((t-a)/(b-a)),sio=u=>(1-Math.cos(Math.PI*u))/2;
const CX=500,CY=540,R=220,X0=820,K=103.8,OMEGA=4.524; // circle, graph start, px per radian, rad/s
function draw(t){const th=OMEGA*t,px=CX+R*Math.cos(th),py=CY-R*Math.sin(th);X.fillStyle='#03030a';X.fillRect(0,0,W,H);X.lineCap='round';
 X.fillStyle='#433E53';X.fillRect(180,539,1640,2);X.fillRect(499,230,2,620);
 const glow=(col,w,b)=>{X.strokeStyle=col;X.lineWidth=w;X.shadowColor=col;X.shadowBlur=b;X.stroke();X.shadowBlur=0;};
 X.beginPath();X.arc(CX,CY,R,0,TAU);glow('#2DD4B0',3,16);
 X.beginPath();X.arc(CX,CY,52,0,-Math.min(th,TAU),true);glow('#FE9117',2.2,6);
 X.beginPath();X.moveTo(CX,CY);X.lineTo(px,CY);glow('#2DD4B0',4,8);X.beginPath();X.moveTo(px,CY);X.lineTo(px,py);glow('#FB2D89',4,8);
 X.beginPath();X.moveTo(CX,CY);X.lineTo(px,py);glow('#FFFFFF',2,0);
 X.setLineDash([5,6]);X.beginPath();X.moveTo(px,py);X.lineTo(X0,py);glow('rgba(251,45,137,.7)',1.5,0);X.setLineDash([]);
 const span=Math.min(th,(1820-X0)/K);
 for(const[fn,col,w,b]of[[Math.cos,'rgba(45,212,176,.45)',1.6,0],[Math.sin,'#FB2D89',4,14]]){X.beginPath();for(let d=0;d<=span;d+=0.02){const x=X0+K*d,y=CY-R*fn(th-d);d===0?X.moveTo(x,y):X.lineTo(x,y);}glow(col,w,b);}
 X.fillStyle='#FFFFFF';X.beginPath();X.arc(px,py,7,0,TAU);X.fill();X.fillStyle='#FB2D89';X.beginPath();X.arc(X0,py,7,0,TAU);X.fill();
 X.font='18px monospace';X.fillStyle='#ABA6BB';X.fillText('θ = '+th.toFixed(3)+' rad',281,839);X.fillText('sin θ = '+Math.sin(th).toFixed(3),281,869);}
const tl=gsap.timeline({paused:true});const st={t:0};tl.to(st,{t:4,duration:4,ease:'none'},0);
tl.eventCallback('onUpdate',()=>draw(tl.time()));draw(0);
window.__timelines=window.__timelines||{};window.__timelines["main"]=tl;
</script>
<script type="module">
// Fit the composition to the window and play its timeline on a loop.
const root = document.getElementById('root');
const width = Number(root?.dataset.width) || 1080;
const height = Number(root?.dataset.height) || 1920;
const fit = () => {
  if (!root) return;
  const scale = Math.min(innerWidth / width, innerHeight / height);
  Object.assign(root.style, {
    width: width + 'px',
    height: height + 'px',
    transform: 'scale(' + scale + ')',
    marginLeft: (innerWidth - width * scale) / 2 + 'px',
    marginTop: (innerHeight - height * scale) / 2 + 'px',
  });
};
fit();
addEventListener('resize', fit);
window.__timelines?.main?.repeat(-1).play(0);
</script>
</body>
</html>

Vorschau der Technik „Phyllotaxis-Samenfeld, das zu einem Ring wirbelt“ — Bei 0:16 im Video

Partikel

Phyllotaxis-Samenfeld, das zu einem Ring wirbelt

1500 Samen liegen bei Winkel n·137,508° und Radius c·√n; sie erscheinen von der Mitte nach außen mit einer Ease-out-Anzahl, drehen sich und wechseln von Weiß zu einem Zyklus aus Pink, Violett und Türkis. Auf Stichwort bewegt sich jeder Samen in Polarkoordinaten (Mittelpunkt, Radius und Winkel mit kubischem in-out interpoliert und kleinem Versatz nach n) auf einen kleineren Kreis an anderer Stelle, dann weichen die Punkte einer durchgehenden Linie.

Wann einsetzen Organisches Wachstum, das sich zu einer klaren Form auflöst: ein Reveal, ein Logo-Ring oder ein Ladezustand.

Code anzeigen

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Phyllotaxis-Samenfeld, das zu einem Ring wirbelt</title>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gsap.min.js"></script>
<style>
html, body { margin: 0; height: 100%; overflow: hidden; background: #000; }
#root { position: relative; overflow: hidden; transform-origin: 0 0; }
</style>
<style>
#root{position:relative;width:100%;height:100%;background:#03030a;overflow:hidden}#c{position:absolute;inset:0;width:100%;height:100%;display:block}
</style>
</head>
<body>
<div id="root" data-composition-id="main" data-start="0" data-duration="4" data-width="1920" data-height="1080"><canvas id="c" class="clip" data-start="0" data-duration="4" width="1920" height="1080"></canvas></div>
<script>
const W=1920,H=1080,TAU=Math.PI*2,c=document.getElementById('c'),X=c.getContext('2d');
const clamp=(v,a=0,b=1)=>Math.min(b,Math.max(a,v)),seg=(t,a,b)=>clamp((t-a)/(b-a)),sio=u=>(1-Math.cos(Math.PI*u))/2;
const GA=137.508*Math.PI/180,N=1500,C=10.6,COLS=['#FB2D89','#7C6CF2','#5A4CE0','#2DD4B0','#7C6CF2']; // golden angle, count, spacing
const io=u=>u<.5?4*u*u*u:1-Math.pow(-2*u+2,3)/2;
function draw(t){X.fillStyle='#03030a';X.fillRect(0,0,W,H);const count=Math.floor(N*(1-Math.pow(1-seg(t,0,1.4),2))),spin=0.9*t,col=seg(t,1.3,1.6);
 for(let n=1;n<=count;n++){const r=C*Math.sqrt(n),a0=n*GA+spin;let x=960+r*Math.cos(a0),y=540+r*Math.sin(a0);
  const u=io(seg(t,2.1+n/N*0.2,2.5+n/N*0.2));if(u>0){const a1=n/N*TAU*3+Math.PI,cx=960-400*u,cy=540-60*u,rr=r+(191-r)*u,aa=a0+(a1-a0)*u+1.2*u;x=cx+rr*Math.cos(aa);y=cy+rr*Math.sin(aa);}
  const al=1-seg(t,2.75,2.9);if(al<=0)continue;X.globalAlpha=al;X.fillStyle=col>0.5?COLS[n%5]:'#E1DEEB';X.beginPath();X.arc(x,y,2+2*Math.sqrt(n/N),0,TAU);X.fill();}
 X.globalAlpha=seg(t,2.7,2.9);X.strokeStyle='#2DD4B0';X.lineWidth=2.6;X.shadowColor='#2DD4B0';X.shadowBlur=12;X.beginPath();X.arc(560,480,191,0,TAU);X.stroke();X.shadowBlur=0;X.globalAlpha=1;}
const tl=gsap.timeline({paused:true});const st={t:0};tl.to(st,{t:4,duration:4,ease:'none'},0);
tl.eventCallback('onUpdate',()=>draw(tl.time()));draw(0);
window.__timelines=window.__timelines||{};window.__timelines["main"]=tl;
</script>
<script type="module">
// Fit the composition to the window and play its timeline on a loop.
const root = document.getElementById('root');
const width = Number(root?.dataset.width) || 1080;
const height = Number(root?.dataset.height) || 1920;
const fit = () => {
  if (!root) return;
  const scale = Math.min(innerWidth / width, innerHeight / height);
  Object.assign(root.style, {
    width: width + 'px',
    height: height + 'px',
    transform: 'scale(' + scale + ')',
    marginLeft: (innerWidth - width * scale) / 2 + 'px',
    marginTop: (innerHeight - height * scale) / 2 + 'px',
  });
};
fit();
addEventListener('resize', fit);
window.__timelines?.main?.repeat(-1).play(0);
</script>
</body>
</html>

Vorschau der Technik „Wortmarken-Buchstaben steigen durch einen Clip, mit gezeichneter Verlaufslinie“ — Bei 0:18 im Video

Typografie

Wortmarken-Buchstaben steigen durch einen Clip, mit gezeichneter Verlaufslinie

Jeder Buchstabe einer fetten, weit gesperrten Wortmarke sitzt in einer eigenen Clip-Box und steigt eine Versalhöhe von unten auf (0,36 s, power3.out, 0,06 s Versatz); darunter wird eine 3-px-Linie in Türkis-Violett-Pink gezeichnet (0,4 s, power3.inOut), ein gesperrter Monospace-Slogan löst sich aus zufälligen Zeichen auf, und eine kursive Serifenzeile blendet zuletzt ein.

Wann einsetzen Eine Endkarte oder ein Titel, der selbstbewusst Buchstabe für Buchstabe landen soll.

Code anzeigen

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Wortmarken-Buchstaben steigen durch einen Clip, mit gezeichneter Verlaufslinie</title>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gsap.min.js"></script>
<style>
html, body { margin: 0; height: 100%; overflow: hidden; background: #000; }
#root { position: relative; overflow: hidden; transform-origin: 0 0; }
</style>
<style>
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@700&family=JetBrains+Mono&family=Old+Standard+TT:ital@1&display=swap");#root{position:relative;width:100%;height:100%;background:radial-gradient(circle at 50% 50%,#10063a 0,#03030a 800px);overflow:hidden}#card{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#eae7f9}#word{font:700 170px/1 Inter,sans-serif;letter-spacing:.16em;margin:0 0 30px .16em;display:flex}#word span{display:inline-block;clip-path:inset(0 -0.2em 0 -0.2em)}#word i{display:inline-block;font-style:normal}#rule{width:1200px;height:3px;background:linear-gradient(90deg,#2DD4B0,#7C6CF2,#FB2D89);transform-origin:0 50%}#tag{font:400 17px "JetBrains Mono",monospace;letter-spacing:.55em;white-space:pre;margin:40px 0 0}#motto{font:italic 400 34px "Old Standard TT",serif;color:#bdb6d6;margin:26px 0 0}
</style>
</head>
<body>
<div id="root" data-composition-id="main" data-start="0" data-duration="3" data-width="1920" data-height="1080"><div id="card" class="clip" data-start="0" data-duration="3"><h1 id="word"></h1><div id="rule"></div><p id="tag">IDEAS IN MOTION   ×   STUDIO.APP</p><p id="motto">From idea to video in one chat</p></div></div>
<script>
const WORD='STUDIO NAME', TAG=document.getElementById('tag').textContent, G='ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789#%&*+=';
const word=document.getElementById('word');[...WORD].forEach(ch=>{const s=document.createElement('span');const i=document.createElement('i');i.textContent=ch===' '?'\u00a0':ch;s.appendChild(i);word.appendChild(s);});
const tl=gsap.timeline({paused:true});
tl.fromTo('#word i',{yPercent:110},{yPercent:0,duration:0.36,ease:'power3.out',stagger:0.06},0.05); // rise per letter
tl.fromTo('#rule',{scaleX:0},{scaleX:1,duration:0.4,ease:'power3.inOut'},0.55);
const sc={p:0};tl.fromTo(sc,{p:0},{p:1,duration:0.4,ease:'power2.out',onUpdate:()=>{const k=Math.floor(sc.p*TAG.length);let o='';for(let i=0;i<TAG.length;i++){const c=TAG[i];o+=i<k||c===' '?c:G[(i*7+Math.round(tl.time()*60)*13)%G.length];}document.getElementById('tag').textContent=o;}},0.5);
tl.fromTo('#tag',{opacity:0},{opacity:1,duration:0.1},0.45);
tl.fromTo('#motto',{opacity:0},{opacity:1,duration:0.28,ease:'none'},0.72);
window.__timelines=window.__timelines||{};window.__timelines["main"]=tl;
</script>
<script type="module">
// Fit the composition to the window and play its timeline on a loop.
const root = document.getElementById('root');
const width = Number(root?.dataset.width) || 1080;
const height = Number(root?.dataset.height) || 1920;
const fit = () => {
  if (!root) return;
  const scale = Math.min(innerWidth / width, innerHeight / height);
  Object.assign(root.style, {
    width: width + 'px',
    height: height + 'px',
    transform: 'scale(' + scale + ')',
    marginLeft: (innerWidth - width * scale) / 2 + 'px',
    marginTop: (innerHeight - height * scale) / 2 + 'px',
  });
};
fit();
addEventListener('resize', fit);
window.__timelines?.main?.repeat(-1).play(0);
</script>
</body>
</html>

Weitere Prompts

Low-Poly-Logo-Aufbau mit getipptem Namen als Lockup

<direction> Erstelle einen 21-sekündigen Logo-Reveal im Querformat, 1920x1080 bei 60 fps. Er setzt mein Logo langsam aus Low-Poly-Facetten zusammen und endet in einem horizontalen Lockup, in dem mein Markenname getippt wird und darunter ein Slogan steht. Die Idee: ein langer, ruhiger Aufbau ohne Schnitte über vierzehn Sekunden, eine Entladung auf dem Drop der Musik innerhalb von zwei Sekunden, dann ein ruhiges, getipptes Ende. Der Look: ein fast schwarzer Hintergrund mit weicher, kreisförmiger Vignette, flache Markenfarben und klare Grotesk-Schrift. Vermeide Verläufe im Logo, sichtbare Nähte zwischen den Dreiecken, Schnitte während des Aufbaus und alles Unruhige hinter dem Logo. </direction> <structure> 1. 0–2,6 s, das Drahtgitter: Ein Low-Poly-Drahtgitter der Kontur meines Logos zeichnet sich vom unteren Ende des Logos nach außen selbst. Es hat etwa 35–45 Eckpunkte und 90 dünne Linien. 2. 1,9–13,3 s, der Aufbau: Das Logo wird entlang dieses Drahtgitters in etwa 55 Dreiecke zerschnitten, die Stück für Stück von außerhalb des Bildes hereinfliegen. Die Landungen beginnen langsam am unteren Ende des Logos und werden nach oben dichter. Das letzte Stück landet bei 13,3 s, und das Logo ist dann vollständig und exakt. Halte das fertige Logo etwa eine Sekunde. 3. 14,38 s, der Blitz, genau auf dem Drop der Musik. Ein Lichtausbruch, ein sich ausdehnender orangefarbener Ring und ein heller Blitz auf dem Logo erfolgen gleichzeitig. 0,1 s nach dem Schlag wächst hinter dem Logo eine tiefe Tintenplatte und wird zu einem App-Icon mit abgerundeten Ecken. Halte das zentrierte Icon eine Sekunde. 4. 15,74–16,15 s, das Gleiten: Das Icon schrumpft auf etwa 42 % und wandert ins linke Drittel, um Platz für den Namen zu schaffen. 5. 16,1–21 s, der Name: Ein pinker Cursor erscheint rechts vom Icon, und der Name wird getippt, zum Beispiel "Brand Name" (ersetze es durch deine Marke). Bei 18,15 s fährt der Slogan darunter hinein, zum Beispiel "Your tagline here" (ersetze ihn durch deinen). Der Cursor blinkt dreimal im Takt und verschwindet bei 19,9 s. Halte das Lockup bis zum Ende. </structure> <composition> Hintergrund: eine fast schwarze radiale Vignette, #0D0B1E in der Mitte, dunkler werdend zu #040308 in den Ecken. Palette: - Tiefes Tintenblau #1C0B5D für die Icon-Platte. - Pink #FB2D89 als Hauptakzent. - Orange #FE9117. - Weiß #FFFFFF. - Helles Lavendel #E9E4F2 und #F0EDFF für Linien und weichen Text. - Violett #7C6CF2 nur im Hintergrundglühen. Das Logo bleibt in flachen Farben ohne Verläufe. Drahtgitter: Linien in Lavendel #E9E4F2 bei 60 % Deckkraft, 1,3 px dick; Eckpunkte in #F0EDFF mit 2,6 px Radius. Icon-Platte: ein Kreis mit 676 px, der zu einem abgerundeten Quadrat mit 24 % Eckenradius und weichem Schlagschatten wird. Schrift: der Name in einer fetten Grotesk (Golos Text 700, etwa 155 px, weiß). Der Slogan steht darunter in einer leichten Grotesk (Onest 400, etwa 49 px, Lavendel bei 74 % Deckkraft). Cursor: ein pinker Balken #FB2D89, 10 x 128 px, mit weichem pinkem Glühen. Das finale Lockup (Icon links, Name und Slogan rechts) ist als Ganzes im Bild zentriert. </composition> <techniques> Zoom: Der Anfang liegt auf einem sehr langsamen Zoom-in um die Bildmitte, von Skalierung 0,886 bei 0 s auf 0,998 bei 11 s, danach still. Drahtgitter zeichnen: Jede Linie wächst linear von ihrem früheren zu ihrem späteren Eckpunkt in 0,08–0,45 s. Ein kleiner Punkt blendet an jedem Eckpunkt ein, wenn eine Linie ihn erreicht. Einflug: Jedes Stück besteht aus ein bis drei Dreiecken. Es kommt schnell auf einer gebogenen Bahn herein und bremst in etwa 0,5 s in seine Position ab, wobei es in 3D taumelt. Drehung, Flip und Neigung laufen sanft auf null aus. Im Flug ist es auf etwa 60 % abgedunkelt und leicht weich; bei der Landung ist es scharf und voll beleuchtet. Jedes Dreieck zeigt genau seinen Teil des flachen Logos, sodass der fertige Aufbau nahtlos ist. Glühen: Ein schwaches pinkes Glühen #FB2D89 unter 10 % Deckkraft, das in Violett #7C6CF2 übergeht, wächst hinter dem Logo, während es sich füllt. Blitz bei 14,38 s: - Ein pink-malvenfarbener Lichtausbruch im Screen-Modus flammt um das Logo auf und verblasst über 0,8 s. - Ein dünner, warm-orangefarbener Ring, 7 px, startet bei 300 px Radius und rast mit konstanter Geschwindigkeit in 0,38 s aus dem Bild. - Das Logo blitzt hell auf und beruhigt sich in 0,3 s. Platte: 0,1 s nach dem Schlag wächst die #1C0B5D-Platte in 0,21 s (Sine Ease-out) von einem Punkt zum 676-px-Kreis. Zuerst ist sie beleuchtet, dann werden ihre Ecken auf 24 % Radius eckig. Gleiten: Das Icon skaliert in 0,415 s (power3 ease-in-out) auf etwa 42 % und wandert ins linke Drittel. Bei höchster Geschwindigkeit wird es bis 7 px unscharf und landet scharf. Danach wächst es sehr langsam weiter, etwa 3 % in fünf Sekunden. Tippen: ein Buchstabe pro Sechzehntelnote der Musik (0,156 s bei 96 BPM). Jeder Buchstabe blendet in 0,05 s ein, während der Cursor ihm nachspringt. Slogan: er fährt in etwa 0,2 s von links nach rechts ein, Zeichen für Zeichen. </techniques> <music> Ein Instrumental mit 96 BPM, hoffnungsvoll und modern, genau 21 Sekunden lang. - Anfang: ein sanftes Spieluhr-Glockenspiel über warmen Pads. - Um 4,4 s: ein volles, beschwingtes Arrangement setzt ein (Schlagzeug, Bass, Streicher, eine helle Glockenspiel-Linie). Ein Filter öffnet sich über zwei Takte und steigert sich bis zum Blitz. - 14,38 s: ein Beckenschlag und ein großer Akkord landen genau auf dem Blitz. - Nach dem Drop: die Spieluhr kehrt über gehaltenen Pads unter dem Lockup zurück und verklingt bei 21 s in Stille. Halte alles im Taktraster, damit das Tippen und das Cursor-Blinken auf Sechzehntel und Schläge fallen. </music> <sound> Soundeffekte über der Musik: - Ein weicher Riser in die erste Dreiecks-Landung. - Ein Riser in den Blitz, dann ein tiefer Boom und ein leichter Glas-Impact darauf. - Ein kurzes Whoosh, wenn der Ring hinausrast, und ein weiteres, wenn das Icon gleitet. - Ein leises Tastenklicken für jeden getippten Buchstaben und ein schwaches, wenn der Slogan erscheint. Kein Voice-over. Gesamtlautstärke etwa -14 LUFS, True Peak unter -1 dBTP. </sound> <references> Ein hochwertiger Tech- oder App-Launch-Logo-Sting: ein Aufbau vom Low-Poly-Drahtgitter zum Vollkörper im Stil eines 3D-Facettenaufbaus, auf dem Drop in einen App-Icon-Reveal entladen, mit einem terminalartig getippten Namens-Lockup. </references>

Vorschau des Prompts „Beat-synchronisiertes Motion-Design-Showreel“

Beat-synchronisiertes Motion-Design-Showreel

<direction> Erstelle ein 15-sekündiges Motion-Design-Showreel für [your brand], 1920x1080 im Querformat bei 60 fps, komplett gezeichnet: animierte Schrift, Formen, Partikel, eine 3D-Punktwolke und ein Dashboard, kein Filmmaterial. Die Idee: ein schnelles Produkt-Reel, in dem jeder Szenenwechsel auf einen House-Beat mit 128,57 BPM fällt. Ein Beat dauert genau 28 Frames (0,4667 s), jeder Schnitt sitzt auf diesem Raster, und der erste große Hit landet bei 1,867 s (Beat 4). Der Look wechselt zwischen fast schwarzen und hellen lavendelweißen Szenen, mit Hot Pink als Hauptakzent sowie Violett und Orange. Titel nutzen eine fette Grotesk, Bildunterschriften eine Mono, und das Statement eine kursive Serife. Ein Rahmen im Broadcast-Stil liegt bis zu einem finalen Glitch über dem ganzen Reel. Verwende mein Logo-Zeichen auf der Endkarte und ersetze jeden zitierten Text durch meine eigenen Worte, jeweils etwa gleich lang, damit das Layout hält. Vermeide Fotos, Stock-Footage, weiche generische Überblendungen und alles, was vom Beat-Raster abdriftet. </direction> <structure> 1. 0–1,85 s, Intro auf Fast-Schwarz. Eine dünne Lineal-Linie (1440 px breit, hell bei 22 % Deckkraft) wächst bei 0,34 s aus ihrer Mitte (expo.out, 0,65 s), dann erscheinen 13 Striche von links nach rechts, je einen Frame auseinander. Ein pinker 80-px-Ball fällt von links oben herein und driftet zur Mitte (power2.out, 1,25 s). Er springt dreimal auf dem Lineal, wird bei jedem Aufprall gestaucht und bei jedem Fall gestreckt, mit leichter Bewegungsunschärfe bei hoher Geschwindigkeit. Unter dem Lineal tippt sich eine Mono-Zeile ein, ein Zeichen alle 1,56 Frames, gefolgt von einem blinkenden Blockcursor (Beispiel "no keyframes.", ersetze es durch deinen Text). Bei 1,28 s wird der Ball auf 0,8x gestaucht und schwillt dann auf einer Expo-in-Kurve an, bis er das Bild um 1,82 s pink füllt. 2. 1,82–3,70 s, vier Wörter, eines pro Beat. Jedes fette 300-px-Wort steht auf eigenem Hintergrund mit einer Mono-Kommentarzeile darunter (Beispiele "// describe your idea", "// live preview", "// refine in words", "// mp4 export"). Dahinter laufen oben und unten zwei Reihen umrandeter 205-px-Kopien der vier Wörter mit 760 px/s in entgegengesetzte Richtungen. Die Konturen sind in der Schriftfarbe der Szene mit 7–14 % Deckkraft gezogen. - Wort 1 (Beispiel "DESCRIBE"), tiefes Indigo auf Pink: das Wort landet von 1,39x Skalierung mit expo.out (0,33 s), während seine Buchstaben 0,03 s versetzt mit schnellem Entschärfen der Unschärfe erscheinen. - Wort 2 (Beispiel "PREVIEW"), hell auf Fast-Schwarz bei 2,333 s: die Laufweite schließt sich von 150 px auf eng mit expo.out (0,45 s), Einblenden über 3 Frames. - Wort 3 (Beispiel "REFINE"), violett auf der hellen Seite bei 2,8 s: Buchstaben steigen 340 px hinter einer Maskenlinie 40 px unter der Grundlinie mit back.out(2.2) auf, je 0,3 s, 0,035 s versetzt. - Wort 4 (Beispiel "EXPORT"), hell auf Violett bei 3,267 s: Buchstaben poppen auf 1/32-Noten auf (3,5 Frames Abstand), jeder von 0,6x zu einem 1,13x-Hüpfer 50 px hoch, dann beruhigt er sich. 3. 3,46–4,02 s, Streifen-Wipe. Acht vertikale 240-px-Streifen, abwechselnd pink und helle Seite, steigen von unten auf (power2.inOut, 0,18 s, 0,7 Frames versetzt, links zuerst). Sie halten, steigen dann weiter nach oben und hinaus und enthüllen von unten die nächste Szene. 4. 3,70–5,60 s, Formen auf Fast-Schwarz. Ein 120-px-Raster aus kleinen gedämpften abgerundeten Quadraten (ein Fünftel sind Umrisse) mit winzigen Kreuzen dazwischen. Bei jedem Beat (3,73, 4,2, 4,67 und 5,13 s) geht eine Welle mit 2000 px/s von der Mitte aus. Wo ihre Front vorbeizieht, wächst jede Zelle von 42 auf 74 px, rundet sich zum Kreis, dreht sich um 38 Grad und wird pink. Die erste Welle enthüllt das Raster, und das Raster dreht sich langsam gegen den Uhrzeigersinn, immer schneller. Nach der letzten Welle leeren sich die Zellen und blenden bis 5,47 s aus. 5. 5,55–7,42 s, Partikel. Ein weißer Blitzpunkt mit dünnem Schockring erscheint bei 5,62 s, dann platzen 7000 winzige Quadrate aus der Mitte. Sie sammeln sich zu einem riesigen 590-px-Wort (Beispiel "IDEA"), über seine Breite von Orange über Lavendel zu Violett gefärbt und um einen Pixel flimmernd. Ab 7,0 s strömen sie mit Schweifen nach rechts davon, der linke Teil des Wortes zuerst. Ein weiches rosa radiales Leuchten liegt dahinter. 6. 7,42–9,45 s, 3D auf tiefindigofarbenem radialem Hintergrund. Eine Fibonacci-Kugel aus 1700 Punkten (Radius 362 px) dreht sich langsam über einem perspektivischen Boden aus dünnen violetten Linien, dessen Reihen auf den Betrachter zukriechen. Punkte sind pink oder violett, vorne größer und heller. Ab 8,12 s wandert jeder Punkt an seinen Platz auf einem (2,3)-Torusknoten (cubic in-out, zufällige Verzögerungen bis 0,16 s), und der Knoten dreht sich weiter. 7. 9,08–9,65 s, ein zweiter Streifen-Wipe wie in Szene 3, in Violett, Pink und heller Seite. 8. 9,27–11,1 s, Dashboard auf der hellen Seite mit schwachen vertikalen Hilfslinien. - Schritte: drei Zeilen mit fetten 180-px-Schrittnummern zählen mit expo.out hoch ("01", "02", "03", die dritte in Pink) mit Mono-Beschriftungen (Beispiel "PICK A TEMPLATE"). Jede Zeile steigt in ihre eigene beschnittene Box, 0,08 s versetzt. - Karte: eine weiße Karte (880x740, 26 px Eckenradius, weicher Indigo-Schatten) hebt sich 90 px ein (power3.out, 0,45 s). Sie enthält einen fetten kleingeschriebenen Titel, eine kleine "LIVE"-Pille und einen Ring, der sich mit power3.out füllt, mit einem kurzen Label darin. - Diagramm: vierzehn orangefarbene Balken wachsen von der Basis, 0,031 s versetzt, der letzte vollflächig pink. Eine violette Linie zeichnet sich mit sine.inOut (0,72 s) darüber, mit einem Punkt, einem Halo und einem dunklen Tag an ihrer Spitze (Beispiel "No keyframes"). 9. 10,96–11,45 s, Balken-Wipe. Acht horizontale Bänder, abwechselnd fast schwarz und pink, fegen von links herein (power3.inOut, 0,2 s, je einen Frame versetzt, oben zuerst) und ziehen nach rechts hinaus. 10. 11,07–13,07 s, Statement auf Fast-Schwarz. Vier Bündel aus je 28 haarfeinen Linien fließen als Bänder, additiv gemischt, durchs Bild: Pink zu Orange oben, dann Pink zu Violett, Violett und Violett zu Pink unten. Ein zweizeiliges Statement in 290-px-kursiver Serife erscheint Buchstabe für Buchstabe. Jeder Buchstabe bewegt sich 36 px nach oben und verliert über 0,16 s die Unschärfe, 0,02 s versetzt in Zeile eins und 0,035 s in Zeile zwei. Zeile eins ist hell und beginnt bei x 334 (Beispiel "Ideas in"); Zeile zwei ist pink und endet bei x 1438 (Beispiel "motion."). 11. 12,73–13,07 s, Glitch. Schriftscheiben springen seitwärts, das Bild invertiert zweimal, kleine violette, gelbe und pinke Blöcke flackern, und die Schrift spaltet sich in Pink und Türkis. Der Broadcast-Rahmen und seine Zähler verschwinden. 12. 13,07–15,0 s, Endkarte auf Fast-Schwarz. - Ein blasser Blitz klingt ab (0,26 s). - Eine fette 260-px-Wortmarke ("[your brand]") steigt Buchstabe für Buchstabe hinter ihrer Grundlinie auf (back.out(1.6), 0,32 s, 0,05 s versetzt). - Mein Logo-Zeichen fällt von oben wie der Ball im Intro herein, wird bei 13,51 s beim Aufprall gestaucht und setzt sich als Schlusspunkt der Wortmarke. - Eine dünne Linie zeichnet sich unter dem Lockup (power3.out, 0,3 s). - Eine weit gesperrte Mono-Zeile entschlüsselt sich darunter von verwürfelten pinken Zeichen zu hellen Buchstaben (13,76–14,6 s). - Ein pinker kursiver Serifen-Call-to-Action blendet bei 14,33 s ein (Beispiel "try it free."). - Am unteren Rand blendet eine gedimmte Reihe aus vier kurzen Features ein. Halte die Endkarte bis 15 s. </structure> <composition> - Palette: - Fast-Schwarz #0D0B1E für dunkle Hintergründe. - Tiefes Indigo #1C0B5D für dunkle Schrift und die 3D-Szene. - Helle Seite #FAF9FF für helle Hintergründe und helle Schrift. - Lavendel #F0EDFF für weiche Flächen. - Gedämpft #6B6385 für Beschriftungen und #E9E4F2 für Linien. - Akzente: Haupt-Pink #FB2D89, zweites Violett #7C6CF2, warmes Orange #FE9117, dazu Weiß. - Gelb #FFD23F und Türkis #2DD4B0 nur als Glitch-Sprenkel. - Wenn ich Markenfarben angebe, setze sie nach Rolle ein. - Schriften: Roboto Flex in Stärke 900 mit enger Laufweite (-0,035 em) für alle Titel. JetBrains Mono für den Rahmen, Beschriftungen und Kommentarzeilen. Instrument Serif Italic für das zweizeilige Statement und den Call-to-Action. - Eine weiche seitliche Vignette, nur an den Rändern links und rechts dunkler: etwa -8 % in der Randmitte und -12 % in den Ecken. - Ein Rahmen im Broadcast-Stil über allem bis zum Glitch: - 26-px-Eckklammern. - Ein Titel oben links (Beispiel "[YOUR BRAND] / YOUR TAGLINE"). - Ein laufender Timecode oben rechts (00:00:SS:FF bei 60 fps). - Der aktuelle Kapitelname unten links. - Ein Frame-Zähler "NNN / 900" mit einem 300-px-Fortschrittsbalken unten rechts. - Jeder Teil ist hell bei 0,9 Deckkraft im Exclusion-Mischmodus, sodass er auf hellen Szenen dunkel und auf Pink oder Violett getönt wird. Der Rahmen blendet bei 0,3 s ein. </composition> <techniques> - Jeder Szenenwechsel sitzt auf dem 28-Frame-Beat-Raster. Szenen und Wipes überlappen um einige Frames, sodass nie ein Frame leer ist. - Variiere die Übergänge: der Ball, der in den nächsten Hintergrund anschwillt, harte Farbschnitte zwischen den vier Wörtern, vertikale Streifen-Wipes, ein horizontaler Balken-Wipe, ein Blitz mit Schockring und ein RGB-Split-Glitch in die Endkarte. - Gib dem Ball und dem Logo-Zeichen physische Bewegung: Stauchen beim Aufprall, Strecken im Fall, leichte Bewegungsunschärfe bei Tempo. - Nutze durchgehend Buchstabe-für-Buchstabe-Auftritte, jedes Wort mit eigener Easing-Kurve (expo.out-Landungen, back.out-Aufstiege aus einer Maske, Pops auf 1/32-Noten), wobei die Buchstaben beim Eintreffen scharf werden. - Halte alles scharf und vektorbasiert: Partikel, Punkte und Linien sind winzig und klar, und die Glows bleiben weich und hinter der Schrift. </techniques> <music> Erstelle ein originales House-Bett mit 128,57 BPM, exakt 15 s lang, auf das Beat-Raster gelegt. - Intro: ein luftiger Pad mit blubbernden Plucks. - Ab dem Hit bei 1,867 s: der volle Groove mit Four-on-the-Floor-Kick, Claps, Hats und Sidechain-Bass. - Ende: ein Riser und Glitch in einen großen finalen Hit bei 13,07 s, dann klingt der Schlussakkord bis 15 s aus. </music> <sound> Füge über dem Bett für den Schnitt komponierte Hits hinzu: - ein Riser in einen Boom beim Fill bei 1,867 s - kurze Whooshes mit Spitze auf jedem Wortschnitt und jedem Wipe - weiche Klicks auf den Formwellen - ein kleiner Boom und ein Glas-Tick beim Partikelblitz - ein Streak-Whoosh, wenn die Partikel abziehen - ein Sub-Drop in die 3D-Szene - ein Riser und digitale Glitch-Ticks in den finalen Boom bei 13,07 s - eine Glocke, wenn das Logo-Zeichen bei 13,51 s landet Kein Voice-over. Mix auf etwa -14 LUFS, True Peak unter -1 dBTP. </sound> <references> Ein Tech-Produktlaunch-Showreel im Stil schicker animierter Marken-Reels: ein Broadcast-HUD-Overlay, kinetische Typografie, generative Partikel, eine rotierende 3D-Punktwolke und ein sauberes UI-Dashboard. </references>

Vorschau des Prompts „Nahtloser 15-Sekunden-App-Showreel in purer Motion Graphics“

Nahtloser 15-Sekunden-App-Showreel in purer Motion Graphics

<direction> Erstelle einen 15-sekündigen Motion-Graphics-Showreel im Querformat für meine App, 1920x1080 bei 60 fps. Alles ist gezeichnete Grafik, ohne Filmmaterial. Das Einzige, was ich beisteuere, ist das Logo meiner App (ein App-Icon als abgerundetes Quadrat). Die Idee ist eine durchgehende Bewegung, bei der jeder Abschnitt sein letztes Objekt an den nächsten weitergibt. Ein Punkt wird zum Logo, das Logo wird zum Namen, die Buchstaben werden zu Punkten, die Punkte werden zu Rennbällen, ein Ball flutet das Bild, eine Form zerfällt in Kacheln, die Kacheln werden zu einer 3D-Punktwolke, und dann folgen kinetische Wörter und eine Endkarte. Jeder Abschnitt zeigt eine Motion-Fähigkeit. Verwende flache Farben, klare Vektorformen und ein Kamerasucher-HUD über allem, mit Schnitten, die auf einen 128-BPM-Track abgestimmt sind. Vermeide Filmmaterial, Verläufe und Texturen, Voice-over und jeden Abschnitt, der aus dem Nichts beginnt, statt aus dem vorherigen herauszuwachsen. </direction> <structure> 1. 0–1,9 s, fast schwarz: Ein pinker Punkt sitzt in einem dünnen grauen Ring, und der Ring öffnet sich mit expo.out. Ein zweiter Ring rollt zu einem schwachen großen Kreis aus (0,45 s, expo.out). Bei 0,5 s wächst mein Logo aus dem Punkt, seine Ebenen poppen nacheinander mit back.out auf. Bei 0,92 s setzt es sich größer und dreht sich dabei sanft. Ein dünner pinker Ring aus kreisendem Mono-Text ("APP NAME · IDEAS IN MOTION · APPNAME.APP ·", ersetze ihn durch deinen) erscheint darum und dreht sich langsam. Bei 1,7 s schrumpft das Zeichen mit leichter Unschärfe zurück zu einem kleinen hellen Punkt. 2. 1,9–3,5 s: Beim Drop bei 1,93 s platzen zwei Scheiben aus dem Punkt, zuerst die helle und die pinke 30 ms dahinter (expo.out, 0,3 s), sodass ein dünner heller Ring auf dem pinken Rand reitet. Der Name meiner App in der breiten Grotesk steigt Buchstabe für Buchstabe von der Grundlinie auf: Jeder Buchstabe ist auf seine eigene Box beschnitten, mit 30 ms Versatz und 0,26 s expo.out. Der Name füllt immer dieselbe Breite von 1640 px. Eine dünne dunkle Linie zeichnet sich von der Mitte darüber, mit "01", das links eingetippt wird, und meiner Webadresse rechts. Ab 2,55 s läuft eine Breitenwelle durch die Buchstaben: Jeder staucht sich von 150 % auf etwa 55 % Breite und zurück in 0,6 s, 0,1 s nach dem vorherigen. Das Wort wird in jedem Frame auf 1640 px neu angepasst, sodass schmale Buchstaben höher werden. Bei 2,84 s steigt darunter ein heller Serif-Kursiv-Slogan ("ideas in motion") Wort für Wort auf. Bei 3,3 s kollabieren die Buchstaben zu dunklen Punkten und der Slogan fällt weg. 3. 3,5–5,6 s: Ein diagonaler heller Wipe kommt von unten rechts (0,16 s). Sechs dunkle Punkte schwingen in einer Kurve zum Anfang von sechs Zeilen (power2.inOut, versetzt) und nehmen die Zeilenfarben an. Ein Serif-Kursiv-Titel wird von links eingetippt ("Chat instead of a timeline."), mit einer Mono-Notiz rechts ("NO KEYFRAMES · LIVE PREVIEW") und Spurlabels "IDEA" und "MP4" an den beiden Enden. - Jede Zeile hat eine pinke Nummer, einen Mono-Namen ("animated type", "shapes", "transitions", "3D effects", "sound", "live preview"), ein winziges Kurvensymbol, das sich selbst zeichnet, und eine Spurlinie, die von links nach rechts gezeichnet wird. - Bei 4,215 s rasen sechs Bälle (dunkel, violett, pink, wiederholt) in genau 0,94 s 1040 px weit, jeder mit eigener Easing-Kurve: linear, power2.inOut, expo.out, back.out(1.7), elastic.out(1, 0.3) und bounce.out. - Striche über jeder Spur markieren, wo der Ball bei jedem 1/16 des Laufs war. Drei verblassende Geisterringe folgen jedem Ball, die Bälle strecken sich entlang ihrer Geschwindigkeit, ein Punkt fährt synchron auf jedem Kurvensymbol mit, und jeder Ball bekommt bei der Ankunft einen Outline-Halo. - Bei 5,3 s blenden die Zeilen aus, die Bälle fliegen in die Mitte und verschmelzen, und der violette schwillt an, bis er das Bild füllt. 4. 5,6–7,5 s, violett: Ein heller Kreis federt aus einem Punkt hoch (elastic.out, 0,45 s). Zwölf Satellitenpunkte schießen auf eine Umlaufbahn (expo.out, im Abstand von 12 ms). - Dahinter liegen dünne Fadenkreuz-Hilfslinien, ein gepunkteter Orbitkreis mit Teilstrichen und den Labels "270°" und "90°". - Mono-Anzeigen sitzen an den Seiten: "SHAPES NO KEYFRAMES" links und zitierte Änderungswünsche rechts ("“BIGGER” “SLOWER”", "“ANOTHER COLOUR”"). - Pinke Wellenringe pulsieren um den Kreis. - Die Form morpht dann Kreis → Dreieck → Stern → Quadrat. Jeder Morph dauert 0,26–0,3 s mit back.out(2,2) und einer 120°-Drehung, und pinke Echo-Umrisse folgen der Form nur, solange sie sich dreht. - Die Satelliten morphen einen Schlag später, nacheinander, und verschwinden bei 7,22 s. Sie kommt als aufrechtes 360-px-Quadrat zur Ruhe. 5. 7,5–9,75 s, fast schwarz: Das Quadrat teilt sich in neun 120-px-Kacheln. Ein Truchet-Labyrinth wächst Ring für Ring, bis es das Bild füllt (back.out, etwa 30 ms pro Ring); jede Kachel hat zwei Viertelkreisbögen in gegenüberliegenden Ecken, gezeichnet als helle 20-px-Linien. Pinke Wellen ziehen darüber: erst zwei Bänder von links nach rechts, dann ein Ring, der sich auf die Mitte zusammenzieht. Kacheln innerhalb einer Welle drehen sich um 90 oder 180 Grad, schrumpfen auf 80 % und werden pink, sodass die Linien in Striche zerfallen, und kehren zurück, sobald das Band vorbei ist. Ein kleines Mono-Label wird unten eingetippt ("SHAPES · TRANSITIONS · NO KEYFRAMES"). Ab 9,45 s kollabieren die Kacheln von der Mitte nach außen. 6. 9,5–11,25 s: Ein 24 x 24 Punktraster erscheint, wo die Kacheln waren, von oben gesehen. Es kippt in eine perspektivische Ebene und faltet sich zu einer Kugel, einer Vase, einem gequetschten Klecks und einem Torus, während es sich um seine Vertikalachse dreht. Zwischen den Formen bewegt es sich mit power2.inOut, mit schwachen Linien zwischen Nachbarn, etwa jeder neunte Punkt ist pink, und Punkte werden mit der Tiefe dunkler. Ein Mono-Label sitzt darunter ("3D EFFECTS · LIVE PREVIEW · MP4 EXPORT"). Es zoomt durch die Kamera und blendet bei 11 s aus. 7. 11,25–13,0 s, kinetische Wörter: ein Wort alle 0,23 s, jedes auf eigenem flachem Hintergrund und jedes füllt die Breite in einer anderen Breite derselben Schrift. Ersetze die sechs Wörter durch deinen eigenen Satz. - "IDEA": dunkel auf Pink, gleitet von links herein, Skalierung 1,3 auf 1, Unschärfe klärt sich in 0,14 s. - "IN.": hell auf Fast-Schwarz mit pinkem Punkt, kommt mit Unschärfe von rechts, und eine kleine Mono-Notiz oben links ("EDIT IN WORDS ↗"). - "VIDEO": ultra-schmal violett auf heller Seite, Buchstaben steigen von unten auf, 25 ms versetzt. - "OUT.": hell auf Violett, mit Unschärfe von links, mit einer Notiz oben rechts ("↘ MP4 EXPORT"). - "NO": dunkel auf Gelb. Die Buchstaben fallen in Winkeln mit back.out herein, dann füllen umrandete Kopien des Wortes Zeilen oberhalb und unterhalb und scrollen in wechselnden Richtungen, während die Hauptzeile nach links driftet. - "KEYFRAMES.": hell auf Fast-Schwarz, gleitet mit konstanter Geschwindigkeit nach links mit einer dünnen diagonalen Linie, dann verschwindet es schnell mit Unschärfe. 8. 13,0–15 s, Endkarte: Pink flutet von rechts herein, und ein heller Ring rollt aus der Mitte aus (0,42 s). Mein Logo dreht sich in der Mitte herein (back.out) mit einem kleinen Konfetti-Burst aus Punkten, Ringen und Dreiecken in Dunkel, Hell und Violett, dann wandert es links neben das Lockup. Der Name meiner App fällt Buchstabe für Buchstabe daneben herein, von unscharf zu scharf, je 0,22 s. Darunter steigt ein Serif-Kursiv-Slogan auf ("your AI motion designer"). Eine Linie wird gezeichnet, und darunter wird eine Mono-Zeile eingetippt: "PICK A TEMPLATE · DESCRIBE YOUR IDEA · MP4 EXPORT", ein kleiner Aufnahmepunkt, dann meine Webadresse rechts. Halte die letzte Sekunde. </structure> <composition> Palette, alles flach: - tiefes Fast-Schwarz #0d0b1e - knalliges Pink #fb2d89 (die Hauptakzentfarbe) - helle Seite #faf9ff - weiches Violett #7c6cf2 - warmes Gelb #ffd23f, nur für einen kinetischen Schnitt Schriften: - Eine breite variable Grotesk mit Breitenachse (Anybody, Gewicht 900, Breite 50–150 %) für den Namen und die kinetischen Wörter. - Eine schmale redaktionelle Serif-Kursive (Instrument Serif Italic) für Titel und Slogans. - Eine Mono (JetBrains Mono) für die Interface-Labels, 14 px, Zeichenabstand 0,16em. Ein Kamerasucher-HUD liegt über dem ganzen Video: - Dünne 2-px-Eckklammern, 44 px von jeder Ecke eingerückt. - Oben links: der Name meiner App in fetten Mono-Versalien mit einem blasseren Slogan dahinter ("APP NAME IDEAS IN MOTION"). - Oben rechts: das aktuelle Abschnittslabel ("01 — APP NAME", "02 — NO KEYFRAMES", "03 — SHAPES", "04 — EDIT IN WORDS", "05 — 3D EFFECTS", "06 — KINETIC TYPE", "07 — TRY IT FREE"). - Unten links: ein laufender Timecode mit Frames ("00:00:03:09") und ein kurzer Slogan ("LIVE PREVIEW"). - Unten rechts: ein weiterer Slogan ("NO KEYFRAMES"), vier kleine Quadrate, die pro Beat eins aufleuchten, und "MP4". - Entlang des unteren Rands: eine 2-px-Fortschrittslinie, die mit der Zeit wächst. Das HUD wechselt bei jedem Schnitt zwischen dunkler und heller Tinte, damit es auf jedem Hintergrund lesbar ist. Alle Wörter auf dem Bildschirm sind Beispiele, die du durch deine eigenen ersetzen sollst. </composition> <techniques> - Jeder Abschnitt endet mit einem Objekt, aus dem der nächste wächst: Punkt zu Logo, Logo zurück zu Punkt, Scheiben zu Name, Buchstaben zu Punkten, Punkte zu Bällen, Ball zu violetter Flut, Quadrat zu Kacheln, Kacheln zu Punktraster, Punktwolke, die durch die Kamera in die kinetischen Wörter zoomt. - Jedes neue HUD-Abschnittslabel tippt sich über 0,3 s ein, mit zufälligen Zeichen, die dem Cursor vorauslaufen. Die anderen Mono-Zeilen werden ebenfalls eingetippt. - Variable-Breite-Schrift: Animiere die Breitenachse jedes Buchstabens und passe das ganze Wort in jedem Frame an eine feste Breite an. - Buchstaben-Reveals werden auf die eigene Box jedes Buchstabens beschnitten. - Verwende leichte Bewegungsunschärfe nur bei schnellen Bewegungen und einen schwachen violetten Farbsaum beim großen Irisblenden-Wipe. - Echo-Umrisse, Geisterringe und Halos sind dünne pinke oder passend gefärbte Striche, die schnell verblassen. </techniques> <music> Energetischer elektronischer Synth-Pop mit 128 BPM, Schlag eins bei 0,06 s, genau 15 s lang: - Weiche glockenartige Pad-Akkorde im ersten Takt. - Nach dem Drop bei 1,93 s eine Four-on-the-Floor-Kick mit Claps auf 2 und 4, Off-Beat-Hi-Hats, ein druckvoller Synthbass und kurze Akkord-Stabs unter den Abschnitten. - Ein Break ab etwa 10 s, der sich in den kinetischen Abschnitt steigert. - Ein klingender finaler Pad-Akkord auf der Endkarte. Abschnitte wechseln an Taktgrenzen, der Name landet auf dem Drop bei 1,93 s, und die Schnitte der kinetischen Wörter liegen auf Achteln. </music> <sound> Keine Stimme. Hits über der Musik: - ein Riser durch den ersten Takt - ein Boom auf dem Drop bei 1,93 s - ein Riser ab etwa 10 s in einen Punch-Hit bei 11,25 s - eine Kick und ein kurzes Whoosh bei jedem kinetischen Wortschnitt - ein Beckenschlag bei 12,71 s - ein Boom mit dem klingenden Pad-Akkord, wenn die Endkarte landet - ein kleiner Blip bei 14,1 s Die Musik trägt den Track, und die Hits liegen klar darüber. </sound> <references> Ein Showreel eines Motion Designers, gekreuzt mit einem Tech-Produktlaunch-Sizzle. Es kombiniert ein Kamerasucher-Overlay, kräftige kinetische Typografie im Schweizer Stil, Easing-Kurven-Demonstrationen, generative Truchet-Kachelmuster und eine rotierende 3D-Punktwolke. </references>

Newsletter

Wir schicken dir die besten neuen Community-Prompts mit ihren Videos. Kein Spam, und in jeder Mail steht ein Abmeldelink.

Wir nutzen deine Adresse nur für diesen Newsletter. Datenschutzerklärung

Notwendige Cookies speichern deine Website-Einstellungen. Mit deiner Erlaubnis hilft uns Google Analytics zu verstehen, wie Motion Fab genutzt wird. Du kannst deine Wahl in der Fußzeile ändern.

Deine Datenschutz-Optionen nach den geltenden Datenschutzgesetzen der US-Bundesstaaten. Datenschutzerklärung