How to retime your UI Animation for client presentation in After Effects
Mar 27, 2019
Click here to download the source files and follow along
UI Animation needs to be fast and clean. There’s no two ways about it. If it’s slow, it appears unresponsive, and unprofessional.
In fact, the single biggest mistake I see designers make is that their motion design is way too slow. If you have a transition happening over .5 seconds for mobile, you need to speed it up.
The general rule of thumb is that it should take as short as time as possible without being jarring.
The tricky thing is that when you’re presenting your motion to folks who don’t get this, sometimes it can be too fast for them to register the mechanics of the motion.
That’s why, based on your audience, I sometimes recommend doing a ‘slowed down’ version for presentation.
In this tutorial, I show you 2 ways to do this extremely quickly and efficiently.
In this video, I show you two techniques that I recommend.
The first technique involves simply stretching your clip. This is incredibly fast and will allow you to create a duplicate ‘presentation’ version in seconds. Basically, you drag your composition to the ‘new composition’ icon, extend the new composition duration, then stretch your pre-comp.
The other way involves this insane thing called ‘time remapping’ where essentially time becomes a key-frameable property on your layer. If this hurts your brain, you are not alone. This is more advanced, and if you quickly need to create a new slowed down version, the first option is the way to go
Happy prototyping,
Issara
Don't miss a beat!
New moves, motivation, and classes delivered to your inbox.
We hate SPAM. We will never sell your information, for any reason.
