[proof of concept]

you're right about gifs using the LZW compression schema. It's pretty garbage for images, even with such a low cap on the color palette. For animations it just LZW encodes each frame and stores them sequentially in the file, bracketed with some descriptive metadata. The main space savers are using a global color palette, reducing the palette size by half so that the code table can use fewer bits, and using transparency for pixels that don't change color from the previous frame, which, depending on the image, may not even do anything on its own. Also if the change in a subsequent frame happens entirely within some rectangular portion of the image you only need to encode the color info for that group of pixels, but that probably won't ever apply to your stuff, assuming photoshop even looks for that at all.

If you really want to get the filesize down you have to start shedding information even beyond what you're already doing by reducing the frame size and color palette. The main ways to do this are letting photoshop set pixels on subsequent frames to transparent when aren't exactly the same color values as long as they're still pretty close; and by using lossy LZW compression which encodes pixel groups the same way as similar but not equivalent groups that have already been put in the dictionary as long as they're similar enough. Both of those are broad-strokes, global things to do and results will vary widely depending on image content and how much leeway you give the algorithms.

If you want to maximize quality:file size then you're going to have to get elbow-deep in each image and do something to reduce noise in solid-shaded areas in a given frame, and inter-frame noise that happens when pixels that should stay the same change color. Or do things like blur out background details when all the action is up front.

 

[proof of concept]

@proof of concept Another thing that's obviously challenging is any sort of color gradient. I'm either gonna have a lot of dithering, a lot of banding, or use a ton of palette slots on it. Do you know of any tricks to working with those?

yeah, make mp4s instead of gifs and you'll get to do all the video editing with none of the quality compromise and the end product will be like 1/10th the size

 

[Parallax Skull]

@proof of concept Another thing that's obviously challenging is any sort of color gradient. I'm either gonna have a lot of dithering, a lot of banding, or use a ton of palette slots on it. Do you know of any tricks to working with those?

yeah, make mp4s instead of gifs and you'll get to do all the video editing with none of the quality compromise and the end product will be like 1/10th the size

yeah but i make gifs lol

i already make mp4s of everything i edit first before converting it. so for every gif i post i have a higher quality version of it on my hard drive.

 

[Parallax Skull]

you're right about gifs using the LZW compression schema. It's pretty garbage for images, even with such a low cap on the color palette. For animations it just LZW encodes each frame and stores them sequentially in the file, bracketed with some descriptive metadata.

So does it start over and make a new dictionary for every frame?

The main space savers are using a global color palette,

I think I'm using one? Maybe?

letting photoshop set pixels on subsequent frames to transparent when aren't exactly the same color values as long as they're still pretty close

This one sounds interesting.

using lossy LZW compression which encodes pixel groups the same way as similar but not equivalent groups that have already been put in the dictionary as long as they're similar enough.

Some DB/DBZ footage has a "dirty" enough look that I can get away with doing some lossy compression, but DB Super is way too clean since it's made on computers like all modern cartoons, so lossy compression usually isn't a good option. I usually avoid doing any lossy compression at all.

If you want to maximize quality:file size then you're going to have to get elbow-deep in each image and do something to reduce noise in solid-shaded areas in a given frame, and inter-frame noise that happens when pixels that should stay the same change color. Or do things like blur out background details when all the action is up front.

This all sounds like it has potential, particularly the last part.

 

[Parallax Skull]

letting photoshop set pixels on subsequent frames to transparent when aren't exactly the same color values as long as they're still pretty close

Is there something I can look up to get started on this one?

 

[proof of concept]

@proof of concept Another thing that's obviously challenging is any sort of color gradient. I'm either gonna have a lot of dithering, a lot of banding, or use a ton of palette slots on it. Do you know of any tricks to working with those?

yeah, make mp4s instead of gifs and you'll get to do all the video editing with none of the quality compromise and the end product will be like 1/10th the size

yeah but i make gifs lol

i already make mp4s of everything i edit first before converting it. so for every gif i post i have a higher quality version of it on my hard drive.

images with smooth color gradients you're not going to be able to do much about. Smooth transitions means lots of colors and you've only got 256 slots. 255 actually, since transparency takes up a palette slot.

as far as filters go I have some ideas but I'd have to look at how photoshop handles that sort of thing, I'm more used to applying filters to a whole image so that I can properly do object segmentation/identification, and on natural images captured with shitty cameras, so I don't know how well that would translate to working on irregularly shaped regions of cartoons in photoshop's gui

