Webflow

Profi-Kurs

Fortgeschrittene Webdesign Techniken für Webflow Poweruser.

Pre-Launch Preis sichern
Presented by
Expert
Kit.
Learn to build any Website

werde zum Experten für außergewöhnliche Websites

Neu 2025
Online Course
70+ Videos

Du kennst dich schon gut mit Webflow aus und möchtest jetzt richtig durchstarten? Dieser Kurs hilft dir, deine Skills auf das nächste Level zu bringen! Mit fortgeschrittenen Techniken zeige ich dir, wie du außergewöhnliche Websites umsetzt.

5
Kapitel
50+
Lektionen
6+
Stunden an Videos
🇩🇪 Alle Kursinhalte auf Deutsch 🇩🇪
Available in english as well →

Was wir im Kurs bauen

  • CMS Produkt-Konfigurator mit Bezahlfunktion
  • Interaktive 2D und 3D Produkt-Demonstration
  • Umsetzung von extrem individuellen Layouts
  • kleines Shop-System (kostenlos, kein Webflow E-Commerce!) mit Warenkorb und Stripe-Checkout-Funktion
  • Fortgeschrittene Finsweet Attributes Integrationen
  • Profitechniken für Animationen

Bonus

Inklusive Figma Design-Datei zum Download
Nutze die im Kurs erstellte Webflow-Vorlage frei für deine Kundenprojekte.

Inhalte

Dieser Kurs ist bis oben hin vollgepackt mit den besten Informationen zur Erstellung großartiger visueller Webseiten.

Einleitung

00Videos

Fortgeschrittene Layouts und Animationen

00Videos

2D und 3D Produkt-Demo

00Videos

CMS Konfigurator

00Videos

Einfacher Stripe Checkout (No-Code)

00Videos

Shop-System mit Warenkorbfunktion und Stripe Checkout

00Videos

Bonusmaterial

