Tuesday, April 19, 2011

Motion-Based Poster.


In our assignment, we had to do a typographical poster based on a given theme, 1Malaysia.
Based on that, I have came out with this poster.


From this, I had to make it animated. 

This is the tutorial on how I do it.

First, I make a new document in Flash (Actionscript 3.0), and changed the properties to make the size 320x420 px. 

Then, go to "File > Import > Import to library" of all the files that are in the poster. 

Then, "Modify > Convert to Symbol > Movie Clip" (or use the F8 command) before anything.


(I have animated 2 of the images, but it uses the same principles)
First, make a new layer and insert your image


Then, from the 1st frame, use the shift key and click to another frame to select it all

Left click it, and choose insert frame.

It will look something like this

Then, I selected some of the frames and clear them out.


So, it will look a little something like this.

Then, right clicked the uncleared frames and click "Create Motion Tween"

Click the first frame (uncleared one), and put the chopstick outside 

Then, I put click the last frame of the layer and drag the chopstick to the left.

Same principle I made with the nasi lemak.
 I selected the frames.

Insert Frame

Clear Frame

Create Motion Tween

Only this time, I made the nasi lemak going upwards instead of going left.




And we're done with the images.

 ----------------------------------------------------------------------------------------------------
Onto the text...

First and foremost, I organized the texts in a folder for easy access. Easy to get track on the animation.

Same as the previous, I highlight and cleared all the used frames, and highlight frame 1.

Click the image and go to properties. Change the "Colour Effect"to Alpha.

Change it to 0%

Then, highlight the last frame, and make it back to 100%
It will then make as the text appear from the darkness, as the Alpha plays with the saturation.

That is basically how I animate my poster. 
Using the same basic technique for all the text, and the same basic knowledge for the images. 

Hope you learned something from my tutorial. Comments are appreciated, and I'll see you in my next tutorial.

Later, and thanks for reading :)