Navigating the Interface

In this guide, you'll learn your way around the Spark AR Studio interface.

The Viewport

This is the middle section of the interface. See and work with the effect you're building here.

By default, the perspective is set to Bird's Eye. Click the hamburger menu in the top left corner of the viewport to change this - for example to see your scene from the top or back.

You can also choose between Perspective and Orthographic projection. Choose:

  • Perspective to see your scene as it would look to someone in the real world, with objects looking smaller the further away they are.
  • Orthographic if you want objects to stay their true size, regardless of where they are in relation to the camera - this is useful if you're designing an effect with complicated geometry.

The green lines show what's in view of the camera, so anything outside of the rectangle won't show in your effect. In the example below, the blue diamond won't be visible:

The Simulator

The Simulator represents a device - for example a mobile or a tablet. Use it to preview how your effect will look, including with different compression settings.

It's docked in the bottom right of the Viewport by default. Find out more about using the Simulator.

The Toolbar

The Toolbar is at the top of the window. It gives you quick and easy access to many features in Spark AR Studio.


Insert something into your scene - for example objects, lights and text.

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, or a plane tracker if you want to build an effect in someone's surroundings.

AR Library

AR library is a huge collection of assets and sound effects you can add to your effect for free. Find out more about using the AR Library.


Use the Manipulators 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.

You can change these things based on your object's:

  • Local, or global coordinates.
  • Own pivot point, or a central pivot point.



  • Choose from a selection of videos to see how your effect looks on different people.
  • Select FaceTime HD Camera to see an effect on yourself.
  • Click + to import your own videos.

Click Play or Pause to start or stop the video.

Device Dropdown

Use this dropdown to preview how your effect looks on different devices. You'll see the results in the Simulator.


Click this button to see more views of your scene within the Viewport. For example, you could select 2 Views Stacked and set each view to different perspectives, to see your scene from different views.


Use this button when you're using the Spark AR Player app to see how an effect looks on a device. When you've connected a device to your computer with a USB cable, you'll be able to click this button and mirror your effect to the device.


When you're happy with your finished effect, click this button to export it. You can then submit your file to be published and shared through the camera.

The Scene Tab

The Scene tab is at the left of the screen. Adding objects to the Scene tab will add them to your effect. You can also manage the hierarchy of objects here, creating child-parent relationships.

The Layers Tab

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

The Assets Panel

Click + to create assets in Spark AR Studio, and add your own assets to your project. You can add your own textures, materials, 3D models, animations and audio files here.

The Inspector Panel

Use the Inspector panel to make changes to an asset or object that you've selected in the Scene tab or Assets panel.

Below, we've selected the Ambient Light that's automatically included in all Spark AR Studio projects in the Scene tab. We could use the Inspector to change the intensity, color and visibility of the lighting, and which camera it's visible in.

Clicking the small circles next to some properties, for example Visible, Color and Intensity in the example above, will create visual programming patches in the Patch Editor.

The Patch Editor

Use the Patch Editor to create effects with logic, animation and interactivity, without needing to know JavaScript.

To open the Patch Editor, go to View in the menu bar and select Show Patch Editor.

It'll look like this:

The Console

The Console is at the bottom of the window. It appears when a script has been opened or is running. Use it to check the output of a script.