Simulatore di daltonismo

Anteprima dei problemi di accessibilità dei colori in un'immagine

Il colore può trasmettere informazioni importanti in grafici, pulsanti, mappe, dashboard e grafiche di marketing. Ma non tutti percepiscono le differenze di colore allo stesso modo. Questo simulatore di daltonismo ti aiuta a vedere in anteprima come può apparire un'immagine con le più comuni carenze della visione dei colori, così puoi individuare i punti in cui l'informazione dipende troppo dal contrasto rosso-verde o blu-giallo.

La simulazione viene eseguita interamente nel tuo browser. L'immagine viene disegnata su un canvas, ogni pixel viene trasformato con una matrice di colori 3×3 standard e il canvas risultante viene mostrato e può essere scaricato come PNG. Nessun server riceve il tuo screenshot o il tuo progetto, cosa particolarmente utile per interfacce non ancora rilasciate, lavori per clienti e dashboard interne.

Capire i tipi di simulazione

La protanopia simula la mancanza o il mancato funzionamento dei coni rossi a lunghezza d'onda lunga, che può far apparire i rossi più scuri e ridurre la distinzione rosso-verde. La deuteranopia simula la mancanza dei coni verdi a lunghezza d'onda media, un'altra comune carenza rosso-verde. La tritanopia simula la mancanza dei coni blu a lunghezza d'onda corta, che influisce sulla percezione blu-giallo ed è meno frequente. L'opzione Normale lascia l'immagine invariata, così puoi confrontarla rapidamente con le versioni trasformate.

Progettare oltre il solo colore

Un simulatore è un aiuto alla revisione, non un audit di accessibilità completo né uno strumento di diagnosi medica. Usalo per trovare abbinamenti di colore a rischio, poi migliora il design con etichette, icone, motivi, sottolineature, contrasto più forte e segnali ridondanti. I grafici non dovrebbero basarsi solo su linee di colori diversi; gli stati di errore dovrebbero includere testo o cambi di forma; i pulsanti dovrebbero restare riconoscibili senza la tonalità. Se l'anteprima simulata comunica ancora lo stesso messaggio, è più probabile che la tua immagine funzioni per un pubblico più ampio. Controlla le schermate importanti anche alle dimensioni reali di visualizzazione, perché etichette piccole, linee sottili dei grafici e sfumature di sfondo sottili possono diventare più difficili da distinguere dopo la trasformazione dei colori.

Leggere i risultati

Le carenze rosso-verde sono molto più comuni di quelle blu-giallo, quindi protanopia e deuteranopia sono di solito le prime due anteprime da controllare. Passa da un'opzione all'altra e confronta l'originale con ciascuna versione: se due categorie, linee o colori di stato diventano difficili da distinguere, il design dipende troppo dalla tonalità. Tieni presente che si tratta di approssimazioni della dicromasia completa. Le forme più lievi di debolezza cromatica e le condizioni più rare come l'acromatopsia non sono coperte, e la percezione reale varia tra le persone e le condizioni di luce. Il PNG scaricato mantiene la piena risoluzione dell'originale e include il nome della simulazione nel nome del file.