Customizing VR 360 Player Controls

You can configure several parameters in the skin.json file to customize Ooyala player controls that are used to navigate VR 360 videos. For more information, see Customizing the Player V4 Skin with skin.json and Player V4 JSON Schema.

On-screen Camera Angle Control

The on-screen Camera Angle Control allows the viewer to navigate in VR 360 using a mouse to click on the arrows to direct movement.
You can customize this control using the following settings in skin.json.
{"name":"arrowsBlack", "location": "mainView", "whenDoesNotFit":"keep", "minWidth":45 }
Considerations:
  • This control is available only on desktop browsers (where mouse devices are used). It is disabled on mobile devices (including mobile browsers) and touch-screens, even if it is specified in skin.json. For example, the "arrowsBlack" control, if specified in skin.json, is ignored on mobile platforms and touch screens.
  • If you want to exclude this control from Player V4 web during VR 360 playback, add an override inline to remove this element from the skin.json.

VR 360 Video Navigation Helper

The following message appears briefly upon starting playback and advises the viewer to navigate during VR 360 video by using either a mouse to click and drag it or touch and drag for touchscreens.
Note: This control is available only on desktop browsers (where mouse devices are used). It is disabled on mobile devices (including mobile browsers) and touch-screens, even if it is specified in skin.json.
To show the message and/or icon, specify the following settings in json.config
"isVrAnimationEnabled": {
      "vrNotification": true,
      "vrIcon": false
      }
Both (message and icon) appear with fade in / fade out animation. The length of animation can be managed through the additional settings:
"animationDurations": {
      "vrNotification": 5,
      "vrIcon": 4
      }
To display the VR 360 icons and control, you must specify these settings in the skin.json file. To hide these controls, simply remove these lines from skin.json. Also, if in stereoscopic mode, ads will be displayed, but if the ads are flat, the viewer will not be able to view the VR 360 video properly. Ads are typically flat currently.

Stereoscopic Icon

The Stereoscopic icon allows the viewer to switch between Monoscopic and Stereoscopic modes.
You can customize this control using the following settings in skin.json.
{"name":"stereoscopic", "location":"controlBar", "whenDoesNotFit":"keep", "minWidth":45 }
Considerations:
  • This should be left as disabled if you do not want to allow stereoscopic viewing of the VR 360 content using binocular head-mounted displays (HMDs), such as Google Cardboard.
  • This option is appropriate only for screens that can be used with a binocular head-mounted display. Do not use this toggle option if the viewer will view the VR 360 content with a monocular HMD or on a desktop or mobile device without binocular lenses.
  • The Stereoscopic icon is disabled for Web desktop and for tablets. Even if the "stereoscopic" parameter is specified in skin.json, these controls won’t be visible on Web desktop and for tablets (only appropriate for devices that can be used with head-mounted displays). However, note that this means the user may not realize the content is VR 360. If this icon is disabled, we recommend that the thumbnail make it clear that the video is VR 360.
https://help.ooyala.com/sites/all/libraries/dita/en/video-platform/concepts/pbv4_vr360.html

Was this article helpful?