Hardware components | ||||||
| × | 1 | ||||
 |
| × | 1 | |||
Software apps and online services | ||||||
| ||||||
| ||||||
| ||||||
Controllers improve experience in Virtual Reality. Leap Motion is a device that can be attached to Virtual Reality Headset to manipulate objects in VR using your hands.
This is an experiment on how you can use Microsoft Mixed Reality headset and LeapMotion. Using the Edge Browser and WebVR, you can actually see your hands in Virtual Reality. The experience is not yet fluid, there's still a delay in WebVR Mode.
VideoCodeThe code is simple, I am using aframe.io:
<!DOCTYPE html>
<html>
<head>
<title>Hello, WebVR! - A-Frame</title>
<meta name="description" content="Hello, WebVR! - A-Frame">
<script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
<script src="//unpkg.com/aframe-leap-hands/dist/aframe-leap-hands.min.js"></script>
</head>
<body>
<a-scene>
<a-box position="-1 0.5 -4" 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-entity camera="near: 0.01" look-controls position="0 1.5 0">
<a-entity leap-hand="hand: left"></a-entity>
<a-entity leap-hand="hand: right"></a-entity>
</a-entity>
</a-scene>
</body>
</html>
Try it out here. To read more about aframe leap motion.
This code also works with Mozilla Firefox browser with Oculus Rift or HTC Vive. I recorded myself inside Mixed Reality Portal with webcam and a browser. I just said 'Cortana, start recording'. then after I'm done, I said 'Cortana, stop recording'.
I did program this in Virtual Reality, it's a little bit tricky since I cannot see my keyboard, I just want to try it out. The cool thing is the Edge Browser, I can do web development in the browser. I can focus on what I'm doing. (Well, I couldn't check and tap my phone while on VR). The camera helped since I can see if someone is behind me (although, it's like developing in front of the mirror).
If this project made you interested in Virtual Reality, WebVR, Aframe, Windows Mixed Reality, Edge Browser, click the 'Respect Project' button and Follow me.
Comments