From the course: Prototyping Microinteractions with After Effects

Why After Effects?

From the course: Prototyping Microinteractions with After Effects

Start my 1-month free trial

Why After Effects?

“

- [Instructor] In this course, we will be using After Effects CC to prototype microinteractions, and you're looking at the reason why. How long do you think it takes for that red circle to move from left to right? What about the blue circle? The answer is, one second for the red circle and one half-second for the blue circle, and the distance each circle travels is the width of a common mobile screen. It is the ability to play with time and the tools, presets, and other features in Adobe After Effects that makes it so compelling as a prototyping tool for microinteractions. As I have made clear to my students and the industry, you can't describe a microinteraction, you have to show it. Let's assume the motion of those two circles is triggered by a tap or a mouse click. It is very easy to say, when the circle is clicked or tapped, it moves across the screen. Now, here's the problem. Everyone hearing you say that, including you, probably, in their mind's eye will see something completely different. When they finally see the tap or click, the odds are pretty good what they see in their mind's eye won't match what they see on the screen. After Effects is an ideal tool for prototyping microinteractions for a number of reasons. The timeline is short. No longer than two or three seconds. Motion can follow an arc, which is a common animation technique, not a straight line. You have total control over easing. It is code-free, giving you the ability to iterate the microinteractions due to feedback from the stakeholders or changes to the scope. The projects can be output to the MP4 or QuickTime format, meaning, they can be distributed to the team or the stakeholders for comment or approval. The ability to use vectors gives you the opportunity to play what I call what if games. What if the text were to drop in a line and the line bends when the text lands on it? That sort of thing. You have super-fine control over time. The timeline lets you control the granularity of time down to 1/60 of a second. Your developers, the people who have to write the code, can see your intent and comment on it before he or she even write the code. When you get right down to it, After Effects is a great tool for prototyping microinteractions because it is easier on everyone Finally, don't get lost in the microinteractions process. Keep an eye on the big picture because if you don't, all of those amazing microinteractions won't connect to provide the functionality of a set of linked microinteractions. of linked microinteractions.

Contents