Schnellere WebGL-Ladezeiten und Zeit bis zur Markteinführung

Wie Marxent mit Unity Professional Services zusammenarbeitete, um die Anwendungsleistung zu optimieren.

Marxent: Eine Fallstudie zu Unity Professional Services

Wie erhält man zwei ausgereifte Softwareprogramme und eine vielfältige Sammlung von Browsertechnologien, um zusammen die beste Nutzererfahrung zu erzielen? Marxent erweiterte sein Team von Weltklasse-Entwicklern, um ein dreidimensionales 360°-Innenarchitektur-Tool für das Web zu optimieren, mit dem Kunden und Vertriebsmitarbeiter umfangreiche Visualisierungen erstellen und anpassen können. Sie haben schneller ein besseres Produkt auf den Markt gebracht, indem sie Unity Professional Services nutzten.

Beck und Barry Besecker gründeten Marxent im Jahr 2011, um Einzelhändlern, insbesondere im Bereich der Innenausstattung und des Heimwerks, zu helfen, den Umsatz zu steigern und die Retouren zu reduzieren, indem sie die neuen 3D-Technologien nutzen. Anfangs bauten die Brüder einmalige AR- und VR-Anwendungen, doch mit dem erhöhten Leistungsanspruch und der Notwendigkeit eines integrierten Content-Managements wechselten sie bald von OpenGL zur Unity-Echtzeit-Engine. Dies ermöglichte ihnen, die Marxent® 3D-Cloud-Plattform an die Spitze der Branche zu befördern, wo sie heute ein weltweit führendes Unternehmen im Bereich Omnichannel-3D-Design und -Visualisierung sind.

Das Projekt

Schnelle, interaktive Visualisierungen steigern den Umsatz in der Innenarchitektur und reduzieren die Retouren.

Das Ziel

Ladezeiten von Apps in verschiedenen Browserumgebungen optimieren

Plattformen

WebGL, iOS, Android

Teammitglieder

80

Standort

Miamisburg, Ohio, USA – Austin Landing

Die Echtzeit-Engine von Unity ist ein integraler Bestandteil

Der 3D-Raumdesigner von Marxent ist ein browserbasiertes Werkzeug für die Innenarchitektur, mit dem Kunden und Vertriebsmitarbeiter Möbel, Farben, Wandverkleidungen und Abmessungen in einer umfassenden 3D-Umgebung miteinander kombinieren können. Die einfache, reaktionsschnelle Benutzeroberfläche veranlasst Käufer dazu, Designprojekte visuell zu konfigurieren und zu bewerten. Die Echtzeit-Engine von Unity ist ein integraler Bestandteil.

Als Marxent eine kürzlich durchgeführte WebGL-Implementierung des 3D-Raumdesigners vorführte, erwähnte ein neuer Kunde, dass die längeren Ladezeiten ein Problem seien. Da Techniker von Marxent vor kurzem umfassende Optimierungen vorgenommen hatten, war der Grund für dieses spezielle Problem nicht offensichtlich. Dennoch verpflichteten sie sich, das Problem zu lösen, was dem Kunden helfen würde, eine bessere Endbenutzererfahrung zu erzielen und letztendlich den Umsatz zu steigern.

Ein fehlendes Element war ein umfassendes Verständnis der Echtzeit-Engine von Unity und wie sich Rendering-Programme mit manchmal spezifischen Code-Formaten wie WebAssembly verhalten. Marxent setzte sich mit Unitys Professional Services in Verbindung, um zu ermitteln, wo das Problem lag. Ob im Unity-Code, im Marxent-Code oder in der Strukturierung von DLLs und Frameworks – was auch immer die Start- und Ladezeiten beeinflusste, insbesondere auf der WebGL-Plattform.

Die Ergebnisse:

  • Ein verbessertes Kundenerlebnis durch ein schnelleres, schlankeres 3D-Programm
  • Mehr internes Know-how im Umgang mit der Unity-Plattform
  • Eine stärkere, kooperativere Partnerschaft zwischen zwei erstklassigen Softwareunternehmen

Das Ziel: Ladezeiten reduzieren

Das Frontend des 3D-Raumdesigners besteht aus nativem HTML und JavaScript, das über externe JavaScript-Aufrufe mit dem Unity-WebGL-Player kommuniziert. Es wird von einer Bibliotheken-Suite bereitgestellt, die von Marxent erstellt und verwaltet und von allen Marxent® 3D-Cloud-Anwendungen gemeinsam genutzt wird.

Nachdem die Marxent-Entwickler die Architektur, die Systeme, den Bereitstellungsprozess, das Setup und die Bibliotheken des Projekts erläutert hatten, setzten sich die Teams von Marxent und Unity als Ziel, die Größe der Player-Daten und der Codebase der WebGL-Anwendung zu reduzieren und den Anwendungsfluss zu optimieren. Genauer gesagt gehörte dazu:

  • Implementieren von WebAssembly
  • Entfernen nicht mehr benötigter Assets aus dem Player-Build bei gleichzeitiger Optimierung der Größe umfangreicherer benötigter Assets
  • Entfernen von nicht benötigten Unity-Paketen (Modulen)
  • Optimieren der Größe des verwalteten Codes durch verbessertes Stripping und durch das Entfernen von Teilen verwalteter Codebibliotheken
  • Minimieren der Shader-Kompilierungszeiten und der Vorab-Ladezeiten der ersten Szene
  • Beseitigen weiterer CPU-Engpässe

