Kurs starten
German Version
Webflow GSAP Interactions Masterclass
Meistere Website-Animationen und Motion Design mit der neuen GSAP Timeline in Webflow.
Der einzige Webflow GSAP Kurs auf Deutsch
Mit Webflow Experte
Jonas Arleth
Die Zukunft von Webflow Animationen
Neu 2025
Diese Masterclass ist ein spezialisierter Deep-Dive-Kurs, der dich Schritt für Schritt in das neue Animationssystem einführt. Kompakt, fokussiert und sofort umsetzbar.
Kein langes Bla-Bla, sondern pure Praxis.
Wir animieren gemeinsam ein modernes Studio-Layout mit lebendigem Motion Design, das nicht nur technisch, sondern visuell überzeugt.
Du siehst, wie Design und Bewegung eins werden, direkt visuell im Webflow Interface – Ohne Coding-Skills.
4
Kapitel
23
Lektionen
3+
Stunden an Videos
Das lernst du in diesem Kurs
- Komplexe Motion-Sequenzen mit der neuen GSAP Timeline
- Worauf es bei Easing, Timing & Flow wirklich ankommt
- Scroll-, Hover- & Click-Animationen mit Stagger-Effekten
- Globale Motion-Systeme über Attribute & Scopes
- Page Loads & Transitions mit professionellem Motion Design
- Ergebnisse, die aussehen wie aus einem Award-Winning Studio
Nach dem Kurs wirst du …
- Animationen mit System statt Zufall gestalten.
- Strukturiert mit der neuen GSAP Timeline in Webflow arbeiten.
- Mit GSAP deutlich schneller und effizienter arbeiten als mit den alten Webflow Interactions.
- Bewegung gezielt einsetzen, um Design und User Experience zu verstärken.
- Interaktionen entwickeln, die Performance und Ästhetik vereinen.
- Animationen erschaffen, die sich flüssig, modern und hochwertig anfühlen.
Liste der Kursinhalte und Videos
Grundlagen
- Warum Webflow jetzt GSAP integriert und was das für dich bedeutet
- Was professionelle Website-Animationen ausmachen
- Konflikte vermeiden: Classic & neue GSAP Interactions zusammen nutzen oder trennen?
Core-Animations
- Wie GSAP in Webflow funktioniert – das schnelle Orientierungs-Video
- Alles zu Stagger-Animationen für Headlines und Texte
- Globale Animationen mit Attributen umsetzen
- Abgeschnittene Buchstaben bei Mask-Split-Text beheben
- Alles Wichtige zu Hover-Interaktionen
- Klick-Interaktionen am Beispiel eines Accordions (Öffnen & Schließen)
- Content während des Scrollens animieren
- Looping Animationen und Timing beherrschen
- Native Webflow-Navigation mit GSAP animieren (Öffnen und Schließen)
Pro-Techniques
- Fortgeschrittener Button-Hover-Effekt
- Meisterhafte Page-Load-Animationen mit der neuen GSAP Timeline
- Scope Descendants mit CSS Superpower
- Layered Multi-Stage Hero Reveal Scroll Animation
- Page Transitions animieren (2 Varianten)
- Unterschätztes addClass Feature: Elemente per Klasse in jeden Zustand schalten
- Custom JS Events – Animationen im Code triggern mit Preloader Beispiel
- Native Slider und Tab-Komponenten animieren (YouTube Video)
- Fortgeschrittene maskierte Hero-Scroll-Animation
Optimierungen
- Flackern beim Seitenladen verhindern
- Responsive Design und Barrierefreiheit von GSAP Animationen
Nutze die im Kurs erstellte Webflow-Vorlage frei für deine Kundenprojekte.
Optional Figma Design-Datei im Checkout als Download wählen
Über die Kommentarfunktion im Kurs kann ich dir bei Fragen direkt weiterhelfen
Tools, mit denen wir im Kurs arbeiten
Webflow
GSAP Animations
Figma

GSAP in Webflow endlich verstanden
Jonas’ Kurs kam genau zum richtigen Zeitpunkt, denn ich wollte endlich meine eigene Website neu gestalten – mit coolen Interaktionen. Mit Jonas erklärt endlich mal jemand ausführlich und nachvollziehbar, wie das neue GSAP in Webflow funktioniert. Zuvor habe ich online meist nur kurze, unvollständige Videos gefunden, die mir nicht wirklich weitergeholfen haben. Dank des Kurses habe ich jetzt einen hervorragenden Überblick über die Funktionsweise und kann es kaum erwarten, mich an die erste echte Umsetzung zu wagen. Danke, Jonas, für deine Geduld, deinen Sinn für Gestaltung und deinen Fokus auf Details!
Frank
Gafikdesigner, Webflow Developer

Von After Effects zu GSAP mit Webflow
Ich habe gerade die GSAP Masterclass abgeschlossen und bin äußerst zufrieden mit der Qualität dieses Kurses. Die detaillierten Erklärungen zu den GSAP-Tools und dazu, wie man sie in der neuen horizontalen Timeline anwendet, waren für mich extrem hilfreich. Als jemand, der ursprünglich aus dem Motion Design mit Adobe After Effects kommt, hatte ich bisher Schwierigkeiten, komplexe Animationen mit den nativen Webflow-Funktionen umzusetzen. Die Workflows empfand ich oft als wenig intuitiv und schwer überschaubar. Durch Jonas’ hervorragend aufbereiteten GSAP-Kurs hat sich das grundlegend geändert. Bereits nach den ersten vier bis fünf Lektionen war ich in der Lage, deutlich schneller anspruchsvollere und qualitativ hochwertigere Animationen zu erstellen. Jonas vermittelt die Inhalte anhand realer Use Cases und taucht dabei tief in die Funktionsweise der einzelnen Tools ein. Die Videos enthalten eine Vielzahl konkreter Tipps und bewährter Workflows, die ich bereits jetzt in meine bestehenden Projekte integriere.
Ralf
Webdesigner
Dein Upgrade für Webflow.
Mit der neuen GSAP Timeline steuerst du Animationen wie ein Motion Designer – direkt im Interface und ohne coding.

