VR Starter Kit causing eyestrain

I have been trying out the VR start kit on cardboard devices and most people I test it on are experiencing eye strain. Something appears to be off on the rendering. I have hand-coded some demos using threejs and those appear to be ok. Any idea’s what might be causing the eye strain?

Which Cardboard devices are you using? Version 2?

Do your three.js demos apply a barrel distortion effect when rendering?

I’m in the process of updating our WebVR plugin to the latest webvr-polyfill which applies the barrel distortion for Cardboard V2. I should have a build ready tomorrow.

(Also it will support the Chrome VR builds)

I am running with cardboard version 1 and 2. I am using an iPhone6+ as device so it could be the dimensions of the unit that might be causing issues. I checked the support for webvr on mobile and it looks like it’s still very early days so it’s probably going to take some time for it to settle.

My biggest interest is getting the Vive up and running with PlayCanvas. I believe once that happens after a few demos I will be able to convince the business I work for to get an organisation licence. The cardboard is more of a fallback.

So, I’ve updated the WebVR plugin to use the 1.0 spec. Get the latest code here: https://github.com/playcanvas/webvr

You should just be able to drop in the input_hmd.js and vr_camera.js files over the ones in the starter kit.

I’ve tested on Oculus and Mobile and it works great. Haven’t managed to get the Vive up and running yet, but it should all work there too.

I’ve not done enough testing to properly update the starter kit but it should be ok for you to copy into your project.

Let me know how you get on.

It works! Room scale VR on the HTC Vive!

Thank you , you made my day :slight_smile:

Do you have any plans to add the support for the controllers?

UPDATE: Just noticed an issue with the sound. In my threeJS demos the sound outputs through the HTC Vives audio out but it’s not working in this build.

just spotted another issue,
after exiting the game the HMD switch to the steam VR Background (even though steam VR or Steam is not active??). Attempts to run it again result is a second of the game followed by blackness.

I think controllers are provided by the regular Gamepad API which are available as app.gamepads

The PlayCanvas sound system just uses regular Web Audio API so shouldn’t be anything special. One thing to look out for is that if your sounds are set to be positional then they are positioned in 3D space and rely on the position of an audiolistener component to be heard. If you don’t have an audiolistener then it defaults to the origin (0,0,0).

A quick test is to change any sound components to be non-positional.

I’ll check out the blackness issue tomorrow. It’s possible I’m not correctly resetting things after exiting VR. Just to be clear are you talking about exiting VR and re-entering (e.g. calls to enterVr, leaveVr) whilst the Chrome tab remains open?

Or do you mean that you quit the tab and reload the page and it doesn’t work?

I will try the sound later. I know it was working on cardboard so i guess i just expected it to work on the vive.

For the black hmd issue its when closing the tab and then playing again. It works fine if you completely restart the browser .

Turning off positional had no effect .

Ps. Cardboard is broken by the looks of it, will not go into vr mode.

Tried a couple more things. Added the sound to the camera as non positional. Added the sound to the camera as positional but also added an audio listener. Added the sound to an entity as positional and non positional. No effect. It does appear that the new code has both disrupted the sound and the cardboard functionality (at least on IOS not sure about android).

EDIT: Just tried it at work as well on a desktop computer. Seems ok on that one. So it seems like the sound is working but not outputting to the vive headsets audio out. I should be able to test if this is the case by wiring up a speaker to my Vive pc when I get in tonight. My guess is that it will play through the speakers and not through the headset.

Just been testing audio.

It seems to work as expected on the desktop and mobile (Android) here: http://playcanv.as/b/nH6jQZSb/

I shall test on iOS as soon as I’ve charged the iPad :slight_smile:

If you have it working on one device then my guess is it is working correctly but there may be an issue with the hardware setup? As this is the browser, we don’t have any control beyond “playing sound”.

The HTC vive has it’s own audio out. The web audio api has the ability to enumerate outputs and set the output device. Perhaps it a question of scanning for the device and setting it for output. I am quickly getting out of my depth here.

I will do the test tonight to see if the audio is coming out of the speakers and not out of the vive , that should clarify the point a little hopefully.

It looks like there is a draft spec for selecting the output device: https://www.w3.org/TR/audio-output/ But I don’t think any browsers have implemented it yet.

As far as I can see, the browser can only output to the system default audio output.

Hi Dave,
It has definitely been implemented, here is my code in threeJS which plays audio through the Vive

//lets try some audio

			// instantiate a listener
			var audioListener = new THREE.AudioListener();

			// add the listener to the camera
			camera.add( audioListener );

			// instantiate audio object
			var oceanAmbientSound = new THREE.Audio( audioListener );

			// add the audio object to the scene
			scene.add( oceanAmbientSound );

			// instantiate a loader
			var loader = new THREE.AudioLoader();

			// load a resource
				// resource URL
				// Function when resource is loaded
				function ( audioBuffer ) {
					// set the audio object buffer to the loaded object
					oceanAmbientSound.setBuffer( audioBuffer );

					// play the audio
					oceanAmbientSound.source.loop = true;
				// Function called when download progresses
				function ( xhr ) {
					console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
				// Function called when download errors
				function ( xhr ) {
					console.log( 'An error happened' );

Ok after further testing discovered that the sound as far as I can tell is not coming out of any audio device.

This may be connected but in the example ThreeJS code above only after you click the Enter VR button does the audio output on the Vive kick in.

Hi Dave,
I have opened an issue on GitHub for this as it appears to be more significant a problem than i first thought. It looks like playcanvas audio system might be broken in chrome experimental.