Saltar al contenido principal

Modelviewer: Variants Materials

Descripción General

En esta guía se explicará el flujo de Arte 3D para usar Model Viewer (https://modelviewer.dev/editor/) en la creación de experiencias AR

Variant Materials

Model Viewer maneja una opción llamada variantes, que permite tener varios materiales y texturas en un solo modelo GLB, lo que ayuda a reducir considerablemente el tamaño del archivo final.

En el siguiente enlace podemos encontrar un add-on compatible con Blender 3.1 (El archivo solo es compatible con esta versión y exporta esta opción en los modelos correctamente)

https://github.com/takahirox/glTF-Blender-IO-materials-variants y un video en caso de tener dudas de como funciona.

https://www.youtube.com/watch?v=XuDDSKHBZRY&list=PLo22nlYvtI2_99iWaYmwAeC8nfNkRTBy1&index=67&ab_channel=ordhuille .

Después de instalar el add-on, aparecerá la siguiente opción en la pestaña de Object Properties.

Los materiales se crean de manera normal y en la pestaña recientemente creada se asigna el  nombre de la variante junto con el material deseado.

Para las versiones más nuevas de Blender, está opción se activa directamente en el add-on glTF 2.0 format. Lo que agregara una nueva pestaña llamada glTF Variants y una nueva sección en las opciones del material.

En la pestaña de los materiales se asignan a cada variante, mientras que en la pestaña emergente se elige cual visualizar en el modelo.

Con esto, al importar el modelo en Model Viewer, las variantes asignadas aparecerán en la pestaña de los materiales, lo que nos permite acceder y confirmar que las variantes funcionen correctamente en el Editor. A pesar de esto, siempre se debe pedir a programación estar haciendo pruebas para verificar que funcione todo correctamente con el modelo y sus variantes en AR.

 

Otra opción sería cambiar las texturas en caso de que se vaya a ocupar el mismo modelo pero se quieran crear combinaciones entre sus diferentes mapas. Esto da un mayor número de modificaciones posibles para el modelo, pero la asignación de las texturas en cada opción se hace por código.

https://modelviewer.dev/examples/scenegraph/#swapTexturesExample

Es importante tener en cuenta que estas opciones para cambiar ya sea las texturas o los materiales, solo son visibles y accesibles en el modo de previsualización del modelo. Al pasar a AR se mantiene la última configuración elegida, por lo que es necesario regresar a la previsualización para modificarlo. Los botones  o espacios para las modificaciones se realizan por programación al momento de crear el espacio en WebXR.

Solución de problemas

Un problema que puede surgir es que los modelos salgan en negro cuando se prueban.

La solución es darle refresh a la pagina de model viewer y volver a subir el modelo y realizar los ajustes. La razón es que tiene un bugsillo por ahi y nombra raro el hdri al descargar la carpeta que se sube al servidor. En la imagen adjunta, de lado izquierdo es el nombre que lleva el hdri y no presenta ningún problema y del lado derecho es el nombre que por alguna razón le pone y sí presenta ese problema de negros.

Enlaces de descarga

https://modelviewer.dev/editor/

https://modelviewer.dev/examples/scenegraph/#variants

https://www.khronos.org/blog/streamlining-3d-commerce-with-material-variant-support-in-gltf-assets

Archivos Adjuntos

Comentarios

Es importante no modificar los materiales en Model Viewer ya que los USDZ (extensión necesaria para que funcione el AR en iOS) no van a registrar ese cambio. Debido a eso también, es importante que tanto el glb y el usdz salgan del mismo archivo final para que ambos estén iguales. Así mismo, model viewer jala únicamente el glb por tanto, modificar las texturas una vez descargadas de sketchfab (por ejemplo) no va a afectar al modelo subido, pues el glb y el usdz ya tienen las texturas embebidas.

Cabe destacar que la iluminación no siempre se ve cómo debería en caso de usar algún HDRI en particular. Se recomienda trabajar con el HDRI de default, esto también es debido a que el AR de model viewer sí emula la iluminación percibida por la cámara. Ejemplo: si apuntas la cámara a contraluz, tu modelo se verá oscuro (a contraluz).

En el caso de las sombras, tener cuidado con los objetos animados: dependerá del caso pero puede llegar a pasar que se comporten de manera inesperada las sombras, principalmente si los objetos aparecen/desaparecen.

Tener cuidado con los materiales transparentes: transparencias sobre solidos se comportan bien, sin embargo, transparencias sobre transparencias pueden presentar raros como recortes de geometrías este fenómeno se manifiesta cuando la computadora no sabe qué transparencia renderizar primero, se ha resuelto en otros programas (threeJS, Nunu) asignando un render id, sin embargo Model Viewer no lo permite, por tanto aún no hay solución para este tipo de problema.

Realizar los modelos siempre a escala.

Considerar sacar un archivo USDZ, pues por el momento sigue siendo necesario para la lectura en iOS, aunque Model Viewer no lo pida, puede colocarse en la carpeta una vez descargado. Este archivo puede obtenerse tanto de Substance como de Sketchfab

Ventajas

Erick Jurado