Saturday, January 26, 2019

VIRTUAL REALITY: MY FIRST HANDS-ON EXPERIENCE & TAKEWAYS WITH WEBVR

It didn't take so long for me to find the first tech event I attended this year on thanks to Eventbrite. As soon as I saw VR, I just could not think twice, it just had to be it and as expected, I wasn't disappointed.

The Virtual Reality Workshop was hosted by Mr Fabien Benetou, a VR specialist from Mozilla, through UNICEF and MEST  (Meltwater Entrepreneurial School of Technology) Africa at the MEST Incubator in Accra, Ghana yesterday (25th of Jan, 2019).

Fabien did a lot throughout the 3-hour interactive program. He started well with a brief history of virtual reality, then into WebVR (the main focus) and quickly introduced us to A-Frame, a web framework for building virtual reality experiences using HTML. He explained a few terms, the primitives and entity-components from docs in so that almost everyone present was able to write something, including those without prior HTML and Javascript knowledge.

My code is at the end but you can view my site live here: https://comfortable-freighter.glitch.me/

To properly view the site in VR, you'll need a VR Headset. Depending on your wallet, you can get the in-built headset, the VR box or the cardboard headset (most affordable)  which requires you to use your phone like most of us did during the workshop. 

When I toggled the VR mode on my site and locked the phone in cardboard, couldn't see the objects, so I removed, refreshed the page and re-inserted phone back so many times and while still viewing an empty screen, Fabien yelled, "Turn around" and when I did, I saw those 3D objects and they were so cool!. I played around with the code and figured how to position and add new objects and I really enjoyed it. I felt like I've discovered some missing part of my life and I'm definitely not going to end here. 

He showed us what he claimed to be his favourite project named Supercraft. It was mind-blowing. It's a site that allows you to build webVR with your hands!. Although we didn't try it because it was buggy at that time, he promised to send me the link to access it and give him feedback when I contact him (will do a full review when I do).



3D objects have a file format of "glTF" and can be imported into webVR HTML files and would work perfectly according to him. We were also introduced to a VR viewer app by the Mozilla team,  WebXR viewer, augmented reality and virtual reality application that lets you navigate to XR experiences just like websites.

Using the startup files from A-Frame, This was the code I wrote  and  the link to the site :



The workshop was very worthwhile and I enjoyed every single moment there; Fabien's jokes, and all I learned. A very big thanks to Fabien and his team, Mozilla, UNICEF and MEST Africa for making this happen. It was such a wonderful experience and I'm looking forward to more similar events soon. 

My advice to anyone reading this is; never overlook nor underrate Virtual Reality because it is very powerful and the future. Take opportunities and time to study it, attend nearby events when you can you will reap the results soon enough. 

Thanks for reading! If you liked it, share it!


More