Wer sich zum ersten Mal mit dem Begriff beschäftigt, stolpert über den etwas sperrigen Namen. Dahinter steckt eine Rendering-Methode, die 2023 von Forschern um Bernhard Kerbl vorgestellt wurde und seitdem die 3D-Branche auf den Kopf stellt.
Das Prinzip: Eine reale Szene — eine Rennstrecke, ein Veranstaltungsort, ein Produkt — wird mit Kameras aus vielen Blickwinkeln fotografiert oder gefilmt. Aus diesen Aufnahmen entstehen Millionen kleiner, halbdurchsichtiger 3D-Ellipsoide, sogenannte Gaussians. Jede dieser Ellipsoiden trägt Informationen über Position, Form, Farbe und Transparenz. In Echtzeit werden sie auf dem Bildschirm zusammengesetzt — das Ergebnis ist ein fotorealistisches Bild, das sich bei Kamerabewegung korrekt verhält.
Der entscheidende Unterschied zu klassischen 3D-Modellen: Es gibt kein Mesh, keine UV-Maps, kein Rigging. Die Szene ist buchstäblich aus Lichtpunkten gebaut. Das macht sie einerseits fotorealistisch — Reflexionen, Licht, feine Oberflächen werden exakt aus den Originalfotos übernommen — und andererseits für WebGL in Echtzeit renderbar.
Wer glaubt, man nehme eine 3DGS-Datei und lade sie einfach auf eine Website, unterschätzt den Aufwand erheblich. Das Rohmaterial aus dem Training — eine .ply-Datei — ist in der Regel 500 Megabyte bis 2 Gigabyte groß. Auf direktem Wege ins Web? Keine Option.
Hinzu kommen die harten Anforderungen einer Markenwebsite:
Der erste Schritt nach dem Training ist die Komprimierung. Das kostenlose, browserbasierte Tool SuperSplat von PlayCanvas übernimmt genau diese Aufgabe.
SuperSplat öffnet die rohe .ply-Datei und erlaubt es, die Szene visuell zu bereinigen: Floaters entfernen — das sind Gaussians, die im leeren Raum schweben und keinen Beitrag zum Bild leisten —, Szenen zuschneiden, den Ausschnitt definieren und die Gesamtzahl der Gaussians reduzieren. Für Desktop-Browser gilt als Richtwert maximal 3 Millionen Gaussians, für Mobilgeräte besser unter 500.000.
Das Ergebnis wird als .sogs-Datei exportiert — dem nativen Format des PlayCanvas-Ökosystems. .sogs steht für Splat Object Gaussian Stream und bringt zwei entscheidende Eigenschaften mit: Es ist stark komprimiert (typischerweise 70 bis 90 Prozent kleiner als die Ausgangs-.ply-Datei) und unterstützt progressives Streaming — der Browser beginnt mit dem Rendern, noch während die Datei lädt.
Zum Vergleich: Das verbreitete .splat-Format ist unkomprimiert und unterstützt kein Streaming. Das .ksplat-Format ist zwar komprimiert, aber nicht nativ eingebunden. .sogs ist die konsequent richtige Wahl für den Web-Einsatz im PlayCanvas-Stack.
Es gibt mehrere Möglichkeiten, eine 3DGS-Szene im Browser darzustellen:
Luma AI bietet einen gehosteten Embed-Code — iframe oder JavaScript — der ohne eigene Infrastruktur auskommt und gut auf Mobilgeräten funktioniert. Für eine reine Darstellung ohne Interaktivität eine schnelle Lösung. Für eine Markenerfahrung mit eigenem Look, Hotspots und Storytelling reicht es nicht.
Polycam bietet ähnliches: einfache Einbettung, CMS-freundlich, aber kaum Kontrolle über das Erscheinungsbild oder den Ablauf der Experience.
mkkellogg/GaussianSplats3D ist ein auf Three.js basierendes Open-Source-Paket, das als npm-Modul in React- oder Next.js-Projekte eingebunden werden kann. Volle Entwicklerkontrolle — aber jede Interaktivität muss von Grund auf selbst gebaut werden. Kein Editor, keine Oberfläche für Nicht-Entwickler.
PlayCanvas spielt in einer anderen Liga. Der Open-Source-WebGL-Engine wurde 2024 native 3DGS-Unterstützung hinzugefügt. Was PlayCanvas von allen anderen unterscheidet: Die Szene und alle interaktiven Elemente — Hotspots, Animationen, UI, Audio — laufen in einem einzigen WebGL-Kontext. Es muss kein Splat-Viewer mit einer separaten UI-Schicht zusammengeklebt werden. Das Entity-Component-System erlaubt es, JavaScript-Skripte direkt an Splat-Objekte in der Szene zu hängen.
Dazu kommt: PlayCanvas und SuperSplat teilen dasselbe Format. Die .sogs-Datei, die SuperSplat exportiert, lädt PlayCanvas direkt — kein Konvertierungsschritt, keine Zwischenstation.
Hier kommt der entscheidende Baustein für redaktionelle Markenwebsites: StorySplat.
StorySplat ist ein Low-Code-Authoring-Tool, das auf der PlayCanvas-Engine aufbaut. Es richtet sich nicht primär an Entwickler, sondern an Produzenten und Creative Technologists — die Leute, die eine Story erzählen wollen, ohne Lust auf Engine-Code zu haben.
Das Ergebnis ist ein PlayCanvas-Runtime-Bundle. Das bedeutet: Was StorySplat erzeugt, ist kein fremdes System — es ist derselbe PlayCanvas-Kern, den ein Entwickler jederzeit mit eigenen Skripten erweitern kann, wenn die No-Code-Grenzen erreicht sind. Kein Stack-Wechsel, keine Neuexporte, keine Reibung.
Zusammengefasst sieht die empfohlene Pipeline so aus:
.ply — vom 3D-Scan-Dienstleister
SuperSplat — Bereinigung · Pruning · Komprimierung
.sogs Export — 70–90 % kleiner
CDN (Cloudflare / Fastly) — CORS · HTTP/2 · Streaming
StorySplat — Hotspots · Kameraführung · Übergänge
PlayCanvas Runtime — Custom Scripts bei Bedarf
iframe / JS-Embed → Next.js · Contentful · WordPress
Statisches Fallback-Bild (WebGL2 + IntersectionObserver)
Sportmarken, Automobilhersteller, Eventveranstalter, Tourismusanbieter — überall dort, wo eine Website nicht nur informieren, sondern eine Geschichte erzählen soll, sind die Anforderungen ähnlich: schnelle Ladezeiten, Geräteunabhängigkeit, CMS-Integration und die Fähigkeit, nicht nur etwas zu zeigen, sondern zu führen.
3DGS erfüllt diese Anforderungen heute. Eine Rennstrecke, ein Event-Venue, ein Fahrzeug — als fotorealistische, interaktive 3D-Szene im Browser, mit Hotspots, die Informationen liefern, und einer Kameraführung, die den Blick lenkt.
3D Gaussian Splatting ist im Web angekommen. Die Toolchain vom .ply bis zur fertigen interaktiven Experience ist ausgereift, dokumentiert und heute einsetzbar. Wer als Marke jetzt in diesen Workflow investiert, baut einen Vorsprung auf, der in den nächsten Jahren schwer aufzuholen sein wird.
Das PlayCanvas-Ökosystem — SuperSplat für die Komprimierung, .sogs als Lieferformat, StorySplat für das Authoring, PlayCanvas Engine für individuelle Erweiterungen — ist dabei der kohärenteste und am besten integrierte Stack, der aktuell verfügbar ist.
