2. WEB VR 1.0
Realidad virtual en el browser
Aplicación de plataforma cruzada, ahora
se puede acceder por el HTC Vive
Uncharted territorio, todo es un
experimento
Hemos estado aquí antes
3. Making and Using WebVR
A-Frame 0.4.0 (WebGL, Three.js, VRML)
HTC Vive
Altspace, High Fidelity, Janus
Unity Web Player
Youtube 360
etc..
4. A-Frame
A-Frame es un framework de código abierto para crear experiencias en 3D y
realidad virtual en la web. Fue construido por el equipo de MozVR para prototipo
más rápidamente las experiencias de WebVR.
A-Frame es una abstracción arriba de three.js, y con A-Frame componentes (no
confundir con los componentes Web), podemos hacer casi cualquier cosa
three.js puede.
5. A-Frame + D3.js
D3 le permitirá enlazar datos arbitrarios y manipular cualquier cosa en la
<a-scene> a través del DOM.
7. Props
Reúna materiales en 2D y 3D para su escena.
También puede utilizar sonido y vídeo o
manipular la escena con datos en vivo!
sketchfab.com/models
Script
Github: Download Boilerplate -or- añadir:
<script src="https://aframe.io/releases/0.4.0/aframe.min.js"></script>
8. Escenas!
Para comenzar una escena en A-Frame primero tiene que abrir una a-scene tag
<body>
<a-scene>
Construye tu mundo aquí ...
</a-scene>
</body>
13. Assets:
Las experiencias 3D tradicionalmente
preload muchos de sus activos, como
modelos o texturas, antes de representar
sus escenas. Esto asegura que los activos no
falten visualmente, y esto es beneficioso
para el rendimiento para garantizar que las
escenas no intenten obtener recursos
durante la renderización. A-Frame tiene un
sistema de gestión de activos que nos
permite colocar todos nuestros activos en
un solo lugar y precargar y almacenar en
caché activos para un mejor rendimiento.
16. Entidades:
Una entidad es un objeto de marcador de posición vacío que por sí mismo no hace nada. Conectamos
componentes reutilizables para adjuntar aspecto, comportamiento y funcionalidad. Y podemos mezclar
y combinar diferentes componentes y configurarlos para definir diferentes tipos de objetos.
21. Componentes:
Un componente es un conjunto de datos reutilizables y modulares que se
conectan a una entidad para agregar apariencia, comportamiento y
funcionalidad
EX.
<a-entity light="type: point; color: crimson; intensity: 2.5"></a-entity>
<a-entity obj-model="material: metallic; color: crimson; intensity: 2.5"></a-entity>
26. Preparar
Download Chromium
Habilitar WebVR y los indicadores del controlador ‘flags’
De forma predeterminada, si está utilizando la última versión de A-Frame, un HTC
Vive puede acceder a su sitio.
<a-entity vive-controls="hand: left"></a-entity>
<a-entity vive-controls="hand: right"></a-entity>
