Friday, June 4, 2010

Animated avatar

After browsing Twitter for new people to follow, I noticed some people had avatars which were animated. I was confused at first as Twitter only allows you to upload one pic as your profile picture, so how could you have an animation?

After searching around the internet I discovered that by using Photoshop you could save a series of images as a .gif or .png file, and use that as a single picture file.

To create an animated avatar simply open Photoshop and have a single layer for each complete frame of the animation, select each layer (using the shift key to select multiple frames), then with all frames selected go up to the 'window' tab on the main bar and select 'animation' from the drop down menu. A single frame (layer 1) should appear on the left side of the box which has just appeared. In the top right of the animation window box, click to open the drop down menu, and select the option 'make frames from layers', now each frame should appear individually across that box (like the original image which appeared when you first opened the animation window). The final step is to change the timings for each frame from the drop down box under each frame. Once complete you test with the play controls on the bottom left of the animation window, then when you are happy with the results, save for web like a normal gif, BUT make sure that the 'looping options' are set to 'forever' before you click the final save button.

You now have an animated .gif file which you can use, however Twitter have since stopped you from uploading animated gifs to their site, only originals now exist. As this was the reason for me to create mine I know have to figure out what I intend to do with it now, as I feel it is too good to just sit here, even if I do say so myself. J!

(Please note that the animation doesn't work on this site, this post is a copy from my main blog hosted on my main site)

No comments:

Post a Comment