Everything you need to know to create an interactive augmented reality experience.
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.
You can use the Patch Editor to animate your objects and add interactivity and logic to your projects, without using scripting.
Parts of your scene are represented as patches that you can connect to build a graph. Once connected, your graph visualizes the animations and interactions in your project.
To make the slices of pizza fly into your mouth, you'll animate them using the Patch Editor. The patches you'll use for this include Mouth Open, Loop Animation and Transition.
To learn more about the different patches in Spark AR Studio and how to use them in your effects, take a look at our example graphs.
To get started, open the unfinished version in the sample content folder.
To see the objects more clearly you can add more views to the Viewport. To do this, click Viewport in the Toolbar and select the option you want to use from the menu. You can zoom out by moving two fingers over your trackpad, or by using your mouse wheel.
Open the Patch Editor by clicking View in the menu bar and selecting Show Patch Editor. You'll see it below the Viewport.
For this effect, you'll need to use the face tracker to trigger the animation. We call this kind of patch a producer patch.
To add this patch, select the face tracker in the Scene tab and drag it into the Patch Editor. You'll see that the face tracker patch has 4 ports and each one has a different function. The only one we need for this is the Face Tracker port.
Next we'll build a graph that controls whether or not you can see the pizza. To do this:
You should now see a connection between the 2 patches.
Now you'll need to add the wheel of pizza to the Patch Editor. You'll do this by creating blue consumer patches to control the visibility of the pizza. To do this:
Connect the Mouth Open patch to each of the pizza patches by clicking and dragging from the port next to Visible.
Click Run in the Toolbar. You'll see that the pizzas appear and disappear when you open and close your mouth.
Now you'll use patches to make the pizza fly into your mouth. You already have the face tracker patch, so you'll start by adding a second Mouth Open patch. This patch will control the movement of the pizza wheel. To do this:
Next we'll add a Transition patch, which tells Spark AR Studio which coordinates you want to animate. Add the patch by double-clicking and selecting it from the menu. To create the illusion that pizza is flying into the mouth, we want the pizza wheel to rotate around the X-axis. On the Transition patch, change the End X coordinate to -360, then connect the Progress port on the Loop Animation patch to the Progress port on the Transition patch.
The final step is to add patches that tell AR Studio what to animate. To do this:
Click Run in the toolbar to see the complete effect in action. When you open your mouth, you should see pizza flying into your mouth. When you close your mouth, the pizza should disappear.
Find inspiration, see examples, get support, and share your work with a network of creators.Join Community