Webflow GSAP Interactions Masterclass
- 25 praxisnahe Video-Lektionen (3 Stunden komprimiertes Wissen)
- Lebenslanger Zugang inklusive Updates
- Webflow-Projektvorlage mit allen Animationen für deine Kundenprojekte
- Fragen & Probleme direkt per Chat klären
- Optional: Figma-Vorlage im Checkout hinzufügen
- Abschlusszertifikat
199
€
299
€
Oder 3 Raten von nur 72€
Bundles
Spare 30 % auf jeden weiteren Kurs

Webflow Komplettkurs
- 16+ Stunden an Videomaterial
- Lebenslanger Zugang und Updates
- Website Launch Checkliste
- Webflow Projektvorlage mit allem was wir bauen
- Abschlusszertifikat
350
€
499
€
Oder 3 Raten von nur 129€

Webflow Profi-Kurs
- 10+ Stunden an Videomaterial
- Lebenslanger Zugang und Updates
- Figma Designvorlage
- Webflow Projektvorlage mit allem was wir bauen
- Abschlusszertifikat
315
€
449
€
Oder 3 Raten von nur 116€

Webdesign Angebote mit 3 Preisoptionen erstellen
- 10-seitige Vorlage, die du in Pages oder Word bearbeiten kannst
- 3 echte Angebote von mir:
Ein 50.000€ Auftrag, 16.000€ Auftrag und 6.000€ Auftrag - 25 erklärende Videos
- Inklusive Bedingungen und rechtlicher Absicherung (von einer Anwältin geprüft)
- Bonusmaterial
252
€
359
€
Oder 3 Raten von nur 93€
Haupt-produkt

Webflow GSAP Interactions Masterclass
Deutsch
199
€
299
€

Webflow GSAP Interactions Masterclass
-30% Bundle-Rabatt
Deutsch
140
€
199
€

Webflow Profi-Kurs
-30% Bundle-Rabatt
Deutsch
315
€
449
€

Webflow Trick-Kiste
-30% Bundle-Rabatt
Deutsch
49
€
49
€

Webdesign Angebote mit 3 Preisoptionen erstellen
-30% Bundle-Rabatt
Deutsch
252
€
359
€

Webflow Komplettkurs
-30% Bundle-Rabatt
Deutsch
350
€
499
€
Gesamt
399
€
000
€
Ratenzahlung möglich.
Steuern werden beim Checkout berechnet.
Steuern werden beim Checkout berechnet.
Checkout
🔒 Sicher bezahlen mit Kreditkarte, PayPal & mehr
💡 14 Tage Geld-zurück-Garantie
💡 14 Tage Geld-zurück-Garantie
Alle Preise inklusive 19% Umsatzsteuer. Du erhältst eine Rechnung, die du als Werbungskosten in deiner Steuererklärung absetzen kannst (Fortbildungskosten).







+00
Mehr als 00 Personen nutzen Kurse von Formburg für ihre Weiterbildung. Rückmeldungen lesen.
Schüler oder Student?
Erhalte 25% Rabatt.
Bitte sende dazu einfach eine Mail mit der Info, wie dein Studiengang bzw. deine Ausbildung heißt und auf welche Schule du gehst an:
FAQ
Häufige Fragen zum Onlinekurs
Sind alle zukünftigen neuen Inhalte kostenlos inklusive?
Mit dem Kauf des Kurses erhältst du lebenslangen Zugang – inklusive aller bisherigen Inhalte sowie sämtlicher zukünftiger Updates und neuer Module. Einmal zahlen, alles inklusive: Es entstehen keine zusätzlichen Kosten für dich.
Gibt es einen Weg mit Jonas zu sprechen, wenn ich irgendwo nicht weiter komme?
Während des Online Kurses kannst du zu jederzeit die Kommentarfunktion nutzen, die unter jeder Lektion integriert ist. Darauf werde ich einmal pro Woche antworten. Taucht darüber hinaus ein Problem auf oder du kommst irgendwo gar nicht mehr weiter, kannst du mich auch direkt über den Chat kontaktieren.
Gibt es ein Abschlusszertifikat?
Du kannst ein Abschluss-Zertifikat mit deinem Namen als PDF von mir bekommen, sobald du 80% des Kurses abgeschlossen hast.
Für das Zertifikat musst du mich kontaktieren mit dem Namen, der auf das Zertifikat soll und deiner Bestellnummer. Dann werde ich deinen Fortschritt überprüfen.
Wie lange habe ich Zugang zu diesem Kurs?
Lebenslang! Du erhältst sogar kostenlos alle Updates und Lern-Module, die ich zukünftig hinzufügen werde.
Bekomme ich mein Geld zurück, wenn mir der Kurs nicht gefällt?
Ja, es gibt eine 14 Tage Geld-Zurück-Garantie.
















