View Full Version : Tutorial: How to make animated signatures/avatars/pictures.


nakedsnake24
22nd Feb '07 Thu, 21:48
You should know this is easy only if you're willing to take the small amount of time and effort to learn. If you get fustrated easily or don't have much patience this may be a bit hard. Im goin to try to go through how to do this step by step for the people who have some trouble with these things. I can't gaurantee you'll be able to do this when im done but ill try my best to set you on the right path.

First off, we need our 2 programs to do this. If you already have a program like Paintshop Pro or Adobe Photoshop than you dont have to download the first program below.

Jasc Paintshop Pro 9 - Download here (http://www.corel.com/akdlm/6763/downloads/trials/PaintShopPro9/PaintShopPro9_TBYB_EN.exe )
This is the program i use to edit and make images for my annimations. I believe this is only the 30 day trial version but if you like it and you dont like the little "Hey @sshole we let you try this for 30 days now buy it!" pop up, private message me.

Animation Shop 3 - Download here (http://ftp.jasc.com/pub/ans305ev.exe )
This is the program that will be used to make the annimated .gif image(s). This is also trial i believe and if you like it after w/e the time period is, private message me.

These programs may take you some time to download depending on your connection speed, but you have these forums to chill on while you wait for the dl! Once you have them instaled, hopefully you have no instalation or dl problems >.<, follow the steps below.

Step #1
If you have a different program besides the one i gave you, you can skip this step because you probably know how to use it. Open up Jasc Paint Shop Pro 9, if its the first time its gona ask it what type of files youll be working with, just check them all for the hell of it. Now see the toolbar at the top that just about every program has. Click on File and hit New. For now since this is an example, make sure for Units: you have it set to Pixels. Then make the Height 150 and the Width 300. After you have done this click Ok. Now with this New File you can copy and paste any image you want into it by coping the image from a website or something then go to Edit->Paste->Past as a New Selection. Now that you have the image in your 150by300 file you will probably need to adjust it so it fits. Look to the tool bar to the left of the screen, under the little white hand button (which says Pan Tool when you scroll over it) there is a lil square looking icon with dots on the corners and a dot in the middle. Click that button and you can adjust the image by dragging the little squares on the image in your file with your mouse. After you have adjusted the image go to Selections-Select None. Next you may want to add some text to your image. To do this look at the left toolbar again and click the button that is an A. Now click where you want the text to go, once you do this a box will come up, adjust the font size etc. on the toolbar above your file, then type in the text you wish in your picture. After you typed in the text and hit ok you can move the text where ever you want on the image and edit it if you want. If you want now you can explore the other tools and play around with your file, if you just want to move on go to File and Save(Save As) the file as a .jpg or a .gif (and if you want the best quality save it as a .tga) To make the annimated image you will need several images like this one you have made, so repeat this process acouple of times so we have images to work with in Animation Shop 3.

Step #2
Now that you have your images made we can "combine" them into a little slideshow like thing in Animation Shop. So now open up Animation Shop 3 and go to File on the top toolbar and hit New and set the Height to 150 and Width to 300--then click the Ok button. Now you should have a box labeled Animation 1. Right click in the black part of this box and select Insert Frames->From File. Now start Adding Files to the list in the order you wish them to go in the slideshow/animation. Be sure they are the same size as this animation file(150x300). When you have finished adding your files click the Ok button. Now you should have a line of photos in the order you added them from left to right. Next, we want to delete frames that are blank which we dont want in the annimation. So use the arrows to browse through your frames and click on any frames that are empty and then hit the Delete key on your keyboard. After this, we need to adjust the speed of each frame. This is very simple, just right click the frame and hit Frame Properties and there should be a box with "Display Time (in 1/100th sec): #." Put in how long you want the slide to be displayed for in your annimation, note that every 100 units equals 1 second. Do this for every other frame in your file/box. After this, you are pretty much done! Go to View and click Animation to few it before saving to see if anything is wrong. Now go to File and Save As. You will have to adjust a little bar for Size and Quality, i always just push mine up to Best Quality and you should too. =P Then just hit Next about 3 times and YOU JUST MADE A ANIMATED .GIF YOUR SO FUGGIN COOL!


FAQ
Q: There is a box in upper right hand corner that says lines and it has a series of different lines like barbed wire etc. and it is running it through the text and I cant seem to figure out how to stop it from doing that.
A: The lines for the type of line you want are NOT for like underlining but they are for like the kind of line the letters will be made from. It is best just to keep the line a normal line.

Narelle
23rd Feb '07 Fri, 00:17
Tnx nice post!!!:clap:

tartimorion
23rd Feb '07 Fri, 12:29
as marky have said, nice post! makakatulong din to sa mga gustong matuto ng simpleng animation..

hoe311
3rd Mar '07 Sat, 22:44
tnx bro..nice post..try ko to..:)

diospada11
3rd Mar '07 Sat, 22:48
nice post bro! Ngaun marunong na ako gumawa ng animations... Tnx!

em0ter0
4th Mar '07 Sun, 10:33
kaya ko kayang gumawa ng animation? :)

