Best Video Resolution for WebVR
We have made all video projects you make in the Headjack CMS available for viewing in WebVR. You can add 360 videos to your website with just a couple of lines of code.
Since not all browsers support the WebXR standard as of now and we still need to lock-down on the final compression method, it will still carry a beta label for now, but we think it’s good enough for our clients to work with if they want to experiment with WebVR on their websites.
Currently, we only support a 1080p video file out of the box since this product is still in beta, and we have to pin down on a final resolution and compression/distribution method. See the example below.
Integrate 360 Video into Your Website With Just a Couple Lines of Code
- Navigate to Content > Projects > “project name” or add a new one
- Click “Embed” above the Heatmap Analytics
- Copy the HTML code snippet for integration into your website
HTML Code Example
<iframe width="100%" height="100%" src="https://app.headjack.io/embed/914a73e7f7a" frameborder="0" allowfullscreen allow="gyroscope; accelerometer; xr; vr; fullscreen"></iframe>
It is possible to test higher resolution videos, but please contact support to enable support for that since we have to activate it manually for you.
FFmpeg Encoding Scripts For WebVR:
ffmpeg -i "monoscopic_video.mp4" -c:v libx264 -crf 21 -maxrate 10M -bufsize 15M -vf "scale=1920x1080" -pix_fmt yuv420p -c:a aac -b:a 192k -r 30 -g 60 -keyint_min 60 "monoscopic_output.mp4"