Workshop VR met Aframe
Contents
Wat is A-Frame ?
- een opensource web framework voor Virtual Reality experiences
- onderhouden door Mozilla en WebVR community
- geen kennis nodig van WebGL
- gebaseerd op html pagina's
- alle info op aframe.io
Op welke toestellen werkt dit ?
op computer
- werkt op Firefox (Mozilla), Google Chrome, Safari, ...
- enkele voorbeelden onderaan op deze pagina
op Smartphone
De meeste iPhones ondersteunen dit (zeker vanuit Firefox) De High-end Android phones (afhankelijk van gyrosensor en GPU) Je kan hier een Google Cardboard voor gebruiken
Hoe ziet de code er uit ?
Zoals HTML. Elke Tag die je opent, dient ook gesloten te worden
<html> <head> <script src="https://aframe.io/releases/0.8.0/aframe.min.js"></script> </head> <body> <a-scene> <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box> <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere> <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane> <a-sky color="#ECECEC"></a-sky> </a-scene> </body> </html>
