View source for Workshop VR met Aframe


== 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 [https://aframe.io/ aframe.io]


== Op welke toestellen werkt dit ? ==

=== op computer ===
* werkt op Firefox (Mozilla), Google Chrome, Safari, ...
* enkele voorbeelden onderaan op deze pagina

=== op smartphones ===
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 in HTML: elke tag die je opent, dient ook gesloten te worden

zie [https://glitch.com/edit/#!/aframe?path=index.html:1:0 voorbeeld in Glitch]

== goed om weten ==
=== inspector in A-Frame ===
Vanuit een A-Frame voorbeeld kan je naar inspector mode gaan met de toetsen ctrl-alt-i
Zo kan je makkelijk je VR omgeving controleren alle hoeken (of een object aanpassen en kopiëren via copy entitie in rechter bovenhoek en in je html pagina toevoegen)


=== verplaatsen in VR  met computer===
Met de toetsen WASD  (qwerty) of ZQSD  (azerty) kan je je door een omgeving bewegen.

== Enkele voorbeelden ==

https://glitch.com/edit/#!/a-frame-normalmapping?path=index.html:2:0