• Olly Jordan

Chapter 35 - Teen Choice - Experimenting with Animation - Uni 3rd Year 2017/18

Updated: Jun 22, 2020


I did actually create a gif of my own using one of my previous paintings as an experiment. As you can see above, I used my painting of Lili Reinhart to create a reveal effect. I followed the tutorial as discussed below and followed as closely as I could, obviously just using an image of a painted portrait rather than an ink splat like in the tutorial.


The process of creating the first animation took around 2 hours to do, but some of that time was trying to find alternative routes to get the same effect because my version of After Effects was clearly newer than what was used in the tutorial, so some of the shortcut buttons had changed. You can see in my Lili reveal, that I did push the animation further to create a successful looping gif. This took me a little while to get my head around because I was duplicating and reversing the effects, but I think that it has come out quite successfully. This kind of animation technique is definitely one that I will most likely base my reveal on in my final animation. Perhaps I could have a painterly mark making artwork instead of the copper image which would paint itself away to reveal the winner, this would link nicely with the already existing branding of Teen Choice. Using the video tutorial below allowed me to save my After Effects file as a gif format by using Adobe Media Encoder. https://www.youtube.com/watch?v=p9GjnSWCs3k

Animation Tutorial Videos

https://www.youtube.com/watch?v=0i_jeSylfdg

Watercolor & Paint Elements & Intro - After Effects Tutorial - [ENGLISH]


What appealed to me about this tutorial video is the use of paint marks, obviously that will be a look I will probably use within my branding and this video covers quite a few different styles of paint marks, like a single brush mark being painted, paint splats and watercolour splashes emerging. The watercolour emerging is what caught my eye in particular as I could see the potential for a reveal much like what Luke Butland has achieved within his gif. This also looks good as a logo concept which could work nicely as a TV title sequence. This animation style is created in Adobe After Effects and this is a program that I can get access to, so this seems like a very good tutorial for me to get influenced by.

Watercolour Stain Import your image into After effects and then add a new layer. Add a circle to that layer, make the radius 0 at the beginning and then fast forward in time to the end point where you want the final reveal and enlarge the circle so that it is covering the whole image. Add turbulent Displace effect, this morphs the shape of a circle.

Then play around with Roughen Edges effect, this will make the outline look more natural and painterly because the edges are not so sharp.

Changing the timings so that the ending of the reveal is a little bit slower to create a more natural look. Duplicate the reveal layer 2 times and edit it’s opacity, one to 50% and the other to 75% and leave the last one at 100%. Then sequence the layers a little bit and spread their timings out.

Editing the second reveal so that the reveal is not the exact same shape as that will not look natural, play around with the turbulent displace which will give another shape, so it looks more random. Repeat this process on the first layer too. Applying a turbulent displace layer to all of them will add a slight wiggle, I do not really like this look as it is a bit too much, I would rather do it super subtly if at all.

Using a similar process, an animation for a brush stroke reveal has happened. I think that watching and making along with this tutorial video would be a good idea if I was to create this style of animation within my gif.

0 views0 comments