Esperimenti con il dithering delle immagini

Pubblicato il 10-08-2021 | 2 min di lettura

Ho deciso che era il momento di fare qualche esperimento con il dithering delle immagini.

Ellipse

Di recente ho letto un articolo su Low Tech Magazine in cui Kris De Decker racconta i dettagli che stanno dietro al suo progetto di sito che va ad energia solare. Kris spiega alcuni dettagli che spesso vengono trascurati quando si parla di impatto del mondo digitale, e lo fa in un modo che ho trovato molto rinfrescante rispetto al mainstream.

Per esempio, indica che tra i falsi miti del design digitale moderno c'è la credenza di poter lavorare con risorse infinite. Un designer non considera mai l'impatto che una feature ha sul consumo di energia di un sistema.

Uno degli aspetti che Kris menziona è il peso delle immagini. Il suo sito, nella versione "solar powered", usa solo immagini compresse con la tecnica dither. Il risultato sono immagini notevolmente più leggere, con un'estetica particolare, sicuramente pensata per la funzionalità, ma che in alcuni contesti può risultare persino gradevole.

Algoritmi e strumenti

Ci sono diversi algoritmi per applicare il dithering. Online ho trovato qualche tutorial per lavorarci direttamente in Photoshop, ma ho preferito usare questo tool online che ha anche una serie di preset molto comodi.

Dither in azione

Proviamo il dithering su un gattino.

dithered cat 1

Un gattino che ha subito il cruento processo del dithering partendo dal preset "vaporwave".

L'immagine qui sopra dopo il processo di compressione pesa 20kb. La versione originale pesava 1,3 MB. L'immagine originale aveva più pixel, ma un'immagine che ha subito dithering riesce a comunicare bene il proprio contenuto anche a risoluzioni inferiori.

dithered cat 2

Lo stesso gattino, ma partendo dal preset "Apple II".

Diversi algoritmi applicano il rumore in modo diverso, per cui si ottengono risultati più o meno caotici. Un'immagine che passa attraverso il dithering tollera molto meglio lo sgranamento a livello estetico.

dithered cat 3

Uguale all'immagine precedente, ma esportata a metà larghezza.

Su Low Tech Magazine, Kris usa questa tecnica anche per immagini con del testo. Proviamo con questa tabella:

Immagine Peso
Gattino 0 (originale) 1947.13 kb
Gattino 1 25 kb
Gattino 2 29 kb
Gattino 3 8 kb

dithered table with text

Il dithering riesce a mantenere bene la leggibilità, e forse qualche utente potrebbe persino scambiare l'immagine per del testo vero.

Ogni tecnica va contestualizzata

In un articolo sul suo blog, Kris spiega che questa tecnica può avere il suo posto in certi contesti, per esempio per i siti di news o in blog personali.

Trovo che questo tipo di compressione aggiunga un qualche tipo di qualità alle immagini che stimola l'immaginazione di chi le guarda. Forse siamo troppo abituati a contenuti ad alta risoluzione e con uno spettro di milioni di colori. In questo contesto un approccio riduzionista ci fa chiedere: cosa mi sta togliendo tutta questa ricchezza di contenuti?

Tra i bit di rumore del dithering trova spazio il nostro modo unico di vedere il mondo.

dithered sunset