FMP – Prototype – Animating Intro Screen

I’m prototyping my screens in Invision, and this is good in some ways, however, it doesn’t support video which is quite annoying for animating. However, the way round it is to create a GIF in Photoshop after creating the animation in After Effects.

To do this, I exported the elements of the design I needed from Sketch app, like the background plane, and the animated elements that lie on top as layers.

Screenshot 2018-05-31 15.45.07Screenshot 2018-05-31 15.38.18Comp-1.gif

I created key frames for scale along time to create a pop effect, and then moved the position of the enter button from below, creating interest to the call to action.

I rendered the video as normal, and then imported the video composition into photoshop, where I was then able to export as a gif, ready to put into my Invision prototype.