"Window Pain" completed sequence

After a brief period of no blog updates, here's a bit of a bombshell: I've finished the animation!

I really should have continued updating with posts during the process showing what I'd been doing but I got so wrapped up in the essay and Animation Principles that I didn't really have any brain cells to spare. Working has, these past two weeks, become like a primary bodily function; I sleep, eat, breathe and work with very little room left in my brain to process much beyond that. To be honest though, making it was just repeating bits of what I've already been doing with different pictures.

The one big thing to note is that I ended up cutting the third "window scene" (the fairground) from the animation. I'd been working on the graphics for the roller coaster for about a week and was really struggling to animate it convincingly. I was still concerned about staying within the timescale, so I decided instead to leave it until the rest of the animation was finished to see whether I had enough screen time left to accommodate the scene. As it turns out I had already hit the max 40 seconds without it, so it worked out quite nicely and saved me a lot of stress!

I'm disappointed at having to cut the scene as I quite liked the flow of it but I don't think the animation suffers too much for it. I'm not entirely pleased with certain parts — mostly the typing sequences. He kinda looks like he's karate chopping the keyboard but it has a certain quirkyness to it I suppose. I could have done more with it but to be honest I'm feeling completely burned out — there are certainly things with it I could fix but I think there comes a point at which you have to take a step back and say "I'm done with this." When I've recovered a little more (and Animation Principles is done) I may return to it and make some minor tweaks, but for now, I'm relatively satisfied. Feels good to have it complete at any rate ;]

Next I think I'm going to produce an amended storyboard and animatic to show the cut down sequence. But first, back to Flash...

Magical dancing eyebrows

This is the highlight of my animation career

New puppet and updated backdrop

I took some better pictures of Craig and updated my puppet with the new head. I'm much, much happier with how this looks. It's a lot cleaner now! I'm hoping to find a way to get the eyebrows neatly onto a separate layer so I can animate some better facial expressions. Cutting the eyebrow out is no problem — it's repairing the skin underneath that's proving tricky...

I also tweaked the background some more, adding a few more posters to make it a little less bare. I'm not sure I like it — seems a bit cluttered — but it's got a bit more flavour to it now. The poster on the far left was a happy accident — it just so happened to contain Craig's most used word! There was one that said "Hello, how are you?" in a multitude of different languages but it was really badly designed. I may make one of my own and put it there instead. Then at least I've still got his quote in there if the chat bubble doesn't work out.

Paris scene — French couple

For the Paris scene I needed to somehow create a stereotypical French couple embracing. I was really dreading having to do this and have admittedly been putting it off for a while, as I hadn't a clue how I was going to do it! I ended up using similar techniques to how I created my Craig puppet and simply stitched together a bunch of photographs from Google.


I started with an image of a couple of ballroom dancers as the pose was quite similar to the sort of thing I wanted.

I began with this:

(I love this — it's so hilariously awful)

And finished with this:

I lost count of how many pictures I robbed off Google to put this together. The hands on the woman are really shoddy but they're probably going to be hidden behind the window frame so it hopefully shouldn't matter too much. I may go back and tweak them a bit — they're really bothering me!

I'm not totally done with this yet — still got a fair bit of tweaking to do, mainly on the woman. The hair and coat are bothering me and she just feels incomplete somehow. I'm not sure about the colours either.

I think it's the face as well — it's had virtually no editing to it. I think it's because the man is so ridiculously stereotypical whereas she's fairly ordinary, so it looks a little out of place. Maybe I'll darken her hair, give her ridiculously pale skin and bright red lips and a huge pair of sunglasses. For some reason French women are harder to caricature!

(What is it with me and French people?!...)

After Effects ferris wheel

Et voila, as the French would say!

Took me quite some time but I finally got the ferris wheel to look like a ferris wheel. The wheel was just keyframed to rotate 360 degrees. The carts proved tricky at first — initially I simply parented the carts to the wheel as it rotated, which didn't exactly work. You can see what happened:

Obviously the rotation is all wrong and the carts remain upright and stationary, floating all over the place. In order to make them appear to be effected by gravity I had to have them rotate in the opposite direction to the wheel... whilst continuing to follow its overall rotation. Confused? I sure was!

Fortunately I managed to dig up some information and helpful tutorials to help me out!

After Effects has a brilliant set of features called Expressions. Expressions are little JavaScript-based pieces of code that allow you to get really deep into an object's parameters (opacity, position, etc) and control it in a much more precise way. The great thing about expressions is that they work alongside existing keyframes rather than replacing them. This allowed me to keep the overall motion path (i.e. the rotation of the wheel) whilst have them counter-rotate as they span to maintain the feeling of gravity.

The first thing I had to do was split each of those carts onto a separate layer. This allowed me to set the anchor point of each individual cart to the point where it connects to the main wheel, so that it would swing from that point only.

After that lengthy and boring process, I then parented each cart to the wheel so that it would follow the rotation.

I then had to add an expression to each cart layer that would basically tell the cart to remain vertical even as the wheel rotated.

 

To add an expression, select the parameter of the layer you want to parent (in this case, the rotation of one of the cart layers) and go to Animation -> Add Expression.

(Naughty Alex hasn't labeled his layers)

The parameters in the layer panel will expand and you'll be given several new buttons to play with. I have absolutely no idea what any of these other options are so I'm not even going to attempt to explain them. The only one I was interested in was the 'pick whip' — the swirly line that's also used to create parent/child relationships between layers. In this instance I was effectively parenting the rotation value to the rotation value of the wheel layer (layer 2).

A new text field will open up within the timeline and this is where you scribble all your Expressions. The first half of the code was automatically inserted — from what I gather it's simply telling this layer to mimic the rotation of "Layer 2". The only part of code I added was "*-1" which literally means "multiply by -1," i.e reversing the rotation. Multiplying anything by -1 within After Effects gives you its opposite — don't ask me why, I'm not a maths person!

I then had to repeat this process for infinite (or until all my carts were done at least)

The final result one more time:

 

Overall I'm pretty pleased with the movement, less so with the vector image. I think it's a little too quick but that's easily rectifiable. I'm still annoyed at having accidentally picked a stock image. Though it wouldn't take a terribly long time I'm just a little miffed at the prospect of re-doing another image! 

At any rate, I have the flu (again), my ears are ringing and my mouth tastes like mushroom soup (?!). I'm going to bed!

Vector ferris wheel

I found this one on Google, but again it was really low quality. I blew it up by about 200% (look at the lovely JPEG artifacts!) and started to trace over it — this gives me the benefit of separating each part into layers for me to animate!

It's really quick and pretty shoddy but I figured since it's going to be in the distance, much like the cows, it shouldn't matter too much. It was a really simple pen tool job to which I simply applied stroke paths of varying thicknesses. The wheel itself is on the bottom layer, the carts are on another layer and the weird girder thing is on the top layer. This will allow me to parent the carts to the wheel and mimic the rotation as it spins.

I didn't notice at first but I think the image of the ferris wheel that I used is actually a stock image — whoops. I honestly wasn't aware — I nabbed it off another website which had taken the thumbnail from a stock image resource. Serves me right for not checking my sources!

I'm a bit concerned now and I probably shouldn't use it in my final film, however seeing as I've gone to the trouble of resampling the image I think it'll be alright to use it just for this one test? I'll probably just have to re-do it from scratch for use in the final animation.