Saltar al contenido principal

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

  • 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ónDescripción
disableWorldTrackingSi es verdadero, desactive el seguimiento SLAM por eficiencia.
shadowmaterialMaterial 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ónDescripción
headAnchorLa 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ónDescripción
handAnchorLa entidad para anclar a la raíz de la mano en el espacio del mundo.