How to display the front-end interface of PC in VR mode

Tagged: UI display in VR mode

This topic has 6 replies, 3 voices, and was last updated 9 months, 3 weeks ago by as421465683.

Viewing 7 posts - 1 through 7 (of 7 total)

Author

Posts
2024-01-22 at 5:00 am #69867

as421465683
Participant

Currently, there is no front-end HTML interface in VR mode. Our project has a large amount of dynamically loaded front-end page data on the PC side, and needs interaction, as a result, we ran into the confusion that front-end interfaces couldn’t be used in VR. The official front-end page rendering to 3D cases is also not available in VR mode. Whether can provide the interactive interface solution under the VR mode;

2024-01-22 at 5:44 am #69868

kdv
Participant

You’ll have to create a special UI for VR based on 3D objects.

Something like this

Puzzles and JS coding. Fast and expensive.

If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of the meaning at all.

2024-01-22 at 7:19 am #69871

as421465683
Participant

We have already developed a large number of UI interaction interfaces on the PC side, and I am wondering how to quickly port these PC-based interaction interfaces to be compatible with VR mode. Are there specific steps for solving this? For example, ‘Is it possible to support interaction with 3D web interfaces in VR mode under this condition?

2024-01-22 at 7:26 am #69872

as421465683
Participant

The image below is your official VR case study. After conducting VR tests, we found that the UI under the webpage cannot be properly displayed in VR. If we want it to display correctly and be operable, how would you achieve this? Do you have any relevant case studies?

Attachments:
You must be logged in to view attached files.

2024-01-22 at 8:14 am #69874

Yuri Kovelenov
Staff

Hi as421465683,

Unfortunately the Web VR technology is not compatible with HTML markups. The only way to go is to use 3D objects positioned in the 3D scene. The above image by kdv shows this approach. Also check out another demo of ours called Virtual Reality for an implementation example.

Chief 3D Verger | LinkedIn | Twitter

2024-01-22 at 8:27 am #69876

kdv
Participant

Also you can use HTMLMesh objects to render HTML elements in VR
https://threejs.org/examples/?q=vr#webxr_vr_sandbox
But in any case it will be 3D objects in the scene (and they can be parented to the scene’s camera to be always in front of you). No HTML elements, no quick porting.

Puzzles and JS coding. Fast and expensive.

If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of the meaning at all.

2024-01-30 at 1:09 am #70019

as421465683
Participant

We found a more acceptable scheme, back to share, we will front-end div the whole page program to create a dynamic canvas, jigsaw to obtain front-end canvas variables, and then in the custom platform to receive variables and go through multiple groups of canvas, dynamic canvas values to the model material and display; Interaction is to click on the model, obtain the model ID and pass the value to the front-end dynamic update canvas, to achieve the same effect as the front-end interaction;
Author

Posts