Tag Archives: AnimatedGIFTutorials

The Good and The Friendly

"Get Offa My Porch, Clint!" animatedGIF by @iamTalkyTina

“Get Offa My Porch, Clint!” animatedGIF by @iamTalkyTina

Well, it was the True Friend who at one time thought that I was the nemesis of him and made mean words at me all the time, but I sorted him out in The Rumble, my True Friend Ben (@techsavvyed) who made an MBS (@mbransonsAnimated GIF Assignment #1896 called Get Off My Porch with my good buddy called Clint Eastwood as The Man with No Name earlier this evening for #western106 and it caught my attention so I did it too. Because that is how we ride on the range in #ds106.

The assignment as written by Michael provides the source GIF of Clint Eastwood with a nice transparent background. The process to complete the assignment requires that you open the GIF in your photo editor (GIMP or Photoshop), and add your chosen background image below all of the existing GIF layers so that it shows behind each frame. Save the GIF back out as a revised file and you should be done! An easy 3 stars! (Or are they bullets, in #western106?)

Making the GIF File Size Smaller

The transparent GIF provided for this assignment has 105 frames (one is missing!) and weighs in at a paltry 18.9 MB. Actually, that’s huge for a GIF. We need it to be smaller!

Getting your GIF file size down but still looking good is a holdover from before the days of broadband Internet. Back in the original days of 1986/87 when peoples only had like a 2400 baud modem, it took forever to download graphics so CompuServe invented the GIF and you had to make them small. So it’s still a thing.

Some things that I did to make the GIF a bit smaller in file size were:

  • to take out a bunch of the frames
  • to use the same frames moving away from me as I used in looking towards me
  • to make it into a black and white one
  • to make the dimensions of it smaller (to 600 pixels wide, which is good for my WordPress, plus that Tumblr).
  • to fiddle with the GIF settings on the way out of Photoshop (type of, dimensions, dithering percentage, number of colours)

Some things that I did that made the GIF a bit bigger again (but better)

  • to add in the double take, which meant more frames in the GIF but also more story.

In the end, I compromised with a file size of 1.7 MB for a black and white GIF at 600 x 337 pixels with 30 frames.

Clean Up On The Porch

Because I used my favourite personal iconic photo of me called Midnight Scrapbooking as the background, I noticed that there was a white outline around Clint in all of the frames that made it look more fake than it should have. So I used a special Photoshop trick that got rid of a lot of the pixel borders that were white right around the Clint cutouts.

In this GIF you can see how I fixed it to make it look better and not fake. It shows the process as applied to ONE frame in the original Get-Off-My-Porch source GIF.

Removing Outline GIF by @iamTalkyTina

Removing Outline GIF by @iamTalkyTina

FOR EACH FRAME (!!)

  1. Click on the layer’s thumbnail in the Layers palate with the Command (Ctrl on PC) key down to make the dancing ants around Clint’s existing self
  2. Use Select >> Modify >> Contract (3 pixels) to make the ants dance in a slightly smaller perimeter
  3. Use Select >> Inverse to select everything OUTSIDE of that slightly decreased perimeter, which is basically the white outline stuff that you don’t want.
  4. Use the eraser over the dancing ants to basically remove all of the pixels outside of the slightly reduced dancing ants perimeter.
  5. Deselect everything and maybe tidy up any little white bits that might still remain, but there weren’t any.
  6. Repeat for each frame that you need to get rid of the outline for (all of the ones that you want to use).

ENJOY!