Cómo añadir productos interactivos en 3D y AR a una web de Shopify

Vectary La inserción web es una forma fácil de añadir un elemento 3D interactivo en tu sitio o blog. El visor 3D/AR de Vectary funciona copiando y pegando un código generado en el editor web. Es el mismo proceso que insertar un vídeo de YouTube. Esta tecnología se conoce como WebAR porque ofrece una experiencia 3D y de Realidad Aumentada en cualquier smartphone, iPhone o Android sin necesidad de una aplicación adicional.

¿Cómo personalizo mi producto en Shopify?

El creador de configuradores de productos 3D de Shopify te permite crear presentaciones de producto interactivas con selectores de material, variaciones de forma, animaciones y puntos de interés. Esto te permite mostrar la gama de productos en un visor 3D en tiempo real sin necesidad de múltiples renders o fotos. Además, puedes actualizar al instante tu oferta de productos sin modificar el código del configurador en tu sitio. Como ventaja adicional, todas las variaciones se pueden previsualizar en Realidad Aumentada a su tamaño real, lo que permite a los  visitantes probar el producto en su propio espacio antes de realizar la compra. Todo esto se puede implementar sin programar en Vectary Studio.

Conecta el configurador de productos de Shopify con el checkout

Un configurador 3D se puede convertir en una calculadora de precios según los parámetros seleccionados en el visor 3D. De este modo, puedes conectar el precio y las variantes seleccionadas con el checkout. Esto se puede conseguir utilizando una capa de la API de Vectary sobre el configurador 3D sin código.

Cómo insertar un configurador 3D interactivo

Cualquier diseñador puede insertar el configurador a modo de escaparate, ya que la plataforma Vectary cuenta con un editor de configuradores sin código. Si quieres conectar el configurador con tu carrito de compra, tendrás que implementar la API de Vectary, lo que podría requerir la ayuda de un desarrollador.

1. Nivel básico: solo la inserción del configurador 3D en Shopify

1. Importa tu modelo 3D en Vectary Studio o crea tu propio modelo desde cero.

2. Crea un configurador 3D interactivo. Puedes encontrar muchos recursos en nuestro canal de YouTube.

3. Haz clic en la pestaña Share, activa la opción de compartir y copia el código.

4. Abre tu panel de administración en Shopify y haz clic en Temas dentro del menú Canales de venta.

5. Ve a tu tema y haz clic en el botón Personalizar .

5. En tu plantilla, haz clic en Añadir sección y selecciona Custom Liquid. Ahora pega el código de Vectary y el visor 3D debería cargarse.

6. Previsualiza tu sitio y publícalo cuando estés satisfecho con el resultado.

7. Puedes ajustar el configurador en cualquier momento en Vectary Studio y sincronizar los cambios con un solo clic en la sección Share.

2. Nivel avanzado: configurador 3D de Shopify conectado con una calculadora de precios y el carrito de compra

Esta función solo está disponible para clientes de Vectary Business a través de la API. Consulta las instrucciones detalladas en la documentación de la API.

Consejo: Activa la previsualización de Realidad Aumentada en Shopify

El visor integrado incluirá automáticamente un icono de AR que puede activar una Realidad aumentada vista previa del producto en cualquier dispositivo sin necesidad de instalar ninguna aplicación.

Preguntas frecuentes‍

¿Ralentiza el sitio web?

Cualquier contenido que añadas al sitio web debe estar optimizado, incluido el visor 3D. Obtén consejos sobre optimización en Documentación. Para conocer todas las soluciones ofrecidas a los clientes de Business y equipos, ponte en contacto con nuestro equipo de ventas.

¿Dónde se aloja el modelo?

El modelo está alojado en la plataforma Vectary, pero el subdominio se puede enmascarar con la función de 'dominio personalizado' disponible en los espacios de trabajo de Business.