Verde, giallo e rosso non possono andare insieme? Gli etiopi devono essere terribilmente insultati. Google per immagini verdi, gialle e rosse, e penso che tu trovi molti esempi interessanti (insieme a quelli brutti).
Il modo in cui un insieme di colori va insieme dipende dalle coordinate esatte del colore e dalle relative posizioni, forme, dimensioni degli oggetti colorati e l'effetto che si desidera avere (ad esempio, calmante contro eccitante, divertente contro serio, audace contro sottile ). Non ho regole rigide e veloci per te, ma ecco alcune cose da sperimentare.
Scambio di saturazione dimensioni
Per evitare un effetto sbilenco (supponendo che non lo desideri), la dimensione dell'oggetto colorato dovrebbe essere inversamente proporzionale alla sua saturazione del colore. Il tuo esempio presentava una saturazione piuttosto elevata, quindi prova una saturazione del colore più bassa (ad esempio, i pastelli) o colora qualcosa di diverso dallo sfondo. Ad esempio, puoi colorare il testo e lasciare lo sfondo neutro oppure puoi colorare una piccola forma o un simbolo accanto al testo. Quest'ultimo fornirebbe la possibilità di usare la forma per codificare in modo ridondante la combinazione di abilità per accessibilità e scopi di stampa in bianco e nero (segno di spunta verde per Soddisfatto, punto esclamativo giallo per Scorciatoia e simbolo rosso "non inserire" per Non abbastanza buono) .
Spaziatura
L'aspetto dei colori dipende dalla loro vicinanza. Colori che scontro quando adiacenti sembrano a posto con una piccola separazione. Prova a mettere un bordo neutro attorno a ogni cella per separare di più i colori (come hai nelle intestazioni), a meno che non ci sia un significato per le celle dello stesso colore che si fondono insieme per essere percepite come un singolo oggetto. Prova diversi spessori. Prova a separare ogni cella con bordi bianchi , cercando un aspetto piastrellato.
Modello
Il modo in cui i colori vanno insieme cambia anche con il motivo che i colori creano, quindi assicurati di valutare i modelli con proporzioni e posizioni tipiche dei colori. Ad esempio, se la maggior parte delle volte è tutto verde ed è molto importante che gli utenti si occupino delle "luci" di giallo e rosso, scegliere un verde che crei un buon sfondo (ad es. Bassa saturazione, luce) e giallo e il rosso sembra sedersi "in alto" (ad es. maggiore saturazione, scuro). Considera che l'estetica del modello può anche comunicare e motivare l'utente. Se l'utente ha una serie di competenze particolarmente inadatte o squilibrate, forse vuoi uno schema brutto. Il modello più attraente dovrebbe corrispondere allo stato più vantaggioso per l'utente.
usabilità
La tua domanda riguarda l'estetica, ma la scelta del codice colore ha anche importanti implicazioni sull'usabilità. Le selezioni di colore dovrebbero essere:
Visivamente distinti l'uno dall'altro, specialmente se usato in condizioni visive degradate (ad es. Su un cellulare alla luce del sole).
Fornisce un buon contrasto con lo sfondo (se in primo piano) o con il primo piano (se in primo piano). Ad esempio, il testo nero su rosso non è così buono. In genere, il primo piano e lo sfondo necessitano di diversi livelli di luminosità.
Assicurati che i colori siano coerenti con ciò che codificano. Ad esempio, le cose a cui l'utente dovrebbe prestare attenzione devono contrastare maggiormente con lo sfondo e altri colori.
Fornire accessibilità e stampabilità, in cui ogni colore ha anche un diverso livello di oscurità, con l'oscurità ridimensionata ai livelli (rosso più che giallo più che verde). Rendi il tuo verde un po 'bluastro e / o il tuo rosso un po' aranciato così gli utenti daltonici rosso-verde (il tipo più comune di daltonismo) possono ancora vedere le differenze di colore.
Utilizzare la codifica a colori per una sola variabile. Non so per cosa stai usando il grigio e l'arancione, ma è probabile che causino confusione e rendano più difficile per gli utenti utilizzare i colori rosso verde e giallo. Ogni volta che hai più di tre colori, è difficile mantenere le cose utilizzabili. Trova un altro modo per codificare qualsiasi codice grigio e arancione (ad esempio, utilizza la dimensione o lo spessore del carattere o usa linee tratteggiate per i bordi delle celle; vedi Inserimento della G nella GUI ).
In un progetto a cui ho lavorato, i colori con cui sono arrivato erano # E00000, # FF8400 e # C0FFE0 (non un giallo molto giallo, ma funzionava ancora).
Ho di più sulla scelta dei codici colore, incluso come calcolare il contrasto di colore e luminosità in Breaking the Color Code .
