Shop Blog Templates Bundles Login

How to parent icons in After Effects

Follow along and download the free 'parenting icons' in After Effects project assets

I seriously couldn’t think of a better title for this tutorial, but trust me it’s got some seriously good tips.

Basically the idea is that I wanted to share how I would set up a simple parented animation using track mattes.


After Effects has two ways to ‘mask’ things. One is with mask (duh), and the other is with ‘track mattes.’ Each has pros and cons.

For some inexplicable reason, you can’t unlink a mask from its layer. So, if the layer moves, you need to ‘counter animate’ the mask to have it stay in place. Seems like a waste of keyframes to me.

What you can do instead is use another layer as a mask. After Effects calls that a ‘track matte.’

It’s pretty simple to use and what I like about it is you can use parenting and avoid keyframes. This keeps your project file nice and clean and highly iterable, which you need for your UX projects.

This could be a shape layer and let you control the boundary of things by animating the path shape. Lots of possibilities.

The downside is that it adds more layers, and I like to work as clean as possible.

There’s also some Illustrator workflow stuff I cover, as well as a little cool animation hack where you can create what I call ‘layer timing spacers’ to block in repeating durations super fast from the keyboard.

So really, this is less about parenting icons than it is about showing you some rad pro tips that will help you out a lot.


Become a UI animation pro this week and save $571 with my ‘Ultimate UI Animation Fundamentals bundle'


Find me on –

Facebook: https://www.facebook.com/uxinmotion
YouTube: https://www.youtube.com/channel/ux-in-motion
Medium: https://medium.com/ux-in-motion
Twitter: https://twitter.com/ux_in_motion
Dribbble: https://dribbble.com/issara

Get my free UI animation tutorials and resources emailed to you directly

Join 25k designers from around the world who have signed up to my UI animation newsletter. You'll be the first to get my new tutorials, articles, or courses on UI animation.

Close

50% Complete

Get my free UI animation tutorials and resources emailed to you directly

Join 25k designers from around the world who have signed up to my UI animation newsletter. You'll be the first to get my new tutorials, articles, or courses on UI animation.