As a result of the coronavirus (COVID-19) outbreak, we have a reduced capacity to review effects and delays in publishing are expected. Learn more.

Navigating the Spark AR Studio Interface

In this guide we'll take a look at the different parts of the Spark AR Studio interface.

Learn about the:

  • Viewport - the area in the center of Spark AR Studio, where you can visualize your effect.
  • Simulator - which shows how your effect would look on a mobile device.
  • Scene panel - where you'll control which objects are in your effect.
  • Assets panel - where you can add and view all the assets you've added to a project.
  • Inspector - use this to view and edit the properties of elements in your scene.
  • Toolbar and Menu bar - for quickly accessing all kinds of different features.
  • The Layers panel - where you can add and edit layers.
  • Patch Editor and scripting Console - where you can add more complexity to your effects using visual programming or scripting.

The Viewport

This is the middle section of the Spark AR Studio interface. You can see and work with the effect you're building here.

When the Camera is selected in the menu on the left of the screen, blue lines will appear. These lines show where the camera is pointing and which objects are in view of the camera.

In the example above, the pink diamond is a child of the Camera in the Scene panel. It won't be visible on the screen of the device, because its position is outside the blue lines of the camera.

When an object is listed underneath the Camera in the Scene panel, it will move with these blue lines - because it's in camera space. You can test this out by clicking and dragging your mouse in the Simulator.

When an object isn't listed under the camera, it's in what's known as 'world space'. It won't move with these lines, and can be placed in a fixed position in the world. Read more about world effects.

At the top of the Viewport are the Manipulators. Use them to quickly change your object's:

  • Position - to choose where your object is placed within your scene.
  • Scale - to make your object appear bigger or smaller.
  • Rotation - to rotate your object.

The Simulator

The Simulator represents a device screen. For example, a mobile or a tablet:

Use it to preview how your effect will look, including with different compression settings. Find out more about using the Simulator.

The Scene panel

Adding objects to the Scene panel on the left of the interface will add them to your effect.

Click Add Object to add an object. You'll see a list of all the different objects included in Spark AR Studio. You can also select 3D Object to import an object from your computer.

This is also where you'd insert an element that will make your effect respond to the person using it, or someone's environment. For example a face tracker if you want to build an effect that responds to someone's face.

You can create relationships between objects in the Scene panel. Creating a child-parent relationship means you can make the same change to multiple objects at the same time, by making a change to the parent object. To create a child-parent relationship, drag the object that you want to be the child onto the object that you want to be the parent.

The Assets panel

This is where you can add your own assets to a project or create assets in Spark AR Studio.

Click Add Assets to create assets or add your own. You can add textures, materials, 3D models, animations and audio files here.

The Inspector

Use the Inspector to make all kinds of changes assets and objects. You'll need to select the asset or object in the Scene panel or Assets panel first.

Below, we've selected one of the mesh that makes up the 3D object in our scene:

We could use the Inspector to change:

  • Which layer it's on, by adjusting the dropdown next to Layer.
  • Whether or not it's visible in the scene, by checking the box next to Visibile.
  • Its position, scale and rotation, by changing the X, Y and X values under Transformations.
  • Its material, by clicking the dropdown under Material.

We could also click Create, next to Patch. This will create a patch representing the mesh in the Patch Editor.

Some properties have arrows next them. This means a patch can be created to represent the property.

So if we click the arrow next to Position, a patch would be added representing the position of the mesh. You could connect this patch to other patches in a graph, to manipulate the position of the mesh.

The Toolbar and Menu bar

The Toolbar

The toolbar is along the left of the interface. Click the icons to:

  • Configure your workspace, for example to show or hide the Patch Editor.
  • Change the video playing in the Viewport.
  • Pause or restart the video.
  • Preview your effect.
  • Export your effect.
  • Report a bug.

The Menu bar

You can access a number of shortcuts and features through the menu bar along the top of the screen. For example, under:

  • File you'll find options to save or export your project
  • Edit you can undo and redo actions.
  • View you can configure your workspace.
  • Insert you can add objects and assets to your project.

The Layers panel

Use this panel to create layers. Find out more about using layers in your effects.

The Patch Editor and Console.

Use the Patch Editor to create effects with logic, animation and interactivity, without using scripting. Use the Console to add JavaScript to your project.

To open or close the Patch Editor or console, click to View in the menu bar and select either:

  • Show/Hide Patch Editor.
  • Show/Hide Console.

Both the Patch Editor and Console will open at the bottom of the screen:

Learn more

Join the Spark AR Creator's community

Find inspiration, see examples, get support, and share your work with a network of creators.

Join Community

Join the Spark AR Creator's community

Find inspiration, see examples, get support, and share your work with a network of creators.

Join Community

Frequently asked questions

Have a specific question? Maybe it's been answered.

Read FAQs
Was this document helpful?