La fortuna e il coraggio di fare della mia passione il mio lavoro.
Valentina D'Angelo

Colore: il modello HSB – tonalità, saturazione, luminosità

0

Perché ne parliamo?
I software come Photoshop o Illustrator utilizzano di default questo modello per la visualizzazione del colore sul pannello selettore colore perché è un modello che si avvicina molto alla nostra percezione visiva del colore. Conoscere come funziona il modello HSB velocizza la ricerca del colore e di colori da abbinare ad un certo colore sul pannello selettore colore.
Pannello selettore colore in Adobe Photoshop CC 2014
fig. 1 – pannello selettore colore su Photoshop CC 2014

Il modello HSB è un sistema di rappresentazione dei colori attraverso 3 valori:

  1. H (Hue): Tinta. Si esprime in gradi da 0 a 360°. E’ quello che comunemente chiamiamo colore, quindi è il rosso, il giallo, il verde ecc… senza considerare se chiari o scuri, brillanti o spenti, intensi o grigetti.
  2. S (Saturation): Saturazione. Ha un valore in percentuale, da 0 a 100%. Rappresenta il grado di intensità di un colore, nell’esperienza visiva, più vira al grigio meno è saturo.
  3. B (Brightness): Luminosità. Ha un valore in percentuale, da 0 a 100%. Rappresenta il grado di luminosità di un colore, cioè la quantità di luce del colore, che esprimiamo percependolo “chiaro” oppure “scuro”.

Detto così non sembra tanto interessante, né comprensibile, né utile. Proviamo a capire meglio. Per farlo utilizziamo alcuni dei metodi di fusione del pannello livelli di Photoshop che ci aiuteranno a fare chiarezza.
Metodi di Fusione Photoshop CC 2014
fig. 2 – usiamo i metodi di fusione di photoshop

La tinta o tonalità

Fatta eccezione per i daltonici, la comprensione del concetto di tinta è immediata. Prendiamo un’immagine (vedi fig. 3) fatta di 6 quadretti con H (hue-tinta) a distanza di 60° e con saturazione e luminosità sempre al 100% (così non dobbiamo preoccuparcene). Osserviamo come varia la tonalità al variare del valore di H.
variazioni della tonalità nel modello HSB
fig. 3 – effetto della variazione del valore H nel modello HSB

La saturazione

Il concetto di saturazione è un po’ meno intuitivo. Come ho detto prima, nella pratica, quando un colore tende al grigio vuol dire che è poco saturo. Nella pittura si smorza l’eccesso di saturazione di un colore aggiungendo il suo complementare, infatti l’unione di due colori complementari dovrebbe produrre un grigio neutro.
Vediamo per prima cosa come varia, ad esempio, il rosso, al variare del valore di saturazione (fig. 4), mantenendo quindi inalterati sia il valore di H (tinta) che quello di B (luminosità).
variazioni della saturazione nel modello HSB
fig. 4 – effetto della variazione del valore S nel modello HSB

La luminosità

La luminosità è la quantità di luce del colore: diminuendo la luminosità il colore diventa sempre più buio (fig. 5).
variazioni della luminosità nel modello HSB
fig. 5 – effetto della variazione del valore B nel modello HSB

Cosa succede se togliamo la saturazione? Succede che ci ritroviamo in una scala di grigi, cioè nell’ambito del chiaro-scuro (fig. 6).
variazioni della luminosità nel modello HSB con saturazione pari a zero
fig. 6 – effetto della variazione del valore B nel modello HSB con S=0

Come usare il modello HSB

Il cervello umano è molto sensibile alle variazioni di stato e raffronta in continuazione tutto quello che percepisce. Secondo me il segreto di una buona progettazione grafica sta nel non ostacolare il cervello nella decodifica della realtà percepita. Possiamo farlo utilizzando il concetto di “contrasto“. Nell’ambito della classificazione HSB del colore, questo contrasto può essere di tonalità, di saturazione o di luminosità.

About Author

Valentina D'Angelo

Lavora nella grafica professionale dal 2000. Freelance per vocazione, appassionata di comunicazione visiva, di segni e immagini parlanti. Innamorata di tutto quello che è nuovo e che è ancora da conoscere. "Su un'isola deserta mi porterei... gli occhi. Forse anche uno smartphone."

Leave A Reply