Gif related questions... any answers?
Hey guys, a couple things-
First, what kind of gif making software do you guys use? I use Adobe Photoshop (Image Ready). Its "ok", but it has a major problem. Any time I export a gif from it, using efficient settings (for web, etc), it still has a file size of about 10kb per frame. (so a ~2 second, 45 frame gif would be 450 KB). That's just too large for most sites and I'm sure the bigger the filesize, the more it would bog down the gamethreads. Ideally, I'd like something that can do 3-5 KB per frame and look essentially lossless. The smallest gif I've gotten out of Image Ready is 5kb/p, but it looks like garbage. Any suggestions?
Second, are there any golden rules for posting gifs in the threads here? I know you guys prefer stuff small, how big is the biggest tolerable size (resolution size or KB size)?
Any help, especially about gif programs would be very appreciated. I remember I saw a comment in a Fieldgulls thread back in August I think, in which some highly recommended gif making programs were tossed around. I'm kicking myself for not writing them down. : (
A place to bury strangers.
25 comments
| Add comment
Comments
Sorry, I don't know much about image software.
But you can probably find the thread through the search feature in the top right of this site because SBN has a really great search system.
"Mayhap a hidden door lurks nigh. Let us search the environs."
by Fearless Frog on Oct 25, 2009 10:21 AM PDT reply actions 0 recs
Get the source video
Reencode it to an MPEG1 and trim it down to the right length, open it up with Virtualdub, crop the video, convert it to a gif.
by BrianL on Oct 25, 2009 10:54 AM PDT reply actions 0 recs
good thread on it
http://forums.somethingawful.com/showthread.php?threadid=3035804&userid=0&perpage=40&pagenumber=1
It's Great to be a Florida Gator!
Next year's notable Ex-Seahawks:
Walter Jones, Patrick Kerney, Seneca Wallace, Jordan Babineaux, Kelly Jennings
by Wayward Llama on Oct 25, 2009 3:12 PM PDT reply actions 0 recs
Nice thread. (and thanks)
Sadly its exactly what I was already doing. However it is nice knowing I wasn’t doing anything wrong. Maybe I should adjust my expectations. The tip about “90 colors” was a good suggestion though. I will definitely have to try that tomorrow.
by kearly on Oct 25, 2009 11:13 PM PDT up reply actions 0 recs
I still use photoshop.
You can size down by compressing and also limiting the size of the image.
NEEDS MORE FREEDOM!
by Scruffy Lefty on Oct 25, 2009 6:07 PM PDT reply actions 0 recs
Yeah, its not good enough
120×120 is 10kb per frame, and if i boost the lossyness, it looks horrible at 5kb per frame.
by kearly on Oct 25, 2009 10:58 PM PDT up reply actions 0 recs
Well what are you trying to get it down to?
NEEDS MORE FREEDOM!
by Scruffy Lefty on Oct 26, 2009 10:27 AM PDT up reply actions 0 recs
Kearly... depends what your end use will be.
For example: If you were intending to make the clip into a Fan Post type of piece, the best thing you can do is to host it outside the server (youtube for example) and embed your clip into your post. Keeps this side lean.
However…
If your intent is to embed an inline comment “animation”, there are 3 factors that will influence load times.
Loadtime is determined by three factors:
1. Number of frames in the animation: the fewer the frames, the faster-loading the animation. Remember that if you can use a frame more than once it will extend the length of your animation without extending load time.
2. The file size of each individual frame. GIF animation frame size is determined by the same rules that govern GIFs in general: low bit depth and long runs of flat color make the leanest files. Highly dithered or photographic images make the slowest, fattest files.
3. Frame optimization. With highly optimized frames, each new frame is able to reuse most of the background of the previous frame, so that only the new or moving part of the next frame needs to be downloaded.
I like Photoshop for making these because you are able to control and setup your frames exactly as you like. Converter programs wont have that “artistic eyeball test” when compressing and optimizing.
Bring Your Game, Leave Your Name.
by iverson2169 on Oct 25, 2009 11:17 PM PDT reply actions 0 recs
Creating optimized Gif's is an art form in and of itself.
Bring Your Game, Leave Your Name.
by iverson2169 on Oct 25, 2009 11:18 PM PDT up reply actions 0 recs
Thank you Iverson for your input
Point #3 is not something I considered. Thank you.
Regarding point #2, I know in video editing, the size of the original file you edit is essentially irrelevant because you recompress the video. Editing guides often encourage people to use the highest size, most lossless original source when editing (such as direct DVD rips like .VOB or a HuffyUV basic avi).
However, from what you are saying it sounds like GIF editing is a different case? If I used HD, high size images to make my gif, would that gif be larger than one made from a smaller format? If so, that would explain a lot, since I’ve been editing with HD (.PNG) format images instead of the smaller alternatives like JPEG or Bitmap since I figured the process would be the same as video editing where the images would be transferred into a wholly new created (and compressed) image and the original file sizes would be irrelevant. If so, that makes a lot of sense. I’ll definitely have to try re-acquiring the frames in a smaller format like JPEG and give it a go.
by kearly on Oct 25, 2009 11:27 PM PDT up reply actions 0 recs
Your more than welcome...
and yes… for Gif animating (depending on the intended function), I would always take them back into photoshop for edit. It can be a bear to do, but it is the only way to guarantee your getting the most optimized frames.
Any compression program will still interpolate frames into some sort of dithered formatting. Remember that any type of dithering at all, will increase your file size. In photoshop, I like to do my own dithering in the “index” mode under Image-Mode… Here you can set the % dither to you choosing. After indexing, you can go back in and remove artifacts and useless dithering at your discretion with the pencil tool (not paintbrush tool because that will create blending).
Bring Your Game, Leave Your Name.
by iverson2169 on Oct 25, 2009 11:56 PM PDT up reply actions 0 recs
Thanks, Do you happen to know the name of the artifact removing option and where I could find it?
by kearly on Oct 26, 2009 8:59 PM PDT up reply actions 0 recs
The artifact removing would be a manual process...
I usually go in with a pencil (important: not paintbrush) and spot remove artifacts manually. Not only can artifacts be a memory burden, but also a visual issue. it just looks cleaner with touch ups.
Bring Your Game, Leave Your Name.
by iverson2169 on Oct 26, 2009 10:34 PM PDT up reply actions 0 recs
So you use the pencil tool to "delete" the artifact pixels? And then use a matte or something to hide the damage?
by kearly on Oct 27, 2009 12:11 AM PDT up reply actions 0 recs
Yes and/or yes.....
Whatever you do, there are bound to be those strays… Normally I will either just touch up the large areas containing stray pixels with a pencil… or yes… just mask the entire background out (depending of course on the subject matter).
Bring Your Game, Leave Your Name.
by iverson2169 on Oct 27, 2009 3:12 AM PDT up reply actions 0 recs
Oh wait...no... Misunderstood your question.
I use the pencil to fill color into the artifacts. So instead of deleting them, I “fill” them with the same color as the surrounding pixels.
Bring Your Game, Leave Your Name.
by iverson2169 on Oct 27, 2009 3:16 AM PDT up reply actions 0 recs
Update
In the OP I mentioned that I heard two programs recommended in a previous Fieldgulls post but couldn’t remember them.
I figured out that the first one is GIMP. I’ll give it a shot sometime and report how it performs vs. Image Ready.
by kearly on Oct 25, 2009 11:18 PM PDT reply actions 0 recs
Success
Ok, I spent about 90 minutes today using some of the advice here and experimenting with Image ready. The result was that I made a passably decent looking .gif which contained 53 frames, at a 120×120 resolution, and a 191 KB filesize (3.6 kb per frame).
For future reference, if anyone looks up this thread later, here are some things I learned that helped me get there.
#1: Resize > Crop. It seems counter-intuitive, but if you have to choose between cropping an image or crunching it down with resize, choose resize if you can. Files that are resized are smaller than cropped ones. This surprised me because I would have assumed they’d be the same, but as it turns out resize is significantly more efficient. That helped get my file size down today because before I was half-resizing and half-cropping. Of course, if you have to crop then do it, but if its an either/or situation, resize as much as you can get away with.
#2: 0% Dither. The default for images is 100% dither. If you reduce it to 0%, you cut the file size almost in half! The trade off is fuzzy lighting, but if you are editing a fairly static gif with not much light changes (like pretty much any baseball or football gif), it only hurts the quality very slightly. In some cases, there were a few gifs I worked on that looked better at 0% than 100%! Even reducing the dither to 50% can cut the filesize by a third, but I personally think 0% is the way to go if you can get away with it.
#3: For image ready: Use the “4-up” tab on the image viewer. It allows you to see multiple settings at a time and how they look vs. each other.
#4: Turns out gif making is just like video editing, it doesn’t matter what source you use or how big it is, the final product will still be the same size. For that reason, its best to use the best quality images and if possible ones that are processed quickly. I think Bitmap is perfect, since Bitmap format is high quality and processes the fastest of any type I tried. JPEG or whatever is fine too, just make sure its 100% quality images you are working with.
#5: “Lossy” setting should be kept a 0. Fuck lossyness. Very little savings in filesize and much quality lost.
#6: “90 colors” is a very good setting (in Image Ready, choose “selective” in the optimize box). I couldn’t tell the difference really between 90 and 256, and 90 is significantly smaller. Much lower than 90, and the quality starts to take a big hit. So I think 90 is kind of a magic number of sorts for efficiency.
I think that sums it up. Thanks everyone for your input.
by kearly on Oct 26, 2009 9:17 PM PDT reply actions 0 recs
Ah!!! Glad you used the dither trick...
It’s one of the single best things you can do for file size reduction. What even most graphics pro’s dont realize is that any old 50×50 gif isn’t the same file size as another 50×50 gif.
Your final output size is outstanding for 53 frames. Good work.
Bring Your Game, Leave Your Name.
by iverson2169 on Oct 26, 2009 10:38 PM PDT up reply actions 0 recs
PS: Any chance we can see your "baby"?
Bring Your Game, Leave Your Name.
by iverson2169 on Oct 26, 2009 10:41 PM PDT up reply actions 0 recs
Here you go
Sadly I don’t have any Huskies/Seahawks footage worth a damn right now- so I had to practice using some anime clips.
Details:
1- Source: D.Gray Man. 120×120 resolution. 181 KB
2- Source: t.a.k.n. Railgun. 120×120 resolution. 239 KB
3- Source: t.a.k.n. Railgun. 120×120 resolution. 249 KB
by kearly on Oct 27, 2009 12:27 AM PDT up reply actions 0 recs
Very Cool...
And it’s clear that the 0% dither had nearly no affect at all. In fact, the only objectionable portion of the 0% would be the “banding” in some of the glows.
Bring Your Game, Leave Your Name.
by iverson2169 on Oct 27, 2009 3:18 AM PDT up reply actions 0 recs

by 



















