- Was passiert
- Wörter leuchten nacheinander entlang einer Satzzeile auf und veranschaulichen die Mechanik traditioneller rekurrenter Modelle.
- Warum es Aufmerksamkeit weckt
- Die Visualisierung sequenzieller Statusaktualisierungen verdeutlicht, warum ältere Architekturen mit dem langfristigen Kontextgedächtnis zu kämpfen hatten.
- Zum Ausprobieren
- Nutzen Sie die schrittweise Beleuchtung von Elementen, um klassische sequenzielle Methoden modernen parallelen Paradigmen gegenüberzustellen.
Zurück zu den BeispielenProduktvideo erstellen
Ein code-gerenderter Film über die Geschichte der KI
Wird geladen…
Produktions-Skill
Skill veröffentlicht
Übersetzung
Sie sind Motion Designer und Creative Director und erstellen einen 3-minütigen animierten Kurzfilm,
der vollständig im Code aufgebaut und als MP4 gerendert wird.
Der Film
Titel: "Attention Is All You Need → AGI"
Die Geschichte, wie ein einziges Paper aus dem Jahr 2017 Schritt für Schritt zu großen Sprachmodellen, logischem Denken,
Werkzeuge nutzenden KI-Agenten und zur offenen Frage nach AGI führte. Es soll sich wie ein filmischer Essay anfühlen,
nicht wie eine Diashow oder eine Zeitleisten-Infografik. Denken Sie an Kurzgesagt trifft auf eine Pixar-Eröffnungssequenz:
emotional, klug, präzise.
Technisches Setup
Verwenden Sie Remotion (React). Richten Sie ein frisches Projekt ein, 1920x1080, 30 fps, exakt 180 s (5400 Frames).
Eine Komposition pro Szene, sequenziert in einer Master-Komposition.
Keine externen Bild-Assets oder Stock-Footage: Alles wird mit SVG, Canvas, CSS und
code-generierten Partikeln und Formen gezeichnet. Google Fonts sind zulässig.
Erstellen Sie vor dem Bauen eine STORYBOARD.md mit dem Timing, den visuellen Elementen, den Bildschirmtexten
und Übergängen jeder Szene. Bauen Sie dann Szene für Szene.
Rendern Sie nach jeder Szene 3–4 Standbilder (npx remotion still) und betrachten Sie diese kritisch.
Korrigieren Sie Layout, Überlappungen, Lesbarkeit und Pacing, bevor Sie fortfahren.
Schließen Sie das Projekt mit npx remotion render nach out/film.mp4. ab. Lassen Sie einen optionalen <Audio>-Slot für eine
Musikspur frei, die später hinzugefügt werden kann (public/music.mp3); rendern Sie stumm, falls diese fehlt.
Narrativer roter Faden / Wiederkehrendes Motiv
Der Protagonist ist ein einzelnes leuchtendes Token, das Wort "the", das durch jede Ära reist.
Im Jahr 2017 ist es ein einsamer Punkt, der durch Aufmerksamkeitslinien plötzlich jedes andere Wort "sieht".
Im Laufe der Zeit erhält es eine Stimme, Sinne (Multimodalität), Denkvermögen, Hände (Werkzeuge) und schließlich
eine Frage.
Szenen (ungefähres Timing, Anpassung möglich)
0:00–0:15 — Kaltstart. Dunkelheit. Wörter verstreut wie Sterne, unverbunden. Sequenzielle
RNN-Verarbeitung: Wörter leuchten nacheinander auf und vergessen frühere Wörter langsam wieder.
0:15–0:35 — Juni 2017, "Attention Is All You Need" (Vaswani et al., Google). Jedes Wort
verbindet sich gleichzeitig mit jedem anderen Wort. Aufmerksamkeitslinien entfalten sich zu einem Netz. Der Titel des
Papers erscheint wie im Schriftsatz.
0:35–0:55 — 2018–2020: Der Aufstieg großer Sprachmodelle: GPT-1, BERT, GPT-2, GPT-3.
Skalierungsgesetze: Das Netz wächst exponentiell und die Kamera zieht sich zurück. Das Modell beginnt,
Sätze flüssig und verblüffend treffsicher zu vervollständigen.
0:55–1:20 — 2022: Instruction Tuning und RLHF, dann ChatGPT (30. Nov. 2022). Das Token erhält
eine Sprechblase. Ein Zähler der Nutzer explodiert. Die Welt beginnt zu antworten.
1:20–1:40 — 2023: Multimodalität. Bilder, Audio und Code strömen von allen Seiten in dasselbe Netz ein,
und das Token erhält "Sinne". Jede Modalität wird zu Tokens, die denselben
Aufmerksamkeitsmechanismus durchlaufen.
1:40–2:05 — 2024–2025: Denk- und Reasoning-Modelle. Eine sichtbare Gedankenkette entfaltet sich als Pfade aus
Verzweigungen, Bereinigungen und Backtracking. Das Modell "denkt nach, bevor es spricht", während sich die Zeit verlangsamt.
2:05–2:30 — Tool-Nutzung und Agenten. Dem Token wachsen Hände: Es ruft eine Suche auf, führt Code aus,
öffnet Dateien und orchestriert Sub-Agenten. Viele parallele Threads arbeiten gleichzeitig, und der
Bildschirm verwandelt sich in eine geschäftige, faszinierende Werkstatt.
2:30–2:50 — Auf dem Weg zu AGI. Alle Motive laufen zusammen. Das Netz aus dem Jahr 2017 taucht wieder auf, hat nun
aber planetare Ausmaße. Lassen Sie es offen: Weder Utopie noch Untergang. Auf dem Bildschirm: "Attention was all we
needed. What comes next is up to us." (Verbessern Sie diesen Satz, falls Ihnen eine bessere Formulierung einfällt.)
2:50–3:00 — Rückkehr zu einem einzelnen leuchtenden Token in der Dunkelheit. Titelkarte und Ende.
Handwerksregeln
Präzision zählt: Verwenden Sie korrekte Jahreszahlen, Namen und Titel von Papern. Wenn Sie sich bei einem
spezifischen Fakt unsicher sind, lassen Sie ihn lieber weg, anstatt zu raten, und führen Sie unsichere Aussagen in NOTES.md auf.
Typografie: Maximal ca. 8 Wörter gleichzeitig auf dem Bildschirm, und jeder Text muss lange genug sichtbar sein,
um gelesen werden zu können (≥ 2,5 s). Verwenden Sie eine Display-Schriftart und eine Monospace-Schriftart für "Modellausgaben".
Bewegung: Verwenden Sie Feder- (Spring) und Easing-Kurven, niemals lineare Bewegungen. Nutzen Sie Szenenübergänge, die organisch aus dem
Inhalt hervorgehen (das Netz morpht, die Kamera zoomt durch einen Knoten), keine generischen Überblendungen.
Farbe: Ein tiefer, dunkler Hintergrund mit einer warmen Akzentfarbe, die sich über die Epochen hinweg weiterentwickelt.
Details und Easter Eggs belohnen Aufmerksamkeit (z. B. echte Ausschnitte aus Veröffentlichungen, winzige UI-Details,
plausible Modellausgaben), vergleichbar mit anspruchsvollem Motion Design.
Pacing: Wechseln Sie zwischen dichten und ruhigen Momenten ab und geben Sie der Reasoning-Szene sowie dem AGI-Moment
Raum zum Atmen.
Arbeiten Sie autonom durch die gesamte Pipeline. Übergeben Sie nach Abschluss den Pfad zur MP4, eine
kurze Zusammenfassung der kreativen Entscheidungen und die NOTES.md.Szenenanalyse
8- Was passiert
- Goldene Verbindungslinien verknüpfen augenblicklich jedes Wort im Satz gleichzeitig um ein zentrales Token herum.
- Warum es Aufmerksamkeit weckt
- Die radiale Vernetzung vermittelt anschaulich den 2017 eingeführten parallelen, bidirektionalen Aufmerksamkeitsmechanismus.
- Zum Ausprobieren
- Setzen Sie omnidirektionale Netzwerkgraphen ein, um den Durchbruch paralleler Verarbeitung gegenüber linearen Ketten zu erklären.
- Was passiert
- Der visuelle Graph dehnt sich von einem schlichten Ring zu einer dichten Sphäre aus Milliarden leuchtender Parameter aus.
- Warum es Aufmerksamkeit weckt
- Die Darstellung des Parameterwachstums als kosmisches Netz verdeutlicht visuell exponentielle Skalierungsgesetze und die Modellkapazität.
- Zum Ausprobieren
- Stellen Sie exponentielles Daten- oder Parameterwachstum mithilfe expandierender Partikelcluster dar, um relative Größenordnungen zu vermitteln.
- Was passiert
- Mehrere generierte Antworten erscheinen auf dem Bildschirm und werden basierend auf simulierten Nutzerbewertungen neu geordnet.
- Warum es Aufmerksamkeit weckt
- Die Darstellung von Bewertungskarten entmystifiziert Reinforcement Learning from Human Feedback (RLHF) für ein breites Publikum.
- Zum Ausprobieren
- Zeigen Sie vergleichende Ranking-Oberflächen, um Präferenzabstimmung und Alignment-Phasen intuitiv zu erklären.
- Was passiert
- Bilder, Audiowellenformen und Code-Snippets verwandeln sich in Token-Knoten, die direkt in den Attention-Kern einfließen.
- Warum es Aufmerksamkeit weckt
- Die Vereinheitlichung verschiedener Medientypen in identische Token-Strukturen unterstreicht die multimodale Flexibilität von Transformern.
- Zum Ausprobieren
- Verwenden Sie einheitliche grafische Token über verschiedene Medienformate hinweg, um crossmodale Modellarchitekturen zu veranschaulichen.
- Was passiert
- Ein Denk-Timer läuft hoch, während interne Hypothesen Schritt für Schritt getestet und verfeinert werden.
- Warum es Aufmerksamkeit weckt
- Das Zeigen iterativer Scratchpad-Überlegungen demonstriert wirkungsvoll Rechenzeit zur Testzeit und Selbstkorrektur.
- Zum Ausprobieren
- Blenden Sie verzweigte Schritt-für-Schritt-Abläufe ein, um Testzeit-Schlussfolgerungen und Verifikationsschleifen zu visualisieren.
- Was passiert
- Ein zentraler Orchestrator weist Aufgaben über Suche, Terminal, Codedateien und spezialisierte Sub-Agenten-Knoten hinweg zu.
- Warum es Aufmerksamkeit weckt
- Das Aufzeigen von Tool-Ausführungen und Sub-Agenten-Verzweigungen verdeutlicht, wie moderne Modelle außerhalb von Chats autonom agieren.
- Zum Ausprobieren
- Strukturieren Sie Tool-Nutzung und Sub-Agenten-Workflows als modulare Terminal-Fenster, die mit einem zentralen Hub verknüpft sind.
- Was passiert
- Ein digitales Netz mit aktiven Agentenknoten umspannt die Erde und mündet in eine offene Fragestellung bezüglich AGI.
- Warum es Aufmerksamkeit weckt
- Das Herauszoomen auf eine planetare Ansicht bildet einen dramatischen thematischen Höhepunkt, der die Entwicklung der KI zusammenfasst.
- Zum Ausprobieren
- Schließen Sie technische Entwicklungsberichte mit einer Makroperspektive ab, die Fortschritte mit gesellschaftlichen Fragen verknüpft.
