Menos tiempo de carga en WebGL y comercialización más rápida

Descubre como Marxent unió fuerzas con los servicios profesionales de Unity para optimizar el rendimiento de sus aplicaciones

Marxent: un estudio de caso de los servicios profesionales de Unity

How do you get two sophisticated software programs and a diverse collection of browser technologies to work together for the best user experience? Marxent augmented its team of world-class developers to optimize a 360°, 3D interior-design tool for the web that lets customers and sales associates create and modify rich visualizations. They brought a better product to market faster by leveraging Unity Professional Services.

Beck and Barry Besecker started Marxent in 2011 to help retailers, particularly in home furnishings and home improvement, increase sales and reduce returns by taking advantage of emerging 3D technologies. Initially, the brothers built one-off AR and VR applications, but with the increased performance demands and necessity of integrated content management, they soon switched from OpenGL to the Unity real-time engine. This enabled them to push the Marxent® 3D Cloud platform to the forefront of the industry, where they are now a global leader in omnichannel 3D design and visualization.

  • El proyecto

    Las visualizaciones interactivas y rápidas aumentan las ventas del servicio de diseño de interiores y reducen la cantidad de devoluciones

  • El objetivo

    Optimizamos el tiempo de carga de apps en diferentes entornos de navegación

  • Plataformas

    WebGL, iOS, Android

  • Miembros del equipo

    80

  • Ubicación

    Miamisburg, Ohio – Austin Landing

El motor en tiempo real de Unity es un componente integral

Marxent’s 3D Room Designer is a browser-based, interior-design tool that lets customers and sales associates mix-and-match furniture, colors, wall treatments, and dimensions in a rich 3D environment. Its simple, responsive interface encourages buyers to configure and price design projects visually. The Unity real-time engine is an integral component.

When Marxent was demoing a recent WebGL implementation of the 3D Room Designer, a new client mentioned that the longer loading times were an issue. While Marxent engineers had recently made major optimizations overall, the reason for this particular issue wasn’t obvious. Still, they committed to resolving it, which would help the customer deliver better end-user experience and ultimately increase sales.

One missing element was deep insight into the Unity real-time engine and how rendering programs behaved with sometimes-idiosyncratic code formats such as WebAssembly. Marxent got in touch with Unity Professional Services to help investigate and troubleshoot what was going on – with the Unity code, the Marxent code, the way .dlls and frameworks were structured – whatever was impacting launching and loading times, particularly on the WebGL platform.

The results:

  • An enhanced customer experience through a faster, more streamlined 3D program
  • Increased in-house expertise working with the Unity platform
  • A stronger, more collaborative partnership between two world-class software companies

El objetivo: reducir los tiempos de carga

La interfaz de usuario de 3D Room Designer está desarrollada en lenguaje HTML y JavaScript nativo, y se comunica con Unity WebGL Player mediante llamadas de JavaScript. Funciona mediante un conjunto de bibliotecas administradas creadas por Marxent y compartidas en todas las aplicaciones de Marxent® 3D Cloud.

Después de que los desarrolladores de Marxent explicaron la arquitectura, los sistemas, el proceso de desarrollo, la configuración y las bibliotecas del proyecto, los equipos de Marxent y de Unity apuntaron a reducir el tamaño del código base y los datos del reproductor de la aplicación de WebGL, y, de esta forma, optimizar su flujo. Más precisamente, esto incluyó:

  • La implementación de WebAssembly
  • La eliminación de assets innecesarios de la compilación del reproductor y la optimización de assets más necesarios
  • La eliminación de paquetes (módulos) de Unity innecesarios
  • La optimización del tamaño de códigos administrados mediante el mejoramiento del fraccionamiento de datos y la eliminación de bibliotecas de códigos administrados
  • La minimización del tiempo de compilación de shaders y los tiempos de carga anticipada de la primera escena
  • La eliminación de otros cuellos de botella en el CPU

Ajustar la app para que funcionase correctamente con WebAssembly resultó ser una parte fundamental de este proyecto de optimización de rendimiento de aplicaciones (APO). WebAssembly es un formato de texto de rápida ejecución para código desarrollado por el World Wide Web Consortium (W3C) a modo de complemento de JavaScript. Según Vince Kilian, desarrollador principal de productos de Marxent, "La integración de WebAssembly es una de las capacidades más importantes para nosotros de la versión Unity 2018.3".

La diferencia que puede hacer una persona

Uno de los ingenieros de asistencia principales de Unity pasó una semana junto al equipo del cliente. Barry Besecker, director de tecnología y cofundador de Marxent, dijo, "La profundidad y el alcance de su experiencia técnica eran muy altos, pero tal vez lo más importante fue que encajó muy bien en nuestro equipo. La colaboración fue extraordinaria gracias a su fantástica contribución". Además de ser un experto en la resolución de problemas y una persona altamente experimentada en el funcionamiento de la plataforma de Unity a nivel empresarial, fue un gran comunicador, y se contactó con otros desarrolladores e ingenieros de Unity que lograron colaborar para llegar a la solución. Particularmente, hablaba mucho por mensaje directo con uno de los gurús de WebGL en Unity durante las sesiones de trabajo, quien lo ayudó a aportar ideas y resolver problemas complicados.

Muchas veces, su papel fue ofrecer una orientación útil y práctica para trabajar con la "caja negra" de Unity, sin dejar de proteger la propiedad intelectual de la empresa. Según Kilian, "A veces es necesario saber ciertas cosas de diseño del sistema para poder determinar la raíz más profunda del problema. Unity tiene algunas instrucciones anidadas muy complejas, ¡y algunos de los seguimientos de pila no son para cualquiera! El haber contado con su experiencia y perspectiva fue muy importante para nosotros".

Una colaboración muy productiva

After the APO, Marxent informed its customer that there was a quick solve to the front-end loading issue and that it could be implemented promptly. Besecker said, “We hear from clients pretty quickly if there are issues, and in this case, we had a new client using a prototype in a test environment, so it was easy to show them the improvement.” Overall, Marxent estimated a 30% loading-speed improvement, which they feel is quite significant.

With this experience under their belt, Marxent is currently working on a statement of work for Development Assistance to expand the extensibility of the shader system – the shader pipelines and rendering-system pipelines introduced in Unity 2018.3.

Looking ahead, Marxent anticipates taking advantage of Unity’s commitment to enhancing dynamic and user-generated environments and objects. “I’ve seen Unity projects at developer conferences where there are millions of instances on the screen and way-fewer call counts, and that’s a huge jump forward. But that’s for legions of soldiers shooting arrows. At Marxent, we’re not simultaneously spawning thousands of couches!” according to Kilian.

They are, however, helping sell thousands of couches. Globally, Marxent is leading the development of AR/VR tools for commerce, and collaborations such as the Professional Services engagement work two ways – a product is optimized, and Unity gains profound insight into enhancing and shaping its own product and roadmap. For example, working with Marxent reinforced the importance of the Memory Profiler as a general diagnostic tool and the importance of real-time lighting in the shader system for dynamic retail apps.

"Ni siquiera pensamos en otros proveedores, acudimos directo a Unity. Ellos aprobaron la tecnología, y la investigación y desarrollo que tanto nos enorgullecía, y sabíamos que su gente era la indicada para ayudarnos a optimizar la app. Además, contaban con personal experimentado disponible para asignar al proyecto".

Barry Besecker, CTO and Co-Founder, Marxent

Usamos cookies para brindarte la mejor experiencia en nuestro sitio web. Visita nuestra página de política de cookies si deseas más información.

Listo