00Videos
11
Responsive Design Übersichtsseite
Shop-System mit Warenkorbfunktion und Stripe Checkout
2
Download Figma File
Bonusmaterial
1
Workshop Webflow Projekt
Bonusmaterial
12
Responsive Design Detailseite
Shop-System mit Warenkorbfunktion und Stripe Checkout
10
Serverseitigen Code ausführen und anlegen
Shop-System mit Warenkorbfunktion und Stripe Checkout
9
Warenkorb Funktion implementieren
Shop-System mit Warenkorbfunktion und Stripe Checkout
8
Warenkorb Umsetzen
Shop-System mit Warenkorbfunktion und Stripe Checkout
5
Finsweet Attributes CMS Filter
Shop-System mit Warenkorbfunktion und Stripe Checkout
3
Aufbau Produkt Übersichtsseite
Shop-System mit Warenkorbfunktion und Stripe Checkout
6
Preise über Stripe API einholen
Shop-System mit Warenkorbfunktion und Stripe Checkout
7
Rabatt-Preise über das Webflow CMS pflegen
Shop-System mit Warenkorbfunktion und Stripe Checkout
4
Shop Produkt Komponenten erstellen
Shop-System mit Warenkorbfunktion und Stripe Checkout
7
Responsive Design
2D und 3D Produkt-Demo
9
Zoom bei Klick auf bestimmte Stelle an Produktbild (variabel über Attributes definierbar)
2D und 3D Produkt-Demo
2
Einführung in Coding mit AI
Shop-System mit Warenkorbfunktion und Stripe Checkout
10
Responsive Design
2D und 3D Produkt-Demo
8
Grundaufbau 2D Produkt-Demo Sektion
2D und 3D Produkt-Demo
1
Beschränkungen dieser Lösung
Shop-System mit Warenkorbfunktion und Stripe Checkout
6
(Spline Szene erst laden, wenn auf Button geklickt wird)
2D und 3D Produkt-Demo
5
3D Objekt Fullscreen öffnen bei Button Klick
2D und 3D Produkt-Demo
2
Spline Objekt aufbereiten und integrieren
2D und 3D Produkt-Demo
3
Popover Elemente mit Erklärung am Produkt
2D und 3D Produkt-Demo
4
Produkt Details rein zoomen bei Button Klick
2D und 3D Produkt-Demo
1
Grundaufbau 3D Produkt-Demo Sektion
2D und 3D Produkt-Demo
6
Stripe und DSGVO
Einfacher Stripe Checkout (No-Code)
5
Checkout Links in Webflow verarbeiten
Einfacher Stripe Checkout (No-Code)
4
Zahlungsseite erstellen
Einfacher Stripe Checkout (No-Code)
3
Produkte in Stripe Anlegen
Einfacher Stripe Checkout (No-Code)
2
Stripe Account Anlegen + allgemeine Infos
Einfacher Stripe Checkout (No-Code)
1
Vorteile und Nachteile von Stripe gegenüber Shopify oder Webflow E-Commerce
Einfacher Stripe Checkout (No-Code)
10
Konfigurator Responsive Design
CMS Konfigurator
06:20
9
Popover Funktionalität am Produkt mit Erklärung
CMS Konfigurator
07:50
8
Info-Punkt auf dem Produkt über das CMS positionieren
CMS Konfigurator
03:30
7
Eigene CSS Animation für CMS Attributes Filter System
CMS Konfigurator
06:50
6
Lichtstrahl-Farbwechsel mit dem CMS steuern
CMS Konfigurator
02:51
5
CMS Lightbox Galerie mit Slug Gruppennamen (Webflow Limitierung umgehen)
CMS Konfigurator
02:50
4
Umsetzung Design Radio Button
CMS Konfigurator
11:30
3
Filterfunktion einbinden
CMS Konfigurator
11:50
2
Umsetzung Konfigurator Design
CMS Konfigurator
11:10
1
Aufbau der CMS Kollektionen
CMS Konfigurator
06:10
26
Light / Dark Mode Toggle mit Webflow Variablen Farb-Management
Fortgeschrittene Layouts und Animationen
12:07
25
Hero Section Scroll-Effekt
Fortgeschrittene Layouts und Animationen
09:40
24
CMS Grid mit Dialog / Modal / Popup Funktionalität
Fortgeschrittene Layouts und Animationen
14:30
23
Zahlen rein animieren on scroll
Fortgeschrittene Layouts und Animationen
03:40
20
Autoplay Tabs Button Animation
Fortgeschrittene Layouts und Animationen
04:43
22
Responsive Design Tabs
Fortgeschrittene Layouts und Animationen
07:10
21
Autoplay Tabs Layout 2 wie auf der Webflow Homepage mit Video Content
Fortgeschrittene Layouts und Animationen
16:02
14
Box Animation
Fortgeschrittene Layouts und Animationen
07:40
17
Einfacher Section-Overscroll-Effekt
Fortgeschrittene Layouts und Animationen
06:00
19
Autoplay Tabs Funktionalität einstellen
Fortgeschrittene Layouts und Animationen
07:10
18
Tab Übergang animieren mit CSS
Fortgeschrittene Layouts und Animationen
04:30
16
Fullscreen-Tabs-Sektion Grundaufbau
Fortgeschrittene Layouts und Animationen
08:20
15
Page Load Animation Bühne
Fortgeschrittene Layouts und Animationen
5:40
13
Responsive Design Bühne
Fortgeschrittene Layouts und Animationen
10:50
12
Trick Positionierung Hintergrund Bühne und Umsetzung der Tabelle
Fortgeschrittene Layouts und Animationen
07:10
11
Modal / Popup Komponente mit CSS Animation erstellen
Fortgeschrittene Layouts und Animationen
17:30
10
Inhalte Bühne mit Video Teaser Popup
Fortgeschrittene Layouts und Animationen
05:10
9
3D Box in Webflow bauen
Fortgeschrittene Layouts und Animationen
16:00
8
Badge Animation on scroll
Fortgeschrittene Layouts und Animationen
05:30
7
Gradient Grafik Bühne
Fortgeschrittene Layouts und Animationen
10:00
2
Hauptnavigation responsive optimieren und wichtige zusätzliche Einstellungen
Fortgeschrittene Layouts und Animationen
09:00
6
Komponenten in Haupt-Navigation einbauen und mit custom CSS anpassen
Fortgeschrittene Layouts und Animationen
07:00
5
Button Toggle mit Icon als Komponente anlegen
Fortgeschrittene Layouts und Animationen
22:10
2
Styleguide Vorarbeit, CSS Variables und Grundeinstellungen durchgehen
Einleitung
04:30
3
Hauptnavigation Animation
Fortgeschrittene Layouts und Animationen
17:30
4
Design und CSS Animation von Link-Button mit Komponent Varianten
Fortgeschrittene Layouts und Animationen
22:20
1
Hauptnavigation bauen
Fortgeschrittene Layouts und Animationen
31:40
1
Willkommen und ein wichtiger Hinweis
Einleitung
Über die Kommentarfunktion im Kurs kann ich dir bei Fragen direkt weiterhelfen

Einblicke

Umsetzung von Fortgeschrittenen Layouts und Animationen
CMS Konfigurator mit Bezahlfunktion
Shop und Warenkorb Funktion mit Stripe Checkout

Statt auf Webflow E-Commerce setzen wir auf eine individuelle Lösung mit Stripe-Anbindung. Deine Kunden zahlen lediglich die Stripe-Transaktionsgebühren. Die Produktverwaltung erfolgt über Stripe, während die Integration der Produktinfos über die API realisiert wird.

2D und 3D Produkt Demonstration

Die ersten Einblicke in Layouts gibts auch in dieser Playlist

Inklusive Bonusmaterial

Webflow Vorlage mit allem, was wir im Kurs bauen zur Verwendung bei deinen Kundenaufträgen

Figma Layouts als Download

531

Über 531 aus den unterschiedlichsten Branchen sind schon dabei!

Alle Bewertungen lesen
Dennis H.
Ben M.
Mika H.
Alexandra
Immanuel J.
Aleks
Miriam K.
+00

