Wednesday, February 11, 2009

Whether we like it or not, our legacy as designers is ugly. We’re largely responsible for fueling a culture of consumption. -— Eric Karjaluoto

The man's gotta point! :)

Anyway, a couple days ago I had to complete an animation test for a really really awesome company called Ayzenberg. Here were their specs:

Flash Banner Mock up Project Make a 300x250 banner at 150k or less. Most banners are at 50k but we gave extra room to allow you to really show off your skills.

Use the storyboard PSD as reference as the general direction for the banner, but feel free to makes changes to really bring it to life. If you have a great idea that doesn't follow the banner but is way cooler, feel free to do it. Feel free to import video or 3d or anything you want to make the coolest banner possible.

The only requirement is that everything needs to be embed in the 300x250 banner. oh yeah no sound in the banner.



My goal was to take the best of what they gave me (and they gave me a TON of great resources including the storyboard with some really great images from the game and a couple of movie clips from the actual game as well) and really focus on the strongest points of it, which I thought were the details in the characters' costume designs and facial expressions. Then I wanted to tie those images together with a clip from one of the trailers they gave me that had the ring kind of whirling around while coming at you... a pretty awesome shot. So originally, I had 3 images show -1 at a time- with some zooming effects applied. Then on top of them, I added the trimmed-down clip of the ring slowing coming through. I timed everything so that the clip of the ring started playing when the 1st image began to fade away, then ended.. all close up and in-your-face-like right after the 3 image faded out. Immediately following the end of the clip was a chunk of text I got from the storyboard that said "Play the PC Game of the Year for $9.99" which was then followed by an image with the Lord Of The Rings Online logo and a button/link underneath it to find out more info.

Butttttttttt the file size was enormous. I tried everything I could think of to get it down from over a massive 800kb to the 150 requirement. I got to the point where I thought it would be better to basically start from scratch, eliminate the trailer clip and still aim to get the same effect. So, here's what I came up with and although it doesn't have a piece of the trailer embedded, I can honestly say I think it's pretty rad:

http://www.huddydesign.com/SarahHudson_AnimationTest_02.html
NOTE: If you're using FireFox 3.0.6 the second and third images might get stuck but will function properly the 2nd time through, so just let it run... I'm working on a fix! :)

Lesson learned: I seriously need to spend more time focusing on mainting a low file size. That means planning out the design better before I start development so that I don't have to keep my fingers crossed before testing. And, I just need to flat out learn more ways to do that because that hasn't been my focus in training too much over the past 6 months.

Well, the great news about the final version is they liked it and I'll be meeting with them on Monday for an interview. So woo hoo!!! I'm so excited. I'm feelin some good vibes with this company and I'm really looking forward to meeting with them. :)