Product demo is here to provide the possibility to see product in greater detail and angles that regular pictures are unable to provide. Further more, see product in real world size.
Customization / color variations are to be experienced in virtual reality for much clearer demonstration of product. Only next to real life visit of store in which this product is sold.

---

Code sample

  <scene-dom id="main-vr-dom"></scene-dom>
  <scene-clock clock-name="rand1" app-fps="100">
    <scene-vr dom-id="renderbox">

      <three-core-group>
        <three-camera-perspective></three-camera-perspective>
        <three-camera-orbit></three-camera-orbit>
        <scene-vr-controller controller-id="0" controller-name="right" armed="false"></scene-vr-controller>
        <scene-vr-controller controller-id="1" controller-name="left" armed="false"></scene-vr-controller>
        <three-raycaster right-index="0" left-index="1"></three-raycaster>
      </three-core-group>

      <three-canvas-group>
        <three-canvas-altmenu dom-id="canvasbox" width="0.3" height="0.4"
          row-location="/vr/vr_assets/icons/altnav/location.png"
          row-hdr="/vr/vr_assets/icons/altnav/world.png"
          row-tools="/vr/vr_assets/icons/altnav/tools.png"
          icon-exit="/vr/vr_assets/icons/navigation/open-door.png" default hires>
        </three-canvas-altmenu>
      </three-canvas-group>

      <three-env-group>
        <three-env-hdr path="/vr/vr_assets/project/product/" name="dome_1k.hdr" exposure="1"></three-env-hdr>
        <three-gltf-marker path="/vr/vr_assets/shared/" name="indicator.glb" dynamic></three-gltf-marker>
        <three-gltf-floor path="/vr/vr_assets/project/product/" name="dome_floor.glb" link="main" thumbnail="/vr/vr_assets/icons/alphabet/a.png" offset="0,0,3" default></three-gltf-floor>
      </three-env-group>

      <three-light-group>
        <three-light-hemi sky-color="#FFFFFF" ground-color="#FFFFFF" intensity="0.5"></three-light-hemi>
        <three-light-spot color="#FFFFFF" offset="0,4,0" intensity="0.8"></three-light-spot>
      </three-light-group>

      <three-mesh-group>
        <three-gltf path="/vr/vr_assets/project/product/" name="dome_MC.glb"></three-gltf>
        <three-gltf path="/vr/vr_assets/project/product/" name="Pedestal_ALT6.glb" offset="0,0.003,0"></three-gltf>
        <three-gltf path="/vr/vr_assets/project/product/" name="tube_lights.glb"></three-gltf>

        <three-group-object offset="0,1.01,0">
          <three-canvas-thumbnail dom-id="canvasbox" width="0.80" height="0.3" hires></three-canvas-thumbnail>
          <three-gltf path="/vr/vr_assets/project/product/version_70/" name="AirJordan70_White.glb" visible="true" thumbnail="/vr/vr_assets/project/product/version_70/AirJordan36_PsychicEnergy_250pix.jpg"></three-gltf>
          <three-gltf path="/vr/vr_assets/project/product/version_70/" name="AirJordan70_BlackPurp.glb" visible="false" thumbnail="/vr/vr_assets/project/product/version_70/AirJordan36_FirstLight_250pix.jpg"></three-gltf>
          <three-gltf path="/vr/vr_assets/project/product/version_70/" name="AirJordan71_Red.glb" visible="false" thumbnail="/vr/vr_assets/project/product/version_70/AirJordan36_RuiHachimure_250pix.jpg"></three-gltf>
        </three-group-object>
      </three-mesh-group>

      <three-mesh-group-gallery path="/vr/vr_assets/project/product/gallery/" name="ImagePlanes_Sketches_mod.glb">
        <three-gltf-ui-group>
          <three-mesh-image link="ImagePlane1" path="/vr/vr_assets/project/product/gallery/" name="SketchA.jpg" ratio="4:3"></three-mesh-image>
        </three-gltf-ui-group>
        <three-gltf-ui-group>
          <three-mesh-image link="ImagePlane2" path="/vr/vr_assets/project/product/gallery/" name="SketchB.jpg" ratio="4:3"></three-mesh-image>
        </three-gltf-ui-group>
        <three-gltf-ui-group>
          <three-mesh-image link="ImagePlane3" path="/vr/vr_assets/project/product/gallery/" name="SketchC.jpg" ratio="4:3"></three-mesh-image>
        </three-gltf-ui-group>
        <three-gltf-ui-group>
          <three-mesh-image link="ImagePlane4" path="/vr/vr_assets/project/product/gallery/" name="SketchD.jpg" ratio="4:3"></three-mesh-image>
        </three-gltf-ui-group>
      </three-mesh-group-gallery>

    </scene-vr>
  </scene-clock>