1. Necessary Software
I use Jasc's Paint Shop Pro and its included Animation Shop program for all of the heavy lifting. I know that PhotoShop and Image Ready are alternatives (and there are others). If I do not have access to an avi or mpeg file for the raw material which will be used in creating the avatar, I use PowerDVD to grab DVD frames.
2. The Raw Material
If you want to use a movie clip for your raw material, you need to have a keen eye for a clip that will look good when looped. A choppy and readily noticeable loopback (IMHO) detracts from the avatar's impact. Some clips may look good when looped without any modification.
If I am working with raw material from a widescreen movie, I just work with the frames in their original widescreen format. It's easy to resize the animation to TXB's requirements later in the process (discussed below).
Of course, you don't have to use movie clips to have a cool animated avatar. See TFX's, SaveTheDay7's, Candypants' and Tony Montana's avatars for examples.
3. The Aesthetics of Looping
Others may require some tricks, such as a well timed flash of light at the loop (see Bucket's Matrix avatar or Lifthz's Arwen avatar) or you may be able to reverse the sequence of frames so that you go from A to B to C to B to A. I did that with my original pulsing, glowing Loc Nar avatar and I think Lifthz' Arwen avatar incorporates some of that, though it is hard to spot (which is good). Also, image transition effects such as morph, fade, and dissolve work well to hide looping or ease frame transition.
I'm sure there are countless other ways to disguise looping, and I'd like to hear other suggestions. The workarounds are limited only by your creativity. For example, I recently made Fry's Family Guy t.v. avatar and struggled with a way to handle the looping of the extended cartoon clip. I finally decided that I would make it look like the t.v. was "stuck" and repeatedly cuing up the scene, like you can do with a dvd AB playback routine. I made a glowing button and stuck it on the t.v. and made it blink as if it were resetting the scene at the end of it.
4. Display Timing
I have discovered through trial and error that IE6 can only display an animated gif avatar at a speed of 10/100ths of a second per frame or slower. IIRC, movies are encoded at 24 frames per second. I used PowerDVD to step through the scene and grab the frames for my Balrog Emoting avatar. When I made the avatar using each frame that comprised the scene, it ran in slow motion. Animation Shop allows you to preview your animated gif in a web browser so that you can see what it will look like in practice (which would be identical to how it would appear here at TXB's forums). I'm sure other animation programs would let you do such a preview. So, to get my Balrog avatar to run at near film speed, I simply eliminated all of the even numbered frames. That got the speed to twelve frames per second. The best IE6 can do is 10 frames per second, so that's close enough for most purposes.
Display timing is also critical for aesthetic purposes. Slowing or speeding up the display time of the frames in your avatar can have a huge impact. Back to the Family Guy t.v. avatar I made for Fry, I simply had the t.v. dark screen frame hang for 2-3 seconds before it recycled and kicked back on.
5. Work with Multiple Copies of your Animated Gif
Animation Shop allows me to make multiple duplicates of the animation I am working on. I've found it saves a lot of your trial and error time to immediately make a duplicate of your imported raw material and work with the duplicate. Then, anytime you make significant progress and want to try out a new path with the animation, make another duplicate and continue with the duplicate. That way, it's easy to go back to an earlier stage if you wish to abandon your latter stage. I just think of them as saved games.
6. Thoughts on the Image Size of the Avatar
The maximum image size of a TXB avatar is 100 by 100 pixels.
If you really want a widescreen avatar and your raw material is a widescreen movie, you can just resize the animation to 100 pixels wide with the "keep aspect ratio" box checked and you will be good to go. But that's not always the best looking solution.
You might instead have widescreen raw material, but all the action you want in your avatar is in the middle. To focus on the middle and increase the size of the avatar to use all of the available 100 by 100 pixel box, you can simply use the cropping tool to draw a perfect square box (it does not matter what size as long as it is a perfect square, e.g. 434 x 434 pixels - it has to be square so that the end size of 100 x 100 does not distort the images) around the first frame in the series which will define the area for the entire avatar. In Animation Shop, when I draw the box around the first frame, it automatically draws the same box in the same spot on the other frames.
Once you draw this box, you can use the move tool to get it just where you want. When you do that, you can then use the slider to run your animation manually so that you can see how the animation will play in the box you have defined. When you do this, you may see that you need to make minor adjustments in the box location.
You might also see that the box is great for most frames but not all, which may require you to manually slide some of the frames with action outside the box so that their action falls in the box. The backdrop of the frame in Animation Shop is a checkerboard, which can be easily used to gauge your slide points so that you slide all related frames over the same distance when necessary.
Once you are satisfied that all of the action is in your defined box, just double click the crop tool. Now, you will have a perfectly square avatar. You then can resize it to 100 x 100 pixels without causing any distortion in the picture.
7. Optimizing the File Size of Your Avatar
A TXB avatar must be less at or than 122880 bytes. It's very easy to be over that mark with your initial work.
The program I use, Animation Shop, has an extensive optimization wizard to guide you through the process of optimizing your animated gif to reduce its file size. You can play around with different settings to try to preserve the best image quality while still getting it under the file size cap. Also, you can't always trust what your animation program reports as the size of the file. I always go into My Computer to check the file properties to make sure I know the exact size of the file.
If even after running the optimization program you are over the size limit, you need to eliminate some frames. Some tricks to hiding that are to see if you can eliminate redundant images by freezing a frame for an extended period. For example, in Fry's avatar referenced above, there was a scene where a grappling hook latches onto a light fixture. Once the hook grabbed, there were a number of redundant frames to show that the hook was solidly on. I eliminated all those and just held the one frame showing the grab for a second or two by changing the display timing of that frame. If you used transition effects, you can shorten those by reducing the number of frames in the transition. These are hard choices, but in the ones I've worked on, a suitable solution eventually presented itself through trial and error (which again makes those duplicate animation sets handy).
8. Get Feedback
Once you've got the avatar at the acceptable size limits and you're happy with it, go to the Rate The Avatar thread here and rate the one above you so that someone can come along and rate yours and, hopefully, provide some useful feedback. Finally, don't be afraid to ask questions and have fun!
9. If you get stuck, search the web or ask here at TXB
If you get stuck, you can ask your question on the TXB Website and Graphics forum, but don't forget about a google or yahoo search for "animated gif" and "tutorial" and the software program you are using. You'll get a lot of hits.
10. Share Your Knowledge
If you learn or already know a nifty new shortcut, technique or tip not covered above, post it here
I use Jasc's Paint Shop Pro and its included Animation Shop program for all of the heavy lifting. I know that PhotoShop and Image Ready are alternatives (and there are others). If I do not have access to an avi or mpeg file for the raw material which will be used in creating the avatar, I use PowerDVD to grab DVD frames.
2. The Raw Material
If you want to use a movie clip for your raw material, you need to have a keen eye for a clip that will look good when looped. A choppy and readily noticeable loopback (IMHO) detracts from the avatar's impact. Some clips may look good when looped without any modification.
If I am working with raw material from a widescreen movie, I just work with the frames in their original widescreen format. It's easy to resize the animation to TXB's requirements later in the process (discussed below).
Of course, you don't have to use movie clips to have a cool animated avatar. See TFX's, SaveTheDay7's, Candypants' and Tony Montana's avatars for examples.
3. The Aesthetics of Looping
Others may require some tricks, such as a well timed flash of light at the loop (see Bucket's Matrix avatar or Lifthz's Arwen avatar) or you may be able to reverse the sequence of frames so that you go from A to B to C to B to A. I did that with my original pulsing, glowing Loc Nar avatar and I think Lifthz' Arwen avatar incorporates some of that, though it is hard to spot (which is good). Also, image transition effects such as morph, fade, and dissolve work well to hide looping or ease frame transition.
I'm sure there are countless other ways to disguise looping, and I'd like to hear other suggestions. The workarounds are limited only by your creativity. For example, I recently made Fry's Family Guy t.v. avatar and struggled with a way to handle the looping of the extended cartoon clip. I finally decided that I would make it look like the t.v. was "stuck" and repeatedly cuing up the scene, like you can do with a dvd AB playback routine. I made a glowing button and stuck it on the t.v. and made it blink as if it were resetting the scene at the end of it.
4. Display Timing
I have discovered through trial and error that IE6 can only display an animated gif avatar at a speed of 10/100ths of a second per frame or slower. IIRC, movies are encoded at 24 frames per second. I used PowerDVD to step through the scene and grab the frames for my Balrog Emoting avatar. When I made the avatar using each frame that comprised the scene, it ran in slow motion. Animation Shop allows you to preview your animated gif in a web browser so that you can see what it will look like in practice (which would be identical to how it would appear here at TXB's forums). I'm sure other animation programs would let you do such a preview. So, to get my Balrog avatar to run at near film speed, I simply eliminated all of the even numbered frames. That got the speed to twelve frames per second. The best IE6 can do is 10 frames per second, so that's close enough for most purposes.
Display timing is also critical for aesthetic purposes. Slowing or speeding up the display time of the frames in your avatar can have a huge impact. Back to the Family Guy t.v. avatar I made for Fry, I simply had the t.v. dark screen frame hang for 2-3 seconds before it recycled and kicked back on.
5. Work with Multiple Copies of your Animated Gif
Animation Shop allows me to make multiple duplicates of the animation I am working on. I've found it saves a lot of your trial and error time to immediately make a duplicate of your imported raw material and work with the duplicate. Then, anytime you make significant progress and want to try out a new path with the animation, make another duplicate and continue with the duplicate. That way, it's easy to go back to an earlier stage if you wish to abandon your latter stage. I just think of them as saved games.
6. Thoughts on the Image Size of the Avatar
The maximum image size of a TXB avatar is 100 by 100 pixels.
If you really want a widescreen avatar and your raw material is a widescreen movie, you can just resize the animation to 100 pixels wide with the "keep aspect ratio" box checked and you will be good to go. But that's not always the best looking solution.
You might instead have widescreen raw material, but all the action you want in your avatar is in the middle. To focus on the middle and increase the size of the avatar to use all of the available 100 by 100 pixel box, you can simply use the cropping tool to draw a perfect square box (it does not matter what size as long as it is a perfect square, e.g. 434 x 434 pixels - it has to be square so that the end size of 100 x 100 does not distort the images) around the first frame in the series which will define the area for the entire avatar. In Animation Shop, when I draw the box around the first frame, it automatically draws the same box in the same spot on the other frames.
Once you draw this box, you can use the move tool to get it just where you want. When you do that, you can then use the slider to run your animation manually so that you can see how the animation will play in the box you have defined. When you do this, you may see that you need to make minor adjustments in the box location.
You might also see that the box is great for most frames but not all, which may require you to manually slide some of the frames with action outside the box so that their action falls in the box. The backdrop of the frame in Animation Shop is a checkerboard, which can be easily used to gauge your slide points so that you slide all related frames over the same distance when necessary.
Once you are satisfied that all of the action is in your defined box, just double click the crop tool. Now, you will have a perfectly square avatar. You then can resize it to 100 x 100 pixels without causing any distortion in the picture.
7. Optimizing the File Size of Your Avatar
A TXB avatar must be less at or than 122880 bytes. It's very easy to be over that mark with your initial work.
The program I use, Animation Shop, has an extensive optimization wizard to guide you through the process of optimizing your animated gif to reduce its file size. You can play around with different settings to try to preserve the best image quality while still getting it under the file size cap. Also, you can't always trust what your animation program reports as the size of the file. I always go into My Computer to check the file properties to make sure I know the exact size of the file.
If even after running the optimization program you are over the size limit, you need to eliminate some frames. Some tricks to hiding that are to see if you can eliminate redundant images by freezing a frame for an extended period. For example, in Fry's avatar referenced above, there was a scene where a grappling hook latches onto a light fixture. Once the hook grabbed, there were a number of redundant frames to show that the hook was solidly on. I eliminated all those and just held the one frame showing the grab for a second or two by changing the display timing of that frame. If you used transition effects, you can shorten those by reducing the number of frames in the transition. These are hard choices, but in the ones I've worked on, a suitable solution eventually presented itself through trial and error (which again makes those duplicate animation sets handy).
8. Get Feedback
Once you've got the avatar at the acceptable size limits and you're happy with it, go to the Rate The Avatar thread here and rate the one above you so that someone can come along and rate yours and, hopefully, provide some useful feedback. Finally, don't be afraid to ask questions and have fun!
9. If you get stuck, search the web or ask here at TXB
If you get stuck, you can ask your question on the TXB Website and Graphics forum, but don't forget about a google or yahoo search for "animated gif" and "tutorial" and the software program you are using. You'll get a lot of hits.
10. Share Your Knowledge
If you learn or already know a nifty new shortcut, technique or tip not covered above, post it here
Corel PaintShop Pro X5 SP1 v15.1.0.10
In
an exploding digital imaging market, Paint Shop Pro Photo rises above
the rest. With the unparalleled power of Automated Productivity
Scripts™ and Dynamic Personalization™, Paint Shop Pro Photo increases
productivity and enhances workflow like no other digital imaging
software on the market. Paint Shop Pro Photo is your complete solution
for print and Web. Paint Shop Pro Photo,
a part of the Paint Shop family of digital imaging and photography
products, is the most complete, easy-to-use software for creating
professional digital imaging results. By combining automatic and
precision tools with an integrated learning system, Paint Shop Pro
Photo helps you produce professional results with power and ease.
Filled with one-of-a-kind photo tools sure to please even the most
discerning photographer, Corel® Paint Shop Pro® Photo is the ideal
choice for people who want extraordinary photos.
Corel® PaintShop Photo™ Pro X3 gives you the power to easily organize, edit and share professional-quality photos—fast. Ideal for DSLR cameras, it combines photo organization, easy batch processing, creative projects, sharing, and now HD video slideshows and a new
Corel® PaintShop Photo™ Pro X3 gives you the power to easily organize, edit and share professional-quality photos—fast. Ideal for DSLR cameras, it combines photo organization, easy batch processing, creative projects, sharing, and now HD video slideshows and a new
RAW Lab
Loc Nar teamxbox.com
Posts
