Augmented Reality (WebAR)

Overview

The current Augmented Reality (AR) functionality leverages native AR frameworks available on mobile devices - specifically ARCore for Android and ARKit for iOS. It is supported on compatible Android and iOS devices and launches directly via built-in AR applications, eliminating the need to download additional apps.

This implementation supports animations, although with some restrictions. It currently does not support interactions or UI elements within the AR environment.

Development efforts are actively focused on WebXR (beta), which is currently accessible in beta. WebXR aims to provide a complete AR experience, including interactive UI, advanced materials, realistic lighting, and interactive elements identical to those in the Studio.

How to add AR (+ QR code)

To add AR to a project:

1. Enable the AR feature using the right-hand panel.

2. A configuration window will appear, initiating the generation of two files (GLB for Android and USDZ for iOS).

3. Once file generation is complete, green checkmarks will indicate successful creation.

Now you can open the preview mode to confirm the AR icon has been successfully added to the project. This AR icon activates the AR experience automatically on mobile devices or displays a QR code for desktop users to scan.

Entry into AR mode can also be configured differently — through interaction with any 3D object or UI element. To do this, create an interaction in Interact mode using a trigger and AR action.

Settings

Updating settings for AR

After modifying AR settings, make sure to update the entire project via the Share settings.

Source

1 - to generate/update AR files

2 - indicates the project has been successfully generated

3 - for uploading a file directly into AR, ignoring current scene content

4 - specify object or selection to generate for AR (other objects will be ignored) GLB file for Android USDZ file for iOS

Trigger

5 - show or hide the AR icon

6 - select the corner position for the AR icon

7 - padding: define the spacing for the AR icon

8 - width: set the size of the AR icon

9 - upload a custom image for the AR icon (PNG or JPG) Entry into AR experience can be triggered by any 3D object or UI element using the AR action.

Behavior

10 - define units of measurement for generated AR files

11 - activate to allow object scaling within the AR experience

12 - if activated, modified project configurations automatically apply to AR

13 - select language displayed below the QR code (auto selects based on user's language settings)

Show current configuration

This function is enabled by default in AR settings, allowing AR files to automatically update when the end user makes changes in the configurator. If the end user modifies an object's color or configuration, activating AR will automatically generate a new file reflecting the user's selections.

Please note that this feature does not function in Preview mode. To test its functionality, the project must be shared and opened separately via the provided link.

Animations

The current AR implementation supports animation, but with some restrictions due to the inherent limitations of ARCore and ARKit:

• Only animations from the first tab in the Animate mode will play in AR (keyframes from other tabs can be moved to the first tab)

• Animations in AR always play in repeat mode

• Animations cannot be stopped

• Animation playback begins even before the object is placed in the real world

Materials

• Not all materials are supported in AR.

• Some materials may appear differently on Android and iOS devices.

• Supported materials include:

  1. All basic properties (Color, Roughness, Metalness, Opacity, Emission, Normal map) and their textures

  2. Refraction

  3. To ensure correct display of textures such as Ambient Occlusion and Lightmap, use the Texture Remapping feature, which converts these textures into supported textures.

Tutorials