how to make animated images (for dummies)

[PAche]

could someone make a really detailed tutorial as to how to animate images.to be specific, i want to animate my banner such that i can have a few of my works showing one after the other with transition in between.

i've seen one of these tutorials and apparently, adobe image ready is a must.but i dont even know how to insert a frame and a tween in image ready :oops: so if it really is essential to use image ready could you go to the small details like maybe even [blah>blah>tween] that kind of things...or what to select

like i said, this is supposed to be for people like me with no idea what image ready does.yes, the dummy i referred to in my title is me

[spinter]

sorry.. but i don't think i can give a details.. but i hope you can understand...

u should use < FLASH MX > ... but i use FLASH MX 2004...

first....

1. Open new document with 400 x 150 pixels..

2. First, Put your 1st frame to Canvas... For example, u are going to make an animated banner with 2 words, V and S, That means, Put V in your canvas using the text button.

3. Then,  at the timeline frame, right click at frame 11, then insert keyframe. then, at frame 11, put your 2nd words... Then, at frame 20, right click, then insert Frame.

4. Then, save your work, and then press < Shift + f12 > to publish it. Voila, it's now appear in your save folder, with swf file type. now, upload to your site, and happy...

Hope you are satisfied with my answer ^^

[aReNieX]

um..if u wanna use adobe image ready..here it is...

1.u arrange ur banner like inside this page...


2.open adobe image ready


3.in the adobe image ready, go to window>animation, the animation window juz like in this image


4.inside animation window, u duplicates the same image. make sure da numbers of duplicates are same with the layer that u want make animation. example, look at the pallete, i've got 6 layers, so u duplicate 6 also


5.u go to 1st layer in the animation window>pallete>press the indicates layer visibility (da eye shape) on all the layers except layer 1..that thing is to make another layer invisible if u press that..
*in layer 1 in animation window, u turn on the eye layer 1 in pallete n turn off all the eye of the layers. in layer 2 in animation window, u turn on the eye layer 2 and turn off all the eye of the layer..got it?



6.repeat step 5 for every layers until u got sumthing like this


7.now is the fun part...assign appearance time (in seconds) to each frame -- just right click on the time '0 sec' and change it.
*In this example I changed the time to 2 sec = 2.0*


8.click on the little 'play' arrow to see the animation..and make sure u set it to forever..

9.choose menu Window>Optimize, and change the settings to the ones below...(the higher colour it is, better the image comes out to be)


10. to save, go to file>save optimize as>save as type GIF

done...here is my result...

[spinter]

thank you... since i've used photoshop, i've never touch the imageready... tQ anyway.. it's great...

[aReNieX]

heh..usually, when it's come to animation i use a right software name, Jasc Animation Shop...it can do a lot transation...here is some examples...and yeah..using flash is quite cool also, actually, i already hav that software, but lazy to explore it..when my bro trying to teach me how to make flash, i cant follow coz at that time, my interest are still only in photoshop..huhu...i guess, later if im quite interested to flash, i will learn it..hehe

 

[spinter]

actually, which is the easiest prog to make an animation??

[PAche]

thanks...i think i get what u meant areniex...maybe i'll add a tutorial on how to make a transition too :D anyway, i cant save it in photobucket or imageshack cos the only way i can save my image and preserve its animation is .psd, and the websites don't host .psd files.

how do i save it as a .gif file?

[VanillaTwist]

open it back up; in photoshop and save it as gif?

[PAche]

that doesn't work.just found out you hafta open it in ImageReady, file>save optimised as... and save as .gif file.thanks areniex!

[aReNieX]

yeah...you're welcome...heh..u noe wut? so far, i neva found the site hosting .psd file...heh...it really impossible to find even one..huhu...:P

[Misao]

Hmm...it's pretty hard to host .psd files - although there are sites that host Adobe Photoshop brushes (.abr) files.

It's pretty hard if you want to make special transition effects in ImageReady, however. (Or the animated gif in the animated gif tutorial on Melfina's site.) I use Animation Shop for that - althoug I woul really, REALLY love to use ImageReady to do the same too!

Oh well...I have much to learn. ^^ Thanks anyway, aReNieX. That was a good tutorial.

[VanillaTwist]

yeah...you're welcome...heh..u noe wut? so far, i neva found the site hosting .psd file...heh...it really impossible to find even one..huhu...:P

hehe...i foudn a site that hosts like everything...even psd files and such...except .php files.

[PAche]

what site is that?cld u gimme the address?i'd like to check it out

[VanillaTwist]

i pmed you with the link

[spinter]

pm me the link tooooooooooooooooooooooooo