Wenn du einen Shopify-Shop betreibst und Produkte mit 3D-Modellen präsentieren möchtest, solltest du diese spannende Entwicklung im Blick behalten. Shopify hat gerade genau das Tool veröffentlicht, das sie intern zur Optimierung von 3D-Modellen nutzen – und es ist komplett kostenlos.
Warum das für deinen Shop wichtig ist
3D-Produktvisualisierung wird für Onlinehändler immer wichtiger. Egal, ob du Möbel, Elektronik oder Fashion-Artikel verkaufst: Wenn Kund:innen Produkte aus jedem Winkel betrachten können, kann das die Conversion-Rate deutlich steigern. Es gab jedoch schon immer eine große Herausforderung: die Dateigröße.
Today @Shopify is open sourcing the tool we use for optimizing glTF 3D models.
🔧 Tweak compression settings per texture
⚡ See changes immediately
🧰 Mesh compression options
🌐 Hosted online & free👇 Check the thread for details pic.twitter.com/HNgcXaxWxn
— Daniel Beauchamp (@pushmatrix) July 31, 2025
Große 3D-Dateien führen zu langen Ladezeiten – das frustriert Kund:innen und schadet der Performance deines Shops. Bislang haben die meisten Optimierungstools nach dem Prinzip „one size fits all“ gearbeitet und jede Textur auf die gleiche Weise komprimiert. Das führte oft entweder zu Dateien, die immer noch zu groß waren, oder zu Modellen, die furchtbar aussahen.
Was Shopify’s Tool anders macht
Der neue glTF Compressor (verfügbar unter gltf-compressor.com) löst dieses Problem mit einer echten Gamechanger-Funktion: Kompressionskontrolle pro Textur.
Das kannst du damit machen:
- Kompressionseinstellungen für jede Textur individuell anpassen – Deine Normal Maps (die Oberflächendetails definieren) können eine höhere Qualität behalten, während weniger kritische Texturen wie Ambient-Occlusion-Maps deutlich stärker komprimiert werden können
- Änderungen sofort sehen – Du musst dein Modell nicht ständig neu exportieren, um verschiedene Einstellungen zu testen
- Original und komprimierte Version nebeneinander vergleichen – Triff fundierte Entscheidungen beim Trade-off zwischen Qualität und Dateigröße
- Zugriff auf Mesh-Kompressionsoptionen – Optimiere nicht nur Texturen, sondern auch die 3D-Geometrie selbst
So nutzt du es für deinen Shop
- Rufe das Tool auf unter gltf-compressor.com – es ist online gehostet und komplett kostenlos
- Lade dein glTF-3D-Modell hoch – das ist das Standardformat für webbasierten 3D-Content
- Kompressionseinstellungen anpassen – für jede Textur individuell
- Änderungen in Echtzeit prüfen, damit die Qualität deinen Ansprüchen entspricht
- Das optimierte Modell herunterladen, sobald du mit dem Ergebnis zufrieden bist
Praxisbeispiel: Horizon Drive
Um die Power dieses Tools zu zeigen, hat Shopify Horizon Drive entwickelt – ein voll funktionsfähiges Rennspiel, gebaut mit Three.js und React. Obwohl es ein komplexes 3D-Erlebnis ist, bleibt das gesamte Spiel dank sorgfältiger Optimierung mit genau diesem Tool unter 10 MB.
Noch beeindruckender ist, wie sie es umgesetzt haben:
- Keine Physics-Libraries nötig
- Keine teuren Raycasting-Berechnungen
- Track-Kollisionsprüfung über splinebasierte Normalen und Tangenten
- Hervorragende Performance auf Standardgeräten
Shopify just launched a racing game built in threejs and React (R3F).
No physics libraries. No raycasts.
Not vibe coded. But all vibes. ✨ pic.twitter.com/37WT2gMgpF
— Daniel Beauchamp (@pushmatrix) May 22, 2025
Du kannst es selbst erleben – als Easter Egg auf Shopify’s Summer 2025 Editions page.
Das Team hinter dem Tool
Dieses leistungsstarke Optimierungstool wurde von einem talentierten Team bei Shopify entwickelt, darunter Daniel Beauchamp (@pushmatrix), Diego Macario (@maca_graphics), brennan (@letkma) und weitere Mitwirkende.
Das sind dieselben Entwickler, die auch das beeindruckende Rennspiel Horizon Drive gebaut haben – ein klarer Beleg für ihre tiefe Expertise in 3D-Web-Erlebnissen. Dass sie dieses interne Tool als Open Source veröffentlichen, zeigt Shopify’s Anspruch, Händler:innen mit professionellen Ressourcen zu stärken.
Warum Open Source wichtig ist
Indem Shopify dieses Tool als Open Source veröffentlicht (Code verfügbar unter github.com/shopify/gltf-compressor), bekommst du Zugriff auf dieselbe Optimierungstechnologie, die sie für ihre eigenen performanten 3D-Erlebnisse nutzen. Das bedeutet:
- Kein Vendor Lock-in – Du besitzt deine optimierten Dateien
- Verbesserungen durch die Community – Entwickler:innen weltweit können Erweiterungen beisteuern
- Transparenz – Du siehst genau, wie deine Modelle verarbeitet werden
- Potenzial für Anpassungen – Tech-affine Händler:innen können das Tool für spezielle Anforderungen modifizieren
Best Practices für deine 3D-Modelle
Wenn du den glTF Compressor für die 3D-Modelle deines Shops nutzt, behalte diese Tipps im Hinterkopf:
- Starte mit hochwertigen Modellen – Das Tool optimiert vorhandenen Content; schlechte Ausgangsqualität kann es nicht „reparieren“
- Teste auf verschiedenen Geräten – Was auf deinem High-End-Rechner gut aussieht, kann auf Kund:innen-Smartphones ins Straucheln geraten
- Qualität und Performance ausbalancieren – Manchmal ist eine etwas größere Datei, die zuverlässig lädt, besser als eine ultrakomprimierte, die schlecht aussieht
- Denke an deine Zielgruppe – Fashion-Artikel brauchen oft höhere Texturqualität als Industrieausrüstung
Heute starten
Wenn du in deinem Shopify-Shop bereits 3D-Modelle nutzt, jag sie am besten noch heute durch diesen Optimizer. Du wirst wahrscheinlich deutliche Reduktionen der Dateigröße sehen – ohne spürbaren Qualitätsverlust. Und falls du 3D-Visualisierung noch nicht in deinen Shop integriert hast: Dieses Tool nimmt eine der größten Einstiegshürden aus dem Weg.
Die Kombination aus Shopify’s AR-Funktionen und diesem neuen Optimierungstool bedeutet: Es gab nie einen besseren Zeitpunkt, um deine Produktseiten aufzuwerten – mit interaktivem 3D-Content. Deine Kund:innen werden es schätzen, Produkte im Detail prüfen zu können, und dein Shop profitiert von mehr Engagement und niedrigeren Bounce-Rates, die mit schnell ladenden, hochwertigen 3D-Erlebnissen einhergehen.
Bereit, deine 3D-Modelle zu optimieren? Geh auf gltf-compressor.com und sieh den Unterschied selbst.
