Difference between revisions of "Workshop VR met Aframe"
From Fri3d WIKI 2018
(→Hoe ziet de code er uit ?) |
(→goed om weten) |
||
| Line 29: | Line 29: | ||
=== inspector in A-Frame === | === inspector in A-Frame === | ||
Vanuit een A-Frame voorbeeld kan je naar inspector mode gaan met de toetsen ctrl-alt-i | 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 | + | 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 == | == Enkele voorbeelden == | ||
https://glitch.com/edit/#!/a-frame-normalmapping?path=index.html:2:0 | https://glitch.com/edit/#!/a-frame-normalmapping?path=index.html:2:0 | ||
Latest revision as of 05:46, 22 August 2018
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 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
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
