< Back to Blog

How to Make a Looping Hologram Animation in AR with Static Assets

Hi, this is Maria from Torch. Today, I’m going to show you how to build an augmented reality app featuring a sweet looping animation—built completely from static assets (not rigged or internally animated) and 2D images on an iPad. 

You can use nearly media from animated models (FBX, GLTF, etc.) to moving images (videos, transparent GIFs) in Torch. But, in this tutorial, I will show you how to create a sweet “Space Princess hologram" animation in AR using just a couple of simple assets that move between 2 scenes in Torch.

These AR animation skills will give you the power to create entire AR experiences in a fraction of the time it takes to animate just one custom 3D model.

Download Torch AR for free to get started and then follow along with this video tutorial.

Build AR animations visually on a mobile device 

In the Torch Design Environment, you have complete control of any asset. You can easily edit the position, rotation, and scale of images and models with just a simple gesture. Or you can dive into the many object properties to edit Spin, Visibility, Face Camera, and even add User Controls.

Using the trigger–target–response pattern of Torch’s animation engine we can quickly build sequences of these property changes into what we call Interactions. Read more about interactions in help docs.

As your AR apps grow and contain more and more moving parts, it is important to make as many design decisions as you can in context. Torch allows you to do this naturally as both editing and viewing are done in Augmented Reality. This is a great advantage for designers as we can stay in the context of the app, and the user, and not have to leave to another device or creation environment to make changes.

In this project, we will use Torch to layout an AR scene using 2D and 3D assets, copy the scene and assets for fast design iteration, and then animate the objects using an Enter Scene interaction and some looping logic.

Additionally, I'll show you how to make your animations silky smooth using delay, timing, and curves settings. Using the Edit Curves menu we can preview, manage, edit, and delete interactions in your scenes. All of this takes place inside of the Torch app, on your favorite device, and in augmented reality.

Watch the tutorial

Try this app in AR

Try this augmented reality app on your own desk. To open this Viewer Link app, just click or scan this link on any iOS device with ARKit. Pretty cool right? I was able to create all of the movement for this app inside of Torch, without writing any code using the visual design environment and preview modes. And now you can too!

Image of "Viewer Link" QR code to view this AR animation.
Just click or scan this link on any AR Kit device to experience the AR animations.

When you’re ready to share AR apps, anywhere, learn how to reach millions of users with Web AR + Torch Publish, Powered by 8th Wall.

Get started with Torch Publish + Web AR, today. 

About the author

Maria Nova is an XR Designer from Helsinki. She has worked with both virtual reality (VR) and augmented reality (AR) projects. Most recently her focus has been on mobile AR. Maria is an early Torch user and trainer, leading several user research sessions and AR prototyping workshops for designers and developers.

These early experiences inspire and inform her AR design internship with Torch, building resources that help creatives explore AR foundations while building proficiency using the Torch AR design environment. Find Maria on LinkedIn and Instagram.