So does it start over and make a new dictionary for every frame?

yes, unless you tell it to use a global one.

I think I'm using one? Maybe?

probably you are, iirc it's a checkbox in the gif export menu

using transparency for pixels that don't change color from the previous frame

This one sounds interesting.

this is a built-in option in photoshop, iirc somewhere along the bottom with controls for the frames after you've loaded the frames. ezgif also has a tool for it

Some DB/DBZ footage has a "dirty" enough look that I can get away with doing some lossy compression, but DB Super is way too clean since it's made on computers like all modern cartoons, so lossy compression usually isn't a good option. I usually avoid doing any lossy compression at all.

the transparency optimization is lossy too, just in a different way. Pre- and post-digital animation definitely have different characters, particularly in the color consistency department; I imagine dragon ball super footage will respond better to transparency optimization, whereas db/dbz works better with lossy LZW compression and handles dithering way better

If you want to maximize quality:file size then you're going to have to get elbow-deep in each image and do something to reduce noise in solid-shaded areas in a given frame, and inter-frame noise that happens when pixels that should stay the same change color. Or do things like blur out background details when all the action is up front.

This all sounds like it has potential, particularly the last part.

you'll probably have to finagle it to avoid creating smooth gradients, and even then you may end up with sharp steps in color like in the sky above the pagoda in that young goku gif you posted, but it should still help out some I think, since LZW compression is stupid and grosss

 

[Parallax Skull]

One thing that I found surprising is that if I have 5 frames in a row that are literally 100% pixel for pixel identical, I can get a massive filesize reduction by deleting 4 of the frames in photoshop and setting the 5th frame to 5x its original duration. I had assumed .gif could handle that sort of repetition well but I guess not. It's a tedious extra step to do this manually to the photoshop frame animation before exporting, but the filesize reduction is worth it. Maybe there's a way to automate it, although doing it by hand is still useful for frames that are almost the same, which you get with DB/DBZ traditional animation.

 

[proof of concept]

in photoshop I always just did that by hand too since I never used it much and never on anything too big but yeah there is definitely a way to automate it, since that's another one of the tools ezgif has. I'm sure it's build into photoshop somewhere but I never bothered to look it up.

 

[Parallax Skull]

the transparency optimization is lossy too, just in a different way. Pre- and post-digital animation definitely have different characters, particularly in the color consistency department; I imagine dragon ball super footage will respond better to transparency optimization, whereas db/dbz works better with lossy LZW compression and handles dithering way better

Pretty much. Dithering is still useful on Super footage if I want the extra detail you can get by using it.

 

[Parallax Skull]

I can't find a checkbox for using a global color table, so I'm gonna need to look into that and figure out whether or not I'm using one. idk why you would ever not want to use one.

 

[proof of concept]

dithering definitely has its place, where you want to draw the line on it is a purely personal aesthetic judgement. It helps a lot that you do lots of fast action, you can get away with a lot in sequences like that and still look good. I like the results you've gotten by hand-selecting the color palettes a lot, I never would have bothered with that

 

[proof of concept]

I can't find a checkbox for using a global color table, so I'm gonna need to look into that and figure out whether or not I'm using one. idk why you would ever not want to use one.

maybe it does that automatically? Presumably if space is not an issue then having per-frame palettes allows for richer animation. Reducing to a single color palette for all frames is one of ezgif's optimization tools but that site will cram any sequence of stills into a gif, so who knows

 

[Parallax Skull]

I can't find a checkbox for using a global color table, so I'm gonna need to look into that and figure out whether or not I'm using one. idk why you would ever not want to use one.

maybe it does that automatically? Presumably if space is not an issue then having per-frame palettes allows for richer animation. Reducing to a single color palette for all frames is one of ezgif's optimization tools but that site will cram any sequence of stills into a gif, so who knows

I can see the 256 (or 32 or whatever) color table right in front of me as I'm going frame by frame through the gif, and it's the same table the whole time, so it sounds like I'm using a global one.

 

[Parallax Skull]

this thread has gone on too long without a gif

 

[Parallax Skull]

letting photoshop set pixels on subsequent frames to transparent when aren't exactly the same color values as long as they're still pretty close

I haven't used ezgif in ages but I remembered it having something like this so I took a look:

In Photoshop, all I know how to do is turn transparency on/off. Not sure how to give it a tolerance. I'll have to try and figure that out.