504 - Design for Screen - Finalising the Animation

In order to finalise the animation I needed to take each leg position layer on Photoshop and then apply it onto After Effects and then roll it over as a looped animation. By importing it with retained layer sizes and still in .psd format I was able to individually still manipulate each part of the body separately, so I could use the puppet tool on the arms and the head to make it seem as if as the character is cycling their body is joggling around - for added realism. I also added a bit of a bump into the loop aswell to make it seem as if they went over some un-even ground - just to really enhance the little characteristics of the animation to make it appear more realistic. 

I applied the roll over animations so as originally suggested they cycle across the screen with wind animated and added in for effect. Then the logotype follows closely behind with the trail behind it accentuating this feeling of motion alongside the wind..

I took this further by then mocking up the animations into the format of a loading screen for the app, so when I have finished the design on XD I am able to simply record the mockup of the app going through it, and then apply both to a vectorised iPhone mockup on After Effects for my finals.
It is here that I have included the personalised welcome messages to the app, including current weather warnings letting you know if its sunny, windy or raining outside with just a little heads up - this is just to add this user experience feeling you get through using the app, making it feel more personal and considered to each user..