Why Do the Assets in the Scene Appear to Be Overlapped or Cropped?

Mastering Layering for a Seamless AR Experience

Aryel
Written by AryelLast update 8 months ago

In Aryel's builder, you may notice that some loaded assets appear to be cropped, overlapped, or not fully visible. This phenomenon is due to the layering of different objects in the same scene.

When assets are loaded, they are stacked in layers. The loading order determines the layering order and thus the display order of the assets. Consequently, the first loaded asset will be placed on the top layer and will have the highest visual priority compared to the subsequently loaded assets.

This layering system can result in the effect of assets being cropped or partially visible. When an asset overlaps with another one already present on the top layer, the overlapping asset may appear not to be fully visible because the top layer takes visual priority.

To properly manage the layers, it is important to consider the loading order of the assets. If you want an asset to be fully visible without being cropped, it is advisable to load it before other assets that may overlap with it. This way, the asset will have the highest visual priority and will be fully visible within the AR experience.

In the following examples, a video has been loaded in two different situations in two different scenes.

In the first scene, since the video was loaded first, even though the background of the video has been made transparent, the space occupied by the transparent pixels covers the underlying image. This occurs because the video has taken the top layer with higher priority, while the image remains in a lower layer.

In the second example, however, the image was loaded first and placed on a higher priority layer, so it will not be cropped despite the presence of the video.

By understanding this layering dynamic, you can achieve a visually consistent and uncropped AR experience. Make sure to properly organize the layers and consider the loading order of the assets to avoid visual inconveniences.

Did this answer your question?