anyway yung Photoshop 7.0 ba hindi siya kapareho ng Photoshop CS2?

hoe311
5th Mar '07 Mon, 03:12
hhmmmm..d ko alam eh..hehe..anong photoshop ba gmit mo??
meron akong photoshop cs2..mganda daw un kaya lng baguhan pa lng ako dun kaya kapa kapa pa lng..

em0ter0
5th Mar '07 Mon, 04:21
hhmmmm..d ko alam eh..hehe..anong photoshop ba gmit mo??
meron akong photoshop cs2..mganda daw un kaya lng baguhan pa lng ako dun kaya kapa kapa pa lng..

yung cs2 pala ay 9 yun, 7.0 lang kasi yung meron ako.. pero meron na ako installer ng cs2.. :)

zan1731
30th Mar '07 Fri, 00:09
nice post bro! Ngaun marunong na ako gumawa ng animations... Tnx!

magkaiba sila in the sense na nde integrated ung animation option sa photoshop7. kelangan mo pang gamitin ung imageready. sa cs2(9) integrated na. pero meron parin shang kasamaang imageready.. :)

firebandit
15th Jul '07 Sun, 02:17
:clap:

.rika
29th Jul '07 Sun, 21:26
this thread really helps those who want to learn :thumbsup:

rentao_15
29th Jul '07 Sun, 22:24
ma-try nga ito.. thanks.... :thanks:

KONOG
29th Jul '07 Sun, 22:51
huhu try ko nga ito
bawala pala kasi yung sig ko masyado malaki yung file na nagawa ko using macromedia fireworks

thanks sa tutorial na ito

nestah2005
29th Jul '07 Sun, 23:03
dba maz easy to make an animated pics sa imageready???? :salute: :salute:

neyney00
17th Sep '07 Mon, 08:38
anu po ba system requirements nitong jasc photoshop at animation shop?

Mcmms
17th Sep '07 Mon, 20:00
well mababa lang naman ang req. nya brah kaya na ng pc ngayon yan..

shockwave_r13
4th Aug '08 Mon, 19:11
ok po ntry ko n po... panu po gagawin pag nexpire n ung animation shop 3?????

alkaid14
6th Aug '08 Wed, 10:46
mukang maganda to!! try ko to..

alkaid14
14th Aug '08 Thu, 13:36
huwaahh!!! maeexpired na!!! anu gagawin naten dito?

kram08
31st Aug '08 Sun, 18:43
ung cs3 wala na imageready..kaya ang hirap gumawa ng animation...

exzibit15
14th Sep '08 Sun, 10:05
Eto po ung PATCH para hindi na maexpire ung JASC ANIMATION SHOP 3

hit :thanks:

shockwave_r13
16th Sep '08 Tue, 09:31
panu po gamitin yung patch????
pagclick ko po kc sa ans305_patch.exe ang cnasabi po cannot open file...
help po............

Darth Maul
16th Sep '08 Tue, 10:05
_______

interesting post. lots of stuffs in this planet.


:salute: