Hover Menu on Skybox in Unity

1
votes

I have a question about a VR/AR-interaction I would like to create.

I want to have an image that acts as a skybox to give an aerial perspective on a landscape and allow users to hover over a part of the image to show a small panel with a description of the object they are looking at.

For example, if I have a skybox of a cityscape and wanted to allow users to hover over a building and have a popup interaction displaying the name of the building, what would be the best strategy to do this?

I have the skybox created but have run into perspective issues when trying to add a button over a specific object.

Is this possible with this approach or would I need a textured landscape?

1
unity3dgear-vr

1 Answers

2
votes

We usually use billboards (images that always face the camera) to create hotspots on top of either cubic or spherical skyboxes. This is illustrated here in our cardboard demo app

Often to place items like info text or popups, I just:

  • parent the content to an empty GameObject
  • offset the content to the desired distance (along the z axis)
  • rotate the parent to position the content where it needs to appear

On GearVR, since the user/camera is always in the center the above is like having a billboard.

The hotspots/buttons have a collider attached and you can shoot a ray, on Late Update, with the camera position & rotation to determine if the user is hovering (looking at) a given hotpot. Two helpful classes to get you started are Camera ScreenPointToRay and Physics.RayCast

To do precise cutouts of content in a skybox (like highlighting a specific building) we usually use a cubemap based skybox and do the masking/post-processing in Photoshop. Then we layer the images top of the corresponding background skybox panel in unity and turn them on/off as needed. To simplify lining things up in Unity, I usually use a "custom skybox" which is basically 6 quads facing in.

hth.