There may be differences between your version of AR Studio and this tutorial because the product is currently in beta and we update it regularly.

Posing and Animating Objects with Skeletons

Something Went Wrong
We're having trouble playing this video.

Previously you learned how to use 3D objects in your scenes. In this tutorial, you'll learn how to use skeletons to pose and animate your objects in AR Studio.

Please download the sample content to follow along.

If you open the finished version of the effect, you'll see that we're going to build a star antenna effect. These antennas track your face and sway in a realistic way as you move.

Creating a Model in a 3D Modeling Package

You can create an object with a skeleton in a 3D modeling package, like Maya or Blender, but for this tutorial, we've provided one for you.

Like human skeletons, 3D skeletons are made up of a series of bones and joints. When you create a skeleton yourself, you'll place joints at the points where you want your model to bend or move. These are known as the points of articulation. Between the joints you've chosen on your model, you'll see bones. While they don't have any impact on your model, they help you to see how each joint interacts with the others. Once you've created the skeleton, you can then bind it to your model using a process called skinning.

Inserting Face Trackers

To get started, open AR Studio and click Create New Project. Then, click Insert, select Face Tracker and then click Insert. You should now see the axes in the scene.

Importing and Manipulating 3D Objects

Next, right-click on the face tracker in the Scene tab, select Insert and then 3D Object. Go to the sample content folder that you downloaded earlier and open the DAE file. You should now see the object listed in the Scene tab and in the Assets panel, and tracking the face in your scene.

Creating Materials

Next, you'll need to create the materials you saw in the finished effect, which are 2 color materials. To do this, go to Assets, click the plus sign and select Create New Material. The new material's properties should now be open in the Inspector panel, so go to Shader Properties. Go to Diffuse, click in the box next to Color and then select a new color. This will be the color for the stars. We have specific colors in mind for this effect, but you can choose the color you like. Next, create another new material and then, choose another color. This will be the color for the springs.

Now that you have 2 materials ready, it's time to apply them to the object in your scene. To do this, go to the Scene tab and click the arrow next to stars_antenna_grp and its child, skeleton, to expand them. Then, select right_star_geo and go to Materials in the Inspector panel. Then, click the arrow next to No material selected and choose the material you created for the stars from the menu. Once you've done that, do the same for left_star_geo. Then, repeat these steps for the springs, using the second material that you created.

Your object is now complete. Now all you need to do is animate it.

Adding Scripts

We've given you the script you need for this effect, so go to the sample content folder on your computer and open antennas_script.js. Then, go to Assets in AR Studio, click +, select Create New Script and then double-click script. Copy and paste the sample script into script, then save and close it.

To test the script and preview the effect, click Run and move your head.

Congratulations, you've just finished your first animated effect using an object with a skeleton!


To recap, you've learned about skeletons, bones and joints, how to import 3D objects with skeletons and how to script animations.