Dither

[dotmidi]

To my phototography fiends on the net, how do you guys feel about dithering? What makes you like/dislike it.. Feel free to add whatever to the conversation about Dithering 

Just wanna know how you guys feel about it!

[Melooon]

Cinni sent me this article a long time ago and its really great In Defense of the Poor Image by Hito Steyerl

The poor image is no longer about the real thing—the originary original. Instead, it is about its own real conditions of existence: about swarm circulation, digital dispersion, fractured and flexible temporalities. It is about defiance and appropriation just as it is about conformism and exploitation.

In short: it is about reality.

Thats a totally twisted view point on image compression and I love it 

I guess its an interesting idea to pre-dither or pre-compress your own images; it changes their purpose in the same way that taking a polaroid picture changes its purpose. It become about whats missing as much as whats there. I know many people in the web revival like to do it because its a way of being more anonymous while still showing your physical world; but it also kinda shows your world the way you want it to be.. its a retro world or a dream world of pixelated memories.

And then there's all the mathematic stuff going on about how the algorithm actually does the dithering; I had fun trying out dithering styles when making this lil video.

I guess Im rambling a bit, I mostly wanted to share that article, but I think its a really fascinating topic!

[Commodorn]

I absolutely love dithering. Not just for the look of it, but because it's really easy to edit a dithered image in relatively believable ways. Besides, y'know.. other ways. Like, if I put this image back into MSpaint, I could easily do something like... remove my eyes or make my skin blue since all of the pixels are so clear and predictable. The colors are very solid and limited, too-- so I may only need a paint bucket for most of it!

Really, I love images that encourage your brain to fill in the gaps. It's fascinating how much you can see with so little when you go as far as dithering in 2 bits. The lack of information really makes turning an image into a horrific monstrosity so much more tempting, too...

[Cobra!]

I like Dithering. It reminds me of the DOS/Windows 9x days!

I love seeing how older, more limited machines handle bigger images and how they dither them. Some older CD consoles even did this to videos.

Mega Race is a good example of this, this is the original on DOS:

This is the Mega CD port:

[doubleincision]

i'm extremely pro-dithering!! there's something about the texture it lends to the image that just scratches an itch in my brain...particularly Bayer dithering. i like to incorporate dithering into my art sometimes, i'll play around with it before exporting the final image because it makes it look like something one would see on an early web art gallery.

[Gans]

Yeah, yeah, Dithering for president! Vote for Dithering!

In most cases, you really have to have eagle eyes to spot the difference anyways. At least on a computer screen. Printed out is a different case, there you probably need a soft spot for pixel graphics.

Though some images, when they're about to be converted to 256 colours, do look better without dithering. It's completly situational. My favourite way of dithering is the Bayer-cross-pattern, too. It looks very old-style!

Edit: Found an example of bad dithering. It often ruins my single-coloured plains with these dots.

[Guest]

When I use real life photos on my website, I usually cut their contents out crudely and then use dithering and some other methods to make them look crunchy and "digital". I love it.

[doubleincision]

When I use real life photos on my website, I usually cut their contents out crudely and then use dithering and some other methods to make them look crunchy and "digital". I love it.

i love these!! they have a "digital scrapbook" kind of look to them. they also remind me of the images on oldcomputers.net. something about a picture of an object having no background, just floating on the page, feels so Correct to me.

[Vivian Zane]

Oh man, I love me some dithering! I make pixel art, and when you make stuff like that, you often wanna keep the palette low so it looks more authentic. In order to add more detail, you gotta dither, and I had a lot of fun using it to create dirt textures the other day!

[doubleincision]

i got my hands on a copy of Photoshop 7 today, and i remembered its great "save for web" feature that makes it easy to play with dithering, particularly transparency dithering. i used it to make this little Pierrot graphic for my husband's site


i wish i knew how to keep the pixels looking crisp on mobile screens, though. i've heard there's some tricks to do so, but i haven't looked too much into it. if anyone knows the secretz please share your wisdom with me!

[Guest]

i got my hands on a copy of Photoshop 7 today, and i remembered its great "save for web" feature that makes it easy to play with dithering, particularly transparency dithering. i used it to make this little Pierrot graphic for my husband's site


i wish i knew how to keep the pixels looking crisp on mobile screens, though. i've heard there's some tricks to do so, but i haven't looked too much into it. if anyone knows the secretz please share your wisdom with me!

That looks extremely cool!! I love what dithering does to images... it makes me nostalgic immediately.

As for how to make pixels render sharp on web pages; there is not much you can do because it's a browser decision, but there are some hacky CSS statements that you can use that work on most browsers to signal that images should be rendered as-they-are without filters:

Code

img {	
    image-rendering: optimizeSpeed;             /* STOP SMOOTHING, GIVE ME SPEED  */
    image-rendering: -moz-crisp-edges;          /* Firefox                        */
    image-rendering: -o-crisp-edges;            /* Opera                          */
    image-rendering: -webkit-optimize-contrast; /* Chrome (and eventually Safari) */
    image-rendering: pixelated;                 /* Universal support since 2021   */
    image-rendering: optimize-contrast;         /* CSS3 Proposed                  */
}

This is what I use and it works well. I copied that off Stackoverflow though I think, not original work.

[loren]

it makes me happy to see so much appreciation for dithering! i love how it looks too, and i make heavy use of it on my site. in addition to the nice texture it adds, i find that limiting the color palette helps images from different sources look more cohesive.

[doubleincision]

That looks extremely cool!! I love what dithering does to images... it makes me nostalgic immediately.

As for how to make pixels render sharp on web pages; there is not much you can do because it's a browser decision, but there are some hacky CSS statements that you can use that work on most browsers to signal that images should be rendered as-they-are without filters:

Code

img {	
    image-rendering: optimizeSpeed;             /* STOP SMOOTHING, GIVE ME SPEED  */
    image-rendering: -moz-crisp-edges;          /* Firefox                        */
    image-rendering: -o-crisp-edges;            /* Opera                          */
    image-rendering: -webkit-optimize-contrast; /* Chrome (and eventually Safari) */
    image-rendering: pixelated;                 /* Universal support since 2021   */
    image-rendering: optimize-contrast;         /* CSS3 Proposed                  */
}

This is what I use and it works well. I copied that off Stackoverflow though I think, not original work.

thank you for this! image smoothing is so ugly lemme see them pixels