Die Anpassung der App an WebAssembly erwies sich als wesentlicher Bestandteil dieses APO-Projekts (Application Performance Optimization). WebAssembly ist ein schnell ausführendes Textformat für Code, das vom World Wide Web Consortium (W3C) als Ergänzung zu JavaScript entwickelt wurde. Laut Vince Kilian, Produktentwicklungsleiter von Marxent, „ist die Integration von WebAssembly für uns eine der wichtigsten Funktionen von Unity in der Version 2018.3.“

Der Unterschied, den ein Individuum ausmachen kann

Einer der führenden Support-Techniker von Unity verbrachte eine Woche beim Kundenteam vor Ort. Barry Besecker, Marxents CTO und Mitbegründer, sagte: „Der Umfang seines technischen Fachwissens war beträchtlich, aber was noch wichtiger ist, er hat sich großartig in unserer Team eingefügt – die Zusammenarbeit war aufgrund dieser fantastischen Ressource bemerkenswert.“ Er war ein versierter Problemlöser und mit der Unity-Plattform, die unternehmensweit läuft, sehr erfahren und zudem ein Kommunikationsknotenpunkt, der Verbindungen zu anderen Entwicklern und Technikern bei Unity herstellte, die zur Lösung beitragen konnten. Oft hat er während Arbeitssitzungen einen der WebGL-Gurus von Unity direkt angeschrieben, um zu brainstormen und hartnäckige Probleme zu beheben.

Häufig bestand seine Aufgabe darin, hilfreiche und praktische Orientierungshilfen für die Arbeit mit Unitys „Black Box“ bereitzustellen und gleichzeitig das geistige Eigentum von Unity zu schützen. Kilian erklärte: „Manchmal muss man bestimmte Dinge über die Herstellung des Systems wissen, um Probleme wirklich tiefgehend diagnostizieren zu können. Unity besitzt ein paar massiv verschachtelte Anweisungen und mit einigen der Stacktraces ist nicht zu spaßen! Diese Art von Expertise und Einblick zu haben war für uns sehr wichtig.“

Eine hochproduktive Zusammenarbeit

Nach der APO informierte Marxent seinen Kunden darüber, dass es eine schnelle Lösung für das Front-End-Problem gäbe und dieses unverzüglich implementiert werden könne. Besecker sagte: „Wir hören ziemlich schnell von Kunden, wenn es Probleme gibt. In diesem Fall hatten wir einen neuen Kunden, der einen Prototyp in einer Testumgebung verwendete. Daher war es einfach, ihm die Verbesserung zu zeigen.“ Insgesamt schätzte Marxent eine Verbesserung der Ladegeschwindigkeit um 30 %, die ihrer Meinung nach signifikant sei.

Mit dieser gesammelten Erfahrung arbeitet Marxent derzeit an einer Leistungsbeschreibung für Entwicklungshilfe zum Ausbau der Erweiterbarkeit des Shader-Systems – der in Unity 2018.3 eingeführten Pipelines für Shader und Rendering-Systeme.

Mit Blick auf die Zukunft erwartet Marxent, das Engagement von Unity für die Verbesserung dynamischer und von Benutzern generierter Umgebungen und Objekte zu nutzen. „Ich habe Unity-Projekte auf Entwicklerkonferenzen gesehen, bei denen Millionen von Instanzen auf dem Bildschirm mit viel weniger Call Counts angezeigt werden. Das ist ein großer Fortschritt. Aber solche Dimensionen streben wir gar nicht an. Wir bei Marxent rufen nicht gleichzeitig tausende Sofas auf einmal ab“, so Kilian.

Jedoch hilft es dabei, Tausende von Sofas zu verkaufen. Marxent ist der weltweit führende Entwickler von AR-/VR-Tools für den Handel. Und von Kooperationen wie die Professional Services-Einbindung profitieren beide Seiten: Ein Produkt wird optimiert und Unity erhält umfassende Einblicke zur Verbesserung und Gestaltung des eigenen Produkts und Leitplans. Durch die Zusammenarbeit mit Marxent stieg beispielsweise die Bedeutung des Memory-Profilers als allgemeines Diagnosetool und der Echtzeitbeleuchtung im Shader-System für dynamische Einzelhandelsanwendungen.

„Wir haben andere Anbieter nicht wirklich in Betracht gezogen – wir sind direkt zu Unity gegangen. Sie validierten die Technologie sowie die Forschung und Entwicklung, auf die wir ziemlich stolz waren, und so wussten wir, dass wir mit Unity auf dem richtigen Weg waren, die App zu optimieren. Und offen gesagt hatten sie kompetente Mitarbeiter, die sofort am Projekt arbeiten konnten.“

Barry Besecker, CTO and Co-Founder, Marxent

We use cookies to ensure that we give you the best experience on our website. Click here for more information.