Primeros pasos con PlayCanvas

Para empezar, vaya a https://playcanvas.com/user/the8thwall y bifurque un proyecto de ejemplo:

• Proyectos de muestra del kit de inicio

  • Kit de inicio de seguimiento de imágenes: Una aplicación para empezar a crear rápidamente aplicaciones de seguimiento de imágenes en PlayCanvas.
  • Kit de inicio de seguimiento del mundo: Una aplicación para empezar a crear rápidamente aplicaciones de seguimiento del mundo en PlayCanvas.
  • Kit de inicio de efectos faciales: Una aplicación para empezar a crear rápidamente aplicaciones de Efectos Faciales en PlayCanvas.
  • Kit de inicio de Efectos Cielo: Una aplicación para empezar a crear rápidamente aplicaciones de Efectos Cielo en PlayCanvas.
  • Kit de inicio de seguimiento de manos: Una aplicación para empezar a crear rápidamente aplicaciones de Seguimiento de Manos en PlayCanvas.

• Ejemplos de proyectos adicionales

  • Seguimiento global y Efectos faciales: Un ejemplo que ilustra cómo cambiar entre Seguimiento del mundo y Efectos faciales en un mismo proyecto.
  • Cambio de color: Una aplicación para empezar a crear rápidamente aplicaciones de seguimiento del mundo de RA que incluyan una interfaz de usuario sencilla y cambio de color.
  • Intercambiar Escenas: Una aplicación para empezar a crear rápidamente aplicaciones de Seguimiento del Mundo de RA que cambian de escena.
  • Cambiar de Cámara: Una aplicación que demuestra cómo cambiar entre los Efectos Faciales de la cámara frontal y el Seguimiento Mundial de la cámara trasera.

Añadir su App Key

Vaya a Configuración -> Scripts externos

Hay que añadir los dos guiones siguientes:

• https://cdn.8thwall.com/web/xrextras/xrextras.js
• https://apps.8thwall.com/xrweb?appKey=XXXXXX

A continuación, sustituya XXXXXX por su propia App Key exclusiva obtenida de la Consola de 8th Wall.

Activar "Lienzo transparente"

1. Vaya a Ajustes -> Renderizado.
2. Asegúrese de que la opción "Lienzo transparente" está marcada.

Desactive "Preferir WebGL 2.00".

1. Vaya a Ajustes -> Renderizado.
2. Asegúraese de que la opción "Prefer WebGL 2.00" está desmarcada.

Añada xrcontroller.js

Los proyectos PlayCanvas de muestra de 8th Wall se rellenan con un objeto de juego XRController. Si empieza con un proyecto en blanco, descargue xrcontroller.js de https://www.github.com/8thwall/web/tree/master/gettingstarted/playcanvas/scripts/ y adjúntelo a una Entidad de su escena.

NOTA: Solo para proyectos SLAM y/o Objetivo Imagen. xrcontroller.js y facecontroller.js o layerscontroller.js no pueden utilizarse simultáneamente.

Opción	Descripción
disableWorldTracking	Si es verdadero, desactive el seguimiento SLAM por eficiencia.
shadowmaterial	Material que quiere utilizar como receptor de sombras transparentes (por ejemplo, para las sombras del suelo). Normalmente este material se utilizará en una entidad plana "tierra" situada en (0,0,0)

Añadir layerscontroller.js

Los proyectos PlayCanvas de muestra de 8th Wall se rellenan con un objeto de juego FaceController. Si empieza con un proyecto en blanco, descargue layerscontroller.js de https://www.github.com/8thwall/web/tree/master/gettingstarted/playcanvas/scripts/ y adjúntelo a una Entidad de su escena.

NOTA: Solo para proyectos de Efectos Cielo. layerscontroller.js y facecontroller.js o xrcontroller.js no pueden utilizarse simultáneamente.

Añadir facecontroller.js

Los proyectos PlayCanvas de muestra de 8th Wall se rellenan con un objeto de juego FaceController. Si empieza con un proyecto en blanco, descargue facecontroller.js de https://www.github.com/8thwall/web/tree/master/gettingstarted/playcanvas/scripts/ y adjúntelo a una Entidad de su escena.

NOTA: Solo para proyectos de Efectos Faciales. facecontroller.js y xrcontroller.js o layerscontroller.js o handcontroller.js no pueden utilizarse simultáneamente.

Opción	Descripción
headAnchor	La entidad para anclar a la raíz de la cabeza en el espacio del mundo.

Añadir handcontroller.js

Los proyectos PlayCanvas de muestra de 8th Wall se rellenan con un objeto de juego HandController. Si empieza con un proyecto en blanco, descarga handcontroller.js de https://www.github.com/8thwall/web/tree/master/gettingstarted/playcanvas/scripts/ y adjúntelo a una Entidad de su escena.

NOTA: Solo para proyectos de Seguimiento Manual. handcontroller.js y xrcontroller.js o layerscontroller.js o facecontroller.js no pueden utilizarse simultáneamente.

Opción	Descripción
handAnchor	La entidad para anclar a la raíz de la mano en el espacio del mundo.