Scroll-Animation Showcases. Shader, 3D, GLSL, Partikel — alles selbst gebaut. Kein Fake, kein Scam.
Cremepapier, Serif-Typo, 3-Spalten-Lauf, rote Drop-Caps. Wie eine Sonntags-Beilage von Le Monde.
Regen-Straße, vertikales Kanji, holografische ID-Karte, Glitch-FX. Blade-Runner-Energie.
WordArt, IE6-Fenster, Marmorbüste, Glas-Buttons. 90er-Internet trifft 2026-Craft.
3D-Roboter mit Targeting-Brackets, konzentrische Ringe, Live-Telemetrie. Iron-Man-Jarvis.
B&W Manga-Seite, Speedlines, Halbton-Raster, Sound-Effect-Bursts. Studio-Trigger-Energie.
Endlos-Grid-Boden, pixelige Sonne, Palmen, VHS-Scanlines. Neon-Highway 1986.
Mega-Mono-Typografie 320px, Primärfarben-Slabs, harte 90°-Kanten. Müller-Brockmann goes Web.
Mono-only Tech-Landing wie motd/whois/man-page. Code-Snippets in C/Rust/TS, Debian-Package-Stil, Stack-Tree.
Frame-Scrubbing-Hero. Mercury → Code-Partikel → Chrome-T. Apple-Produkt-Page-Stil.
8-Bit-Stadt mit klickbaren Häusern als Projekte. SimCity-2000-Aesthetik.
Vergilbtes Papier, Ribbon-Rot, Marginalien in Tinte. 3D Antique Camera als Schreibtisch-Prop.
CRT-Phosphor-Terminal mit Tipp-, Quiz-, Memory-, Regex-, Debug-Challenges + 3D-Lantern.
Top-Down-Sci-Fi-Welt, hex-grid, sektorbasierte Inspektion. 3D-Drone-HUD als Telemetrie.
Halbton-Punkte, KAPOW!-Bursts, dicke Tinte-Borders, Heldenpose. Silver-Age-Vibe.
Cinematic Pullback: PCB → City → Brain → Galaxy. 241 Frames bei 16fps, scroll-locked.
Weiß-auf-Marineblau, SVG-Path-Draw beim Scrollen, Bemaßungen, 8 CAD-Blätter mit Title-Block.
CSS 3D Pop-up-Buch, Crane-Unfold, gefalteter Brief als Kontakt. Sehr taktil, sehr ruhig.
Apple-Keynote-Hero: 2,8s Black-Screen, Logo-Reveal Letter-by-Letter, dann ruhige Premium-Landing.
Fighting-Game VS-Screen: Tobias vs. THE APPLICATION. Health-Bars, Combat-Log, Skills als Attacks.
Interaktiv: Tippe etwas. Jedes Zeichen enthüllt mehr Portfolio. Easter-Words triggern Spezial-Effekte.
Galerie aller versteckten Spielereien dieser Site. Locked/Unlocked persistent via localStorage.
Ruhiger DevOps-Idle-Simulator mit Coding-Aufgaben, Stationen, Ticket-Nebenpipeline, XP-Leveling und Skilltree.
Kleiner Stick-Held rennt von links rein, springt zur Decken-Lampe, zieht an der Schnur — dann erst wird der Hero-Content sichtbar. ~5s Cold Open.
Hero mit Mini-Game-Overlay: kleiner Käfer läuft im Hintergrund, mit Pfeiltasten + Shift-Boost jagen. AI flieht intelligent, beschleunigt — nur über Ecken-Trick fangbar.
Tausende Canvas-Partikel morphen von der Spiralgalaxie zu Name, Skills und Symbolen. Maus stößt Partikel ab, Klick/Scroll wechselt die Formation.
Flüssiges Chrom in einem einzigen WebGL2-Fragment-Shader: Metaballs mit Ferrofluid-Spitzen folgen träge der Maus, darüber große Difference-Typo.
Portfolio als Metro-Netzplan: Fünf farbige Linien für Karriere, Frontend, Mobile, Backend und DevOps zeichnen sich beim Scrollen. 26 Stationen, 7 Umsteigebahnhöfe.
Portfolio als Mini-Betriebssystem: draggbare Fenster, Dock mit Bounce, Menüleiste mit Uhr und ein Terminal mit echten Befehlen. Window-Manager handgebaut.
Karriere als Expeditionskarte: prozedural generierte Höhenlinien in Sepia/Olive, eine Route zeichnet sich beim Scrollen von Camp zu Camp — mit Kompassrose und Höhenprofil.
Skills als mechanisches Sonnensystem: jede Disziplin ein Planet auf seiner Bahn, Technologien als Monde, Projekte im Asteroidengürtel. Klick einen Planeten für Details — Canvas, Echtzeit-Orbits, pseudo-3D.
Echte GPU-Strömung (Stable-Fluids / Navier-Stokes) in WebGL2. Maus/Finger malt Farbe ins Feld, das real wegströmt. Im Leerlauf schreibt sich „Tobias Ludwig“ aus dem Fluid.
Prozeduraler Synth im Browser (Web Audio) + FFT-Analyse treiben ein radiales Spektrum und reaktive Partikel. Beat-Detection, optionaler Mikrofon-Input.
Rotierender Punkt-Globus mit leuchtenden Arcs von Königswinter zu 22 Städten weltweit. Reisende Licht-Pulse, Pins, Drag-Rotation. Three.js / R3F.
Selbst gebaute Rigid-Body-Engine (SAT-Kollision, Impuls-Auflösung, Reibung). Tech-Logo-Blöcke greifen, werfen, stapeln. „Gravitation kippen“ dreht die Welt.
Echtzeit-Observability-Dashboard (Bloomberg/NASA-Stil): Live-Charts, KPI-Counter, Welt-Ping-Karte, Event-Stream, Gauges — alles aus einem zentralen Tick.
Demoscene-Raymarcher: volumetrischer Mandelbox-Nebel per Sphere-Tracing, weiche Schatten, AO, Glow, Fog. Scroll-Flug, Quality-Slider. Tief drin: „TL“.
Bis zu einer Million Partikel via WebGL2 Transform-Feedback durch ein Curl-Noise-Feld. Formen Name & Skills, Maus = Gravitationsbrunnen, Klick = Schwarzes Loch.
Raymarched Schwarzschild-Schwarzes-Loch mit echter Lichtkrümmung: gelinster Einstein-Ring, Akkretionsscheibe, Doppler-Beaming, Rotverschiebung. Easter-Egg am Horizont.
Voll funktionierendes Reservierungs-Modul: Tisch (Restaurant), Zimmer (Hotel) und Termin (Physio) mit Kalender, Echtzeit-Verfügbarkeit und Bestätigungs-Flow.
Echte WebGPU Compute-Shader: Boids-Schwarm & Flowfield mit bis zu 16k Agenten. Robuste Fallback-Kette WebGPU → WebGL2 → Canvas2D.
Modulares Sideboard in Echtzeit-3D konfigurieren: Holzart, Akzent, Module, Untergestell, Griffe — Live-Preis, 360°-Drehen, Anfrage-Flow. R3F.
Der Sales-Pitch als Demo: draggbarer Vorher/Nachher-Slider zwischen alter & moderner Seite, animierte Ladezeit-Balken und hochzählende Lighthouse-Gauges.
Interaktives Menü mit Allergen-/Vegan-Filtern, Warenkorb mit Mengen-Stepper und laufender Summe, simulierte Bestellung. Für Gastro-Kunden.
Kontakt-Modul mit handgebauter SVG-Karte, Live-Öffnungsstatus aus der Uhrzeit („schließt in 2 Std“), Öffnungszeiten-Tabelle und Route/Anruf-Buttons.
Interaktiver Kostenvoranschlag für Handwerk: Gewerk wählen, Fläche & Optionen → animierter Live-Preis mit Aufschlüsselung und „von–bis“-Spanne.
Social-Proof-Modul im Google-Reviews-Stil: animierter Gesamt-Score, Sterne-Verteilung, Filter, und ein Formular zum Abgeben einer Bewertung.
Durchsuchbares Hilfe-Center mit Sofort-Filter (diakritik-insensitiv, Treffer-Highlight), Kategorien, Accordion und „War das hilfreich?“.
Filterbare Referenz-Galerie (Masonry) mit Lightbox: Prev/Next, Keyboard, Fokus-Trap — inkl. Vorher/Nachher-Kacheln mit eigenem Slider.
Mehrstufiger Lead-Funnel: Anliegen → bedingte Details → Kontakt → Übersicht, mit Fortschritt, Schritt-Validierung und animierter Bestätigung.
Lead-Capture mit Twist: Anmeldung → Rubbel-Gutschein auf Canvas, Code-Copy und Konfetti. Echter Text unter dem Rubbel-Layer (a11y).
Vollwertiges Projektboard (Trello-Stil): Spalten, Drag-&-Drop-Karten zwischen Spalten, Labels, Priorität, Suche/Filter, mehrere Boards — localStorage.
3-Pane-Inbox (Apple-Mail/Superhuman-Stil): Ordner, Liste, Lesebereich, Verfassen/Antworten, Suche, Mehrfachauswahl & Bulk-Aktionen. 22 Beispiel-Mails.
Browser-IDE im VS-Code-Stil: Datei-Baum, Tabs, eigener Syntax-Tokenizer, Zeilennummern und sandboxed Live-Preview im iframe. Command-Palette (Cmd+K).
Vollwertiger Kalender (Google-Calendar-Stil): Monats-/Wochenansicht, Termine anlegen und per Drag verschieben/skalieren, Kategorien — localStorage.
Budget-App (N26/YNAB-Stil): Transaktionen, Kategorie-Budgets mit Warnung, selbst gezeichnete Charts (Donut/Balken/Linie), Cents-genaue Bilanz.
Top-Down-Arcade-Racer mit eigener Engine: echte Drift-Physik (Slip-Modell + Handbremse), designte Strecke mit Gras & Banden, Countdown, 3 Runden, KI-Rivale, Minimap. Keyboard + Touch.