index file template

States interactions module

Interactions are made with the ‘interactions’ module, by switching between ‘states’ of the composition.

A state is made of actions, buttons can be added to it.

When a scene switches to a new state, all actions from the state are applied.
The default state is applied when the web AR image marker is tracked by the camera for the first time.

There are many different actions, such as:
hide / show an object, play an animation, play a sound effect, change a color or set a timer to switch to another state after a fixed amount of time.

States actions

  • Play model animation
    Play an animation from a model that contains animations. At the end of the animation playback, you can choose to switch to another state.
  • Pause model animations
    Pause all the animations from the selected model
  • Play basic animation
    Animate a mesh from a model with a simple animation: scale up/down, pulse, rotate clockwise, rotate anticlockwise
  • Stop basic animation
    Stop all basic animation on the selected mesh
  • Play audio
    Play an audio file from the assets library
  • Stop audio
    Stop the playback of an audio file
  • Play video
    Play a video from the composition
  • Pause a video
    Pause the selected video from the composition
  • Stop a video
    Stop the selected video from the composition
  • Show composition item
    Unhide the selected items from the composition
  • Hide composition item
    Hide the selected items from the composition
  • Show model meshes
    Unhide the selected meshes from the composition
  • Hide model meshes
    Hide the selected meshes from the composition
  • Display text in the footer
    Display a short text at the bottom of the screen
  • Timer
    Set an timer alarm, when the alarm is triggered, you can switch to another state
  • Set material
    Apply the selected material on the selected mesh
  • Set material color
    Change the color of the selected material

States buttons

Buttons can be used to switch between states, or trigger an action (play sound effects, start a phone call, display a pop-up with text & image, open a webpage… )

To add a button to a state, first create a button, then add it to one or multiple states

Tutorial

You can follow this step by step tutorial to practice using the states interactions module

Web activity statistics

With this Screen you can find all statistics about views and interactions with your project in Publish settings > Statistics.

The First Row is displaying the views by date. You can know if it’s on AR, VR or embed mode views.

The Total Actions section tells you about specific data for your experience: time, views, sessions and the average sessions time.

Action & events column is for interactions with events and possible interactions in your experience like taking photo, switch to a state, and more advanced like the number of states switches.

And the cities sections is for where your experiences were viewed geographicaly, and the number of time filtered by cities.

All this data can be filtered with the option at the bottom, by year, by month or by date interval.

White label branding

To remove XR.+ branding visual elements, check this list (business plan only):

In your project:

  • Use a custom AR tracking image (marker)
  • Embed the project from an external website
  • On the ‘screens’ tab, tick the Skip the ‘This is an augmented reality experience for mobile’ screen option
  • Create an AR player and assign it to your project

In your AR player:

  • Set a custom logo
  • Customize the loading screens
  • Customize the about screen
  • Customize the AR help screen

Publishing on an external website

Business users can load projects inside an external web domain within an iframe, like when adding a Youtube video player on a web page.
We provide a template to do so, no coding to do, just upload the .html file to your server.

Note: an SSL certificate (https:// …) on your web domain is required to embed projects.

Example of embed project

Optimization

It is very important to optimize your projects!
Try to keep your project total size (images + models + audio files + video files) under 10Mb, or even 5Mb.

On your 3D models, do not use oversized textures, and delete all faces that are hidden.


Short loading times and a smooth framerate always make an experience more pleasant for the end user…

Loading time estimation

Above the 3D composition view, you can see an estimation of the time required to load your project, considering the mobile network speed.

Project meta data

When you share an XR+ web AR project on social medias or messaging application, a preview of the experience is displayed, here’s an example with a tweet:

The data pulled to populate tweets or other social media shared experiences consist of:

  • An image
  • A title
  • A short description

The image used is your project cover, so make sure it’s looking great!

The title and the description can be edited in the studio in ‘Publish settings’ > ‘Project meta data’.

Tips & Tricks

Did you know?

  • For more comfortable sessions in the studio, you can switch to full screen with the ‘full screen’ button in the top navigation bar
  • You can rename materials by double clicking on their names in the materials list
  • You can use the keyboard arrows to navigate in the composition 3D view