I’ve always been interested in virtual reality. A technological daydream that can be experienced while awake; escaping to a different place without actually traveling.
Sure, I’ve played games, even coded a few of my own. However, that’s not why I love experimenting in VR. I think it is just because I really enjoy creating.
So when I learned about A-Frame back in March 2017, at an SFHTML5 meetup, I decided I needed to get moving fast on this browser based technology which allows for VR. …
I would like to tell you about one of the things I’m the most proud of as an app developer and why I consider my app one of the most useful and successful apps out there.
The app started off as an idea to help a good friend who was hospitalized and lost the use of his voice due to a medical condition. To help him I developed an app which used computer speech synthesis to speak for him when he touched software buttons on his iPad.
At first my friends hands where so shaky and weak that he missed touching many of the buttons necessary to speak. So I made the buttons bigger and placed them in areas separated enough from each other to reduce most input errors. Also, I considered what situations he might need to speak in, different conversational settings, hospital, home, shopping and on the go. …
Important Code Update:
I wrote a previous article in which I described where to begin with VR in a browser. This took the popular A-Frame Hello World and extended it a bit, with environment and the ability to move around in that environment with the VR controllers, teleport, etc.
PLEASE NOTE: Some of my older code included parameters for specific types of controllers, HTC Vive, Windows Mixed Reality (WMR) and Oculus Touch.
tracked-controls vive-controls="hand: left" oculus-touch-controls="hand: left" windows-motion-controls="hand: left"
These are no longer necessary. Remove them. Tracked-controls is redundant and the other controller types are included already in hand-controls. I will be updating my code examples shortly, when time allows.
Until then, you can find out more here:
Problem is with all the VR headsets out there it is hard to write code that works for everyone’s hand controllers. In Android that would be called fragmentation.
So here is what works for me:
<!-- nav-mesh: protecting us from running thru things -->
<a-entity id="navmesh-Hello" gltf-model="assets/gltf/AdvHelloWorldnavmesh.gltf" visible="false" nav-mesh=""></a-entity><!-- Basic movement and teleportation -->
<a-entity id="cameraRig" movement-controls="constrainToNavMesh: true;" navigator="cameraRig: #cameraRig; cameraHead: #head; collisionEntities: .collision; ignoreEntities: .clickable" position="0 0 0" rotation="0 0 0">
<!-- camera -->
<a-entity id="head" camera="active: true" position="0 1.6 0" look-controls="pointerLockEnabled: true; reverseMouseDrag: true" ></a-entity>
<!-- Left Controller -->
<a-entity id="leftHand" hand-controls="hand: left; handModelStyle: lowPoly; color: #15ACCF" teleport-controls="cameraRig: #cameraRig; teleportOrigin: #head; button: trigger; curveShootingSpeed: 18; landingMaxAngle: 60" visible="true"></a-entity>
<!-- Right Controller -->
<a-entity id="rightHand" hand-controls="hand: right; handModelStyle: lowPoly; color: #15ACCF" laser-controls raycaster="showLine: true; far: 10; interval: 0; objects: .clickable, a-link;" line="color: #7cfc00; opacity: 0.5" …
Happy Holidays All!
I wanted to give you an A-Frame Seasonal VR card experience.
<title>Hello World A-Frame</title>
<meta name="description" content="Hello World, WebXR! in A-Frame">
<a-scene background="color: #FAFAFA">
<a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9" shadow></a-box>
<a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E" shadow></a-sphere>
<a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D" shadow></a-cylinder>
<a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4" shadow></a-plane>
So what does A-Frame give us to begin with? The Hello World example. Well that’s cool, but I want more. Like an environment around the geometric shapes and the ability to move around in VR. …
What are you talking about? How can your code last for a thousand years?
Well let me explain, or better yet, let these videos explain . . .
“*Arctic Code Vault Contributor” if you see this message on your GitHub account overview page, then you are a contributor as well. You should be proud, because it not only acknowledges your contribution to Open Source Software, which should be enough in itself, but it says if civilization fails, you’ll be there posthumously to help in the recovery!
Now here is an even wilder thought . . . Imagine a time in the future in which AI has progressed to the point of AGI (Artificial General Intelligence), let’s assume not the Terminator kind. That AI might read millions of GitHub repositories to get examples for writing it’s own code. Assuming that AI is helping humanity, that again would be a contribution. …