Creating WebVR experience using Unity

March 4, 2018, 4:11 p.m. By: Pranjal Kumar

WebVR Unity3d

It was only a few months back that creating a WebVR experience using Unity was not possible. But, companies like Mozilla is focusing on providing such facility. Mozilla recently released a WebVR exporter for Unity. It’s a plugin for Unity which the users can import. It hacks the WebGL exporter which allows the user to export a WebVR page.

So, how to export a WebVR project from inside Unity? Let’s get into the detail of that-

  1. Create your 3D Unity project and set the platform as WebGL.

  2. Import “Unity WebVR Export” plugin from Mozilla.

  3. The first way of importing the plugin is downloading the unity exporter package directly from the GitHub repository. After downloading, you can easily import it into your project. One of the limitations of using this method is that you will have to set everything on your own. So, it is best to avoid this method if you are trying it for the first time. The GitHub link for the same - GitHub

  4. You can also open the asset store and search for WebVR assets package. Mozilla released the complete package but you should careful while using this method as it would alter your project settings.

  5. Remove your default camera and replace it with a WebVR camera prefab to which you have to attach the models of the two hands. Remember you should not use SteamVR or Oculus controller prefab.

  6. The provided basic hands will just move and rotate. So, you would have any animation or controlling schema. Mozilla won’t provide you interactions but will hint you on how you can get them. It means that you have to hardcode everything starting from the very basic movement. You can use standard input classes and queries for the same.

  7. After compilation, you will have an HTML file plus lots of other files which might seem odd at first glance. You can also deploy the solution on a server for allowing users across the world to access it. To enhance your output, Mozilla also has a page dedicated to giving you suggestions on how you can optimize your results.

  8. Just put the link to the HTML file in the build directory inside a WebVR-capable browser like Mozilla or Chrome.

The solution is just a basic way to import WebVR experience using Unity. Yes, you will not access for lots of features of the other VR SDKs but certainly is a good way to create WebVR experiences without learning anything new.

Unity/WebVR Demo

Video Source: Mozilla Hacks