Ich kann den Kurs gar nicht hoch genug wertschätzen. Webflow mit Jonas´ Kurs zu lernen hat meinen beruflichen Schwerpunkt komplett verändert und Geschäftsfelder eröffnet, die bisher nicht erreichbar waren.

Sven
Diplom Designer, Webdesigner

Jonas lässt mit seinem Webflow-Kurs wirklich keine Fragen mehr offen. Obwohl ich bereits mit Webflow gearbeitet habe, konnte ich viel Neues für mich mitnehmen.

Alexander S.
Co-Founder VisualMakers

Ich mag die Videos und die Herangehensweise von Jonas sehr. Ich würde den Kurs jedem empfehlen, der Webflow wirklich verstehen und lernen will.

Sabine R.
Expertin für Marketing-Automatisierung

Webflow macht es mir möglich, meine Webprojekte als Designerin von vorne bis hinten allein umzusetzen und das genau so, wie ich mir das vorgestellt habe.

Miriam K.
Miriam K.
Kommunikationsdesignerin
Dein Investment

Hol dir dein Webflow-Boost

Die ersten Videos sind schon online.

00
Tage
00
Stunden
00
Minuten
00
Sekunden
Webflow Profi-Kurs
Webflow Profi-Kurs
Super-Deal
  • 10+ Stunden an Videomaterial
  • Lebenslanger Zugang und Updates
  • Figma Designvorlage
  • Webflow Projektvorlage mit allem was wir bauen
  • Abschlusszertifikat
499
599
Spare 17€ mit der Einmalzahlung.
Du sparst00
Webflow Komplettkurs
Webflow Profi-Kurs
Bundle – Webflow Komplettkurs + Webflow Profi-Kurs
Super-Deal
891
1.048
Spare 15% bei diesem Bundle!
Du sparst00
Alle Preise inklusive 19% Umsatzsteuer. Du erhältst eine Rechnung, die du als Werbungskosten in deiner Steuererklärung absetzen kannst (Fortbildungskosten).
Dennis H.
Ben M.
Mika H.
Alexandra
Immanuel J.
Aleks
Miriam K.
+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:
Meine Assistentin Lisa

Ich habe schon deinen Starter-Kurs absolviert. Lohnt sich der Profi-Kurs für mich noch?

Im Profi-Kurs geht es um die nächste Stufe: komplexe Layouts, kreative Problemlösungen, fortgeschrittene Animationen und Techniken, die dir ermöglichen, einzigartige und anspruchsvolle Projekte umzusetzen. Diese Inhalte gehen weit über den Starter-Kurs hinaus und setzen fundierte Kenntnisse in Webflow voraus. Wenn du dich mit responsivem Design in Webflow noch unsicher fühlst, könnte es sinnvoll sein, zuerst deine Grundlagen zu festigen, bevor du dich diesem anspruchsvollen Kurs widmest.

Wie unterscheidet sich der Profi-Kurs zum Starter-Kurs

Der Profi-Kurs richtet sich an erfahrene Webflow-Nutzer und setzt grundlegende Kenntnisse sowohl in Webflow als auch im allgemeinen Website-Aufbau voraus. Statt Basiswissen zu vermitteln, konzentriert sich der Kurs darauf, anspruchsvolle Problemstellungen in Webflow effizient und kreativ zu lösen. Du lernst, komplexe Layouts umzusetzen, die optisch ansprechend und technisch herausfordernd sind, sowie beeindruckende Animationen zu erstellen. Dieser Kurs ist ideal, um dein Können auf ein neues Level zu bringen und Websites zu realisieren, die weit über den Standard hinausgehen.

Arbeite ich im Kurs mit dem Finsweet Client First System?

Ich habe den Client First Styleguide auf meine Bedürfnisse angepasst und vieles davon abgeleitet. Trotzdem hier und da auch mal was anders benannt. Aber die Struktur ist sehr ähnlich. Wenn du die Herangehensweise aus meinem Kurs verstehst, fällt es dir sehr leicht auch ein Projekt komplett nach dem Client First Prinzip aufzubauen.

Auch viele, die schon im Kurs dabei sind, arbeiten danach mit dem Client First Ansatz und nutzen den Styleguide davon als Vorlage und nicht meinen.

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.

Machst du auch persönliche Schulungen bei Agenturen (online oder live) um ggf. gezielt Fragen und Aufgabenstellungen zu klären?

Bei Interesse bitte per Mail bei mir melden:

Gibt es einen Rabatt für Studenten, Schüler oder Auszubildende?

Du bekommst 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:

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.

Wie lange brauche ich pro Woche für diesen Kurs?

Ich empfehle dir jeden Tag zwei Lektion anzuschauen um am Ball zu bleiben und schnell Ergebnisse zu sehen. Eine halbe Stunde solltest du auch neben Kundenaufträgen oder deinem Job gut unterbekommen. Die meisten Videos gehen 8-15 Minuten. Das macht also 2-4 Stunden pro Woche. Alternativ könntest du den kompletten Kurs auch in einer Woche durch rocken. Da du aber dein Leben lang auf diesen Kurs zugreifen kannst, kannst du genauso in deiner Geschwindigkeit lernen.

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.