Simulatore di daltonismo
Circa l’8% degli uomini e lo 0,5% delle donne ha una forma di deficit della visione dei colori, più spesso rosso-verde. Carica un design, uno screenshot o un’illustrazione, scegli un modo di simulazione e confronta l’originale con il risultato simulato affiancato. È utile per verificare se un grafico, una mappa o un’interfaccia restano leggibili quando non ci si affida solo al colore.
Come funziona il simulatore
-
1
Inserisci un'immagine
PNG, JPG, WebP o SVG. Elaborato nel browser, nulla caricato.
-
2
Scegli una modalità di simulazione
Seleziona protanopia, protanomalia, deuteranopia, deuteranomalia, tritanopia, tritanomalia, acromatopsia o acromatomalia.
-
3
Confronta affiancato
Il browser applica una trasformazione a matrice e mostra l'originale accanto alla simulazione selezionata.
-
4
Esporta l'immagine simulata
Scarica la simulazione selezionata come PNG oppure cattura schermate del confronto per le revisioni di design.
Forme di carenza di visione dei colori
| Condizione | Prevalenza | Caratteristica |
|---|---|---|
| Deuteranomalia | ~5% degli uomini | Anomalia rosso-verde, cono M spostato |
| Protanomalia | ~1% degli uomini | Anomalia rosso-verde, cono L spostato |
| Deuteranopia | ~1% degli uomini | Cono M assente, rosso-verde appena distinguibile |
| Protanopia | ~1% degli uomini | Cono L assente, percezione del rosso spostata |
| Tritanopia | molto rara | Cono S assente, asse blu-giallo collassato |
| Tritanomalia | molto rara | Cono S spostato, lieve perdita blu-gialla |
| Acromatopsia | estremamente rara | Cecità totale ai colori, solo scala di grigi |
La maggior parte dei designer parte da deuteranopia e protanopia, perché i deficit rosso-verde sono i più comuni, poi aggiunge le modalità anomale e blu-giallo per un controllo più ampio.
Implicazioni per il design
- Non fare affidamento solo su rosso/verde per distinguere stati. Gli indicatori di errore/successo necessitano di una forma, icona o etichetta di testo oltre al colore. Una X rossa e un segno di spunta verde sono percepibilmente diversi; cerchi rossi e verdi non lo sono.
- Grafici: usa riempimenti a pattern, etichette dirette o palette percepibilmente distinte (ColorBrewer, Viridis). Evita la palette semaforica per la visualizzazione dei dati.
- Mappe: bordi e tratteggi per distinguere le regioni; solo il colore fallisce.
- Collegamenti ipertestuali: mai stilizzati solo dal colore. Sottolineature o peso aiutano tutti, comprese le persone con visione normale dei colori.
- Campi di modulo richiesti: un asterisco rosso più etichetta “Richiesto” o bordo rosso più testo di aiuto “Richiesto”.
- Indicatori di stato: il rosso/ambra/verde del semaforo funziona come rinforzo, mai come unico segnale.
Buone scelte di palette per un design a prova di colore
- Viridis (usato per impostazione predefinita in matplotlib, D3): viola-giallo, uniformemente percepibile.
- ColorBrewer qualitativo: 8 tonalità distinte progettate per rimanere distinguibili nelle forme comuni di CVD.
- Okabe-Ito: palette di 8 colori specificamente progettata per l’accessibilità per i daltonici.
Strumenti e test
- Anteprime del simulatore (questo strumento), controllo visivo rapido.
- Controllo del contrasto WCAG, assicura che il testo rimanga leggibile indipendentemente dalla percezione del colore.
- Test con utenti reali, nulla sostituisce la visualizzazione del tuo design a utenti daltonici reali.
Curiosità
I simulatori moderni della visione dei colori usano approssimazioni a matrice di come le risposte dei coni vengono mappate in RGB. Considera l’anteprima come un controllo pratico di design, non come una diagnosi medica né come la percezione esatta di una singola persona.
Domande frequenti
È un’approssimazione utile, ma la percezione reale dei colori varia da persona a persona. La maggior parte dei deficit rosso-verde si colloca su uno spettro da lieve a severo: usa l’anteprima come segnale di design, non come diagnosi.
La deuteranomalia copre la fetta più grande di utenti daltonici (~5% degli uomini). Testare contro la deuteranopia (la forma severa) è un controllo conservativo, se un design funziona lì, funziona anche per l’anomalia più lieve.
Sì, anche se molto meno spesso (~0,5%). La carenza rosso-verde è recessiva legata all’X, quindi gli uomini (XY) hanno bisogno solo di un X colpito; le donne (XX) ne hanno bisogno di entrambi. La tritanopia è autosomica e colpisce entrambi i sessi in modo uguale.
Non direttamente in questo strumento, si tratta di simulazione generale della bassa visione, che coinvolge anche sfocatura e riduzione del contrasto. Per una simulazione completa dell’accessibilità, strumenti dedicati come Lighthouse di Chrome o NoCoffee coprono questi aspetti.
Strumenti correlati
Creatore di GIF
Trasforma una sequenza di immagini in una GIF animata. Regola frame rate, qualità e dimensioni prima dell’esportazione.
Generatore di codici QR
Genera localmente nel browser un codice QR da URL, testo semplice o payload QR formattato correttamente e scaricalo come PNG.
Generatore di meme
Aggiungi testo in alto e in basso a un’immagine JPG, PNG o WebP. Regola font, colore e contorno, quindi scarica il meme in PNG.
Selettore Colori Material Design
Sfoglia la palette di colori Material Design. Copia qualsiasi tonalità (da 50 a A700) in HEX, RGB o HSL con un solo tocco.
Lavagna online
Disegna idee e organizza forme, note e immagini locali su una lavagna privata nel browser. Esporta in PNG, JPEG, SVG o JSON modificabile.
Vettorializzatore da PNG a SVG
Trasforma immagini raster PNG in tracciati SVG nel browser. Ideale per loghi, icone e disegni al tratto. Regola soglia, numero di colori e smussatura.