Rather than creating complex scenes and geometry within your scene. You have an option to pre-render your surrounding into a HDR (High Dynamic Range) image. Images can also act as sources of light and reflections for the scene. This is fairly simple component allowing user to customize their background should they choose to use it. There are other component that provide just color option within our solution.
It is important to mention that by using pre-rendered surroundings. User will always be in the center of this infinite sphere and thus there is lack of parallax effect allowing users easier ability to orient in them self in space. So with that in mind the better solution is combination of HDR background and textured polygons surrounding user in various distances to provide missing parallax effect.
Menus
Left squeeze – Options / Exit menu
Right trigger – Next location
Right trigger + squeeze – Confirm new location
Code sample
--- Header ---
<link rel="stylesheet" href="/vr/vr_css/styles.css">
<script type="module" src="/vr/vr_build/dopevr-core.esm.js"></script>
<script nomodule src="/vr/vr_build/dopevr-core.js"></script>
--- Body ---
<scene-dom id="main-vr-dom"></scene-dom>
<scene-clock clock-name="rand1" app-fps="100">
<scene-vr dom-id="renderbox">
...
<three-env-group>
<three-env-hdr path="/vr/vr_assets/tech-demo/hdr/" name="canary_wharf_Dresdin_Comp_4k.hdr"></three-env-hdr>
...
</three-env-group>
...
</scene-vr>
</scene-clock>