There may be differences between your version of Spark AR Studio and this tutorial because the product is currently in beta and we update it regularly.
With target AR, an augmented reality effect is triggered when the camera is pointed at a specific real world target.
In this tutorial, you'll create a target AR effect with a dancing robot that appears when the camera is pointed at a Spark AR Studio poster:
Download the sample content to follow along. It includes both the finished project and an unfinished version.
To get started, open the unfinished effect in the sample content folder. We’ve already imported the objects and assets you’ll need - they’re listed in the Assets panel. You’ll see:
The foundation of any target AR effect is an object included in Spark AR Studio called a target tracker. This object detects the target, triggering an effect in response.
To add a target tracker:
It’ll be listed in the Scene panel as fixedTargetTracker0. You’ll also see a square in the middle of the Viewport and Simulator. This square represents the space for the target image:
Next add the target image to the target tracker:
The target should be a flat image, like a poster or business card.
There are two main parts to the effect. First you’ll create a colorful background behind the robot, then you’ll add the animated robot. Everything you add to the effect will be a child of the target tracker, so it will appear when the target is detected.
The background fits the shape in the center of the poster. You’ll use the Background object to create this part of the effect. It has 2 mesh:
The flat mesh will become an occluder. It’s positioned in front of the other mesh and will hide the parts of the texture we don’t want to appear in the scene, so the texture that does appear is the same size and shape as the center of the poster.
Let’s take a closer look at how this works:
To add Background to the scene:
Now make the occluder. To do this you’ll edit the material applied to the mesh. The material is called Occluder _MAT and listed in the Assets panel, underneath the Background object. So:
Here’s how your project will look:
Now edit the material applied to the second mesh to add the colorful effect to the background. It’s listed as Enviro_MAT in the Assets panel:
You’ve now completed the background:
The robot is a 3D object with an animation included in the file. It’s listed in the Assets panel as Robot. Add it to your effect in the same way as the background:
So now the robot is visible in the scene, but there’s no animation. We’ll use an animation playback controller to add it.
The animation playback controller can set how and when an animation plays. In this particular effect, we’ll set it to make the animation loop continuously.
To create the animation playback controller:
It’ll be listed in the Assets panel as animationPlaybackController0. Next you'll need to connect the animation included in the robot object's file to the playback controller. To do this:
It’s not visible in the scene yet. That’s because you need to connect the animation playback controller to the robot object itself.
To do this:
So now you have the dancing robot in the scene. Let’s complete the effect by adding a physically-based material, giving it a realistic metallic appearance. To do this:
Here’s how the robot will look with a complete material:
And that’s it, you’ve completed the physically-based material, and your target AR effect!
Use Spark AR Player to test the effect. You’ll need to print out the target - find it in the sample content file.