GIP: moiré icon

[pne]

See whether your screen can resolve all the dots in the userpic properly or whether you get “beats”, smushed areas, colour banding, or other artefacts :)

Incidentally, I’m a bit surprised that the GIF version of this image was nearly three times the size of the PNG version; my experience had been that for very small images, GIF can win. I guess that’s true only for sub-100-byte files where the size of the header starts to matter, compared to the compression ability.

Edit: saving the icon as a greyscale PNG instead of a palette one shaved another 1/6 off the filesize—now it’s under 100 bytes! (I’m a tad disappointed that the PNGOUT plugin didn’t do that for me in its “Auto” colour type setting.)

Comments

[steorra]

I seem to get no artifacts.

[pne]

Funnily enough, I did when I read this—since I usually read Dreamwidth comment pages at 140%, and my browser scales images along with the text :)

[ewx]

(As you note in your edit) the choice of color depth makes a lot of different to PNG size - the only case I’ve personally found GIF beating PNG it turned out that the PNG was using 24 bit color; the same image encoded as PNG with an 8-bit palette (i.e. the same as GIF) beat GIF.

In this particular instance I’m not surprised that PNG wins, if my memory of how the compression algorithms works is right. For LZ77 (PNG) I would expect a a small number of literals (depending on color depth) and a back-reference for each of the first two rows and then a single back-reference for the entire rest of the image - in LZ77 a back-reference’s length can extend further forward than its distance points back, allowing repetitive strings to be compressed very efficiently indeed. By contrast the length of the back-reference symbols in LZW (GIF) can only grow linearly as input bytes are processed meaning it needs a much bigger “run-up” before it can output a single symbol covering the entire rest of the input.

NB it’s 10 years since I worked on an LZW implementation and longer still since I implemented LZ77 so check with a more definitive source if you want to be sure l-)

[pthalo]

no artifacts here, unless i zoom in in my browser. Though if I zoom in by a certain amount i'm back to no artifacts again. :D

I don't think I got a Moiré pattern though. Instead I saw a grey background with large dark grey squares. (Or does the definition of Moiré include that too? For me, Moiré is when the lines get wavy and appeared rippled)

[pne]

I think strictly speaking, Moiré is caused by interference, as when you have two grids overlaying one another at an angle, so it often looks wavy as you said. I don't know a good word for the kind of effects I'd expect for this icon, though.