Come posso trovare un set di colori ottimale per 10 giocatori?

Voglio dare a ciascuno dei 10 giocatori un colore identificativo univoco. Esiste un set ottimale di colori per questo? Come posso crearne uno?

Ogni set che ho creato contiene colori troppo simili.

Aggiornamento: mi è stato chiesto di seguito a cosa serve (domanda equa). Ora posso dirtelo: Windwardopolis e i colori hanno funzionato alla grande.

È possibile generare valori di tonalità equidistanti nello spazio HSV:

for (int i = 0; i < 10; i++)
    colors[i] = HSV(0.1 * i, 0.5, 1.0);

Tuttavia, è possibile che non avrai sempre 10 giocatori. In tal caso, la palette non sarebbe molto efficiente se non si rigenerasse una palette diversa per un altro numero di giocatori. Invece, alcuni autori raccomandano di generare una tavolozza usando il rapporto aureo, sfruttando una proprietà risultante dal teorema di equidistribuzione :

for (int i = 0; i < 10; i++)
    colors[i] = HSV(fmod(i * 0.618033988749895, 1.0), 0.5, 1.0);

In questo modo, anche se ti fermi a 3 o 4 o 7 giocatori, ottieni una diffusione della tonalità molto buona.

Molti numeri irrazionali funzioneranno, ma il rapporto aureo funzionerà meglio (è stato dimostrato ).

Infine, puoi utilizzare due diverse sequenze di generazione per modificare So Vanche. Ad esempio ( modifica : ho aggiunto la sqrtrichiesta di una migliore equidistribuzione ):

for (int i = 0; i < 10; i++)
    colors[i] = HSV(fmod(i * 0.618033988749895, 1.0),
                    0.5,
                    sqrt(1.0 - fmod(i * 0.618033988749895, 0.5)));

Aggiornamento : i risultati sopra riportati possono essere migliorati utilizzando una curva di correzione per H(simile alla curva gamma per i componenti RGB) che tiene conto del sistema visivo umano. Questa è la curva di correzione della tonalità che ho calcolato utilizzando la metrica CIEDE2000 :

I risultati per i valori di tonalità equidistanti sono i seguenti:

E per le sequenze di generazione del rapporto aureo (con e senza modifiche V):

Pubblicherò un'approssimazione della formula della curva da utilizzare nei programmi non appena ne troverò una ragionevolmente buona.

Gli 8 colori di StarCraft sono :

Rosso, blu, verde acqua, viola, arancione, marrone (verde nelle mappe del deserto), bianco (verde sulle mappe del ghiaccio), giallo

Dritto. Blizzard è un genio dell'interfaccia utente e ha studiato il problema.

Hanno lasciato Green fuori come scambio per Brown sulle mappe del deserto, quindi tecnicamente ci sono 9 elencati lì.

I 12 colori di Warcraft 3 sono:

Rosso, blu, verde acqua, viola, giallo, arancione, verde, rosa, grigio, azzurro, verde scuro, marrone

Ecco come appare:

Come puoi vedere, sono abbastanza distinti e facilmente distinguibili. Il verde scuro è in realtà facile da distinguere dall'alzavola, forse perché l'occhio umano può facilmente distinguere le sfumature del verde. Se sei sicuro che i tuoi giocatori saranno tetracromici femminili , probabilmente potresti scegliere qualsiasi colore.

Alcune persone qui raccomandano di dividere lo spazio colore HSV in 10 posizioni equidistanti sulla tonalità. Secondo me, questa non è in realtà una buona soluzione. L'occhio umano non percepisce differenze di colore equamente nello spettro HSV. Ad esempio, ciò che chiameremmo arancione occupa una piccola fetta della band, mentre un buon 25% di pezzi potrebbe essere considerato verde. Quindi inizia con una cattiva premessa. Guarda la prima fila di colori in questa risposta . I due verdi sono quasi indistinguibili.

Ricorda che i tuoi utenti dovranno comunicare e fare riferimento ai colori. Alla luce di ciò, il tema Starcraft / Warcraft è un ottimo indizio da seguire. Scegliere in base a un elenco di semplici colori Crayola inglesi non è affatto una cattiva idea, perché finirai con colori familiari. Quindi modifica quei colori per renderli audaci, attenuati, qualunque cosa corrisponda alla tua estetica, purché siano ancora riconoscibili come rosso, arancione, giallo, verde, blu, viola, marrone, grigio, bianco, nero.

Modifica: la connessione tra linguaggio e percezione del colore è così interessante, volevo solo condividere questo fantastico link:

La crayola-fication del mondo: come abbiamo dato i nomi ai colori, e ha incasinato il nostro cervello sullo zelo empirico

Pensavo di dover dividere questo approccio "simbolico" in una risposta separata.

Nel passato, presumo che le persone avessero bisogno di bandiere e cose per identificare facilmente un esercito lontano, in modo da sapere se attaccare o difendere (in caso di nemici) o essere sollevato (nel caso degli alleati).

Quindi, per inciso, è esattamente quello che stai cercando di fare. Identifica facilmente qualcosa in lontananza.

Puoi farlo con solo colore, ma forse un modo migliore per farlo è con colore e simboli . L'uso di una combinazione di colori e simboli aiuterà le persone daltoniche a identificare le cose, come molte persone sopra menzionate.

Se le unità sono abbastanza grandi, puoi anche scegliere tra 2-4 stemmi colorati.

Il modello è facilmente riconoscibile, non solo un colore. Una buona trama potrebbe marchiare lo stemma piuttosto grande sul petto o sulla parte superiore del braccio di ogni unità.

Nell'immagine sopra, i caschi per unità diverse hanno una geometria diversa , così come le insegne dello scudo.

Potresti anche trovare interessante l'idea di Mon giapponese , che sono dei "loghi" molto semplici

Ora sostanzialmente stai marchiando le tue unità con moderni "marchi". StarCraft II ha fatto un po 'questo con "decalcomanie",

ma questi sono appena visibili nel gioco

e non sono usati per identificare le unità tanto quanto lo sono i colori.

Guarderei anche le bandiere per l'ispirazione, in particolare quelle che non usano un modello di marchio a 3 strisce (quelle diventano un po 'confuse). Tener conto di:

• Svizzera:
• Somolia:
• Corea del Sud:

Tutti questi hanno alcune bandiere dall'aspetto molto semplice, ma distintivo.

Controlla anche i simboli che il governo americano usa per identificare il personale della difesa. Queste sono immagini monocromatiche (possono essere eseguite completamente in bianco e nero), quindi potrebbe essere davvero un'ottima soluzione che non escluderà le persone daltoniche (fondamentalmente utilizzare i simboli per identificare i team, anziché i colori)

Perché reinventare la ruota? C'è anche uno standard per un set di sedici colori, di cui puoi sceglierne dieci. Questo è il set ANSI http://en.wikipedia.org/wiki/ANSI_escape_code#Colors

I colori ANSI sono equamente distribuiti sul cubo RGB, che a mio avviso è più adatto a questo problema rispetto allo spazio HSV.

Quando si prendono gli estremi del cubo RGB, si ottengono colori familiari, come rosso, blu, ciano, ecc. Dopo gli otto punti d'angolo, si ottengono tutti i punti in mezzo, sui bordi.

Fare 10 colori che possono essere distinti sarà davvero difficile. Questo è un problema piuttosto comune nella creazione di grafici o diagrammi per molti valori, motivo per cui spesso usano combinazioni di colori e forme o colori e pattern di hash.

Se è necessario visualizzare i marker, è possibile utilizzare 4 colori di base (rosso, blu, arancione, nero per esempio) e quattro forme di base (quadrato, cerchio, triangolo, diamante) e ottenere 16 marker molto facili da distinguere.

Se stai colorando in aree, usa la stessa idea ma combina i colori con i modelli di tratteggio in linee bianche o nere anziché in forme.

Un'altra cosa da considerare è di non usare il colore come unico modo per dirlo al lato. Passare il mouse su un'area potrebbe evidenziarla e dare una descrizione con il nome del giocatore esplicitamente indicato. O forse può essere inserito un elenco dei 10 giocatori, e mentre ci si sposta sopra il nome di un giocatore, vengono mostrate tutte le aree sulla mappa per quel giocatore.

Inoltre, mentre scegli i colori, tieni presente il daltonismo. Verde e rosso, ad esempio, potrebbero non essere distinguibili. Dai un'occhiata a http://jfly.iam.u-tokyo.ac.jp/color/#select per una serie di colori suggeriti che non saranno un problema per gli individui daltonici. Una risorsa aggiuntiva è http://www.usability.gov/articles/newsletter/pubs/022010new.html#ColorsthatWorktheBest

Anche se puoi ottenere 10 colori unici che sono facilmente distinguibili da una persona, un'altra persona potrebbe trovare questo set più difficile da distinguere.

Prendi in considerazione l'idea di limitarti a un set di colori più piccolo e di aggiungere una caratteristica distintiva , come una striscia nera . Per il set di colori, probabilmente è meglio non allontanarsi troppo da ciò che la maggior parte delle persone può distinguere facilmente: ROYGBIV . Una semplice striscia / nessuna striscia su ROYGBIV ti dà 14 pezzi identificativi del gioco.

Non devi nemmeno limitarti a una striscia nera. Prendi in considerazione la seguente soluzione per il cablaggio di 25 coppie (che potrebbero essere altrettanto facilmente strisce anziché coppie): http://en.wikipedia.org/wiki/25-pair_color_code

Volevo solo aggiungere un riferimento alla tavolozza Tableau-10 che è stata sviluppata per un alto carattere distintivo e che è descritta in questo documento:

http://vis.stanford.edu/files/2012-ColorNameModels-CHI.pdf

"La palette Tableau-10 offre la migliore salienza del colore e la minima sovrapposizione dei nomi."

Brent Berlin e Paul Kay hanno dimostrato che lo spazio colore può essere diviso in pochi colori di base, ma dipende dalla tua cultura in quanto dare un nome a un colore lo rende più distinguibile.

In inglese, ci sono 11 colori di base: bianco, nero, rosso, verde, giallo, blu, marrone, viola, rosa, arancione e grigio.

Non mi piace l'idea di scegliere le tonalità attorno a una ruota per gli stessi motivi indicati da Matt Montag

Fai molto di più dei semplici colori: presenta rappresentazioni visive che si aggiungono alla tradizione, allo stile artistico e alla rappresentazione del colore.

Ad esempio, Legend of the Five Rings utilizza un modo incredibile di distinguere tra "set di colori".

Uno degli esempi più belli da cui prendere una lezione. Prendi nota delle centinaia di modi in cui si differenziano tra i clan. Non sono solo i colori primari, ma anche quelli secondari e anche terziari. I colori sono anche inclusi in stile di capelli, tipo di abbigliamento, tipo di carattere, un simbolo attaccato, bandiere, striscioni, mini-bandiere sul retro, personalità.

La cosa più grande che vorrei prendere da questo è la combinazione di più colori. Non è un semplice: blu, rosso, viola, marrone, giallo, verde, verde acqua.

È una combinazione di due colori, entrambi molto pronunciati. Ciò può consentire un numero significativo di ulteriori giocatori.

Ogni clan avrebbe sia un colore primario, sia un set di colori secondari.

"Il granchio è stato principalmente identificato con i colori blu-grigio, oltre a nero, rosso e marrone."

È bello, perché non importa come appariva la persona (grande, fragile, samurai, mago, contadino) si poteva sempre dire da quale clan provenissero. Non era solo "Rosso" per Scorpione, era un rosso sangue scuro e NERO. Mentre Phoenix aveva i colori dello sprazzo di sole: rosso, arancione, giallo.

Non confonderesti mai uno Scorpione con una Fenice, anche se i loro colori fossero simili ed entrambi usassero molto rosso.

Prova questo miscelatore di colori: w3schools.com HTML Color Mixer .

Ecco cosa farei: selezionare un colore per la prima opzione. Quindi, selezionane uno per la seconda opzione in modo che il secondo colore sia nella posizione esattamente opposta rispetto alla prima. Quindi il colore nella posizione: riga 1, cella 1 avrebbe l'opposto: ultima riga, ultima cella.

In questo modo si ottengono 2 colori molto diversi alle estremità del mix ogni volta. Ripeti l'operazione 5 volte, selezionando sempre colori molto distanti dall'ultima selezione.

Questa domanda ha molte risposte, ma volevo toccare di più sull'accessibilità.

Se fossi nel tuo scenario (ho bisogno di scegliere i colori per una quantità di cose in un gioco che devono essere percepiti come distinti da tutti i giocatori coinvolti), la mia preoccupazione principale sarebbe quella di accogliere non solo i giocatori daltonici, ma anche i giocatori che hanno bassa visione.

L'unica soluzione a questo problema, per quanto ne so, è VALORE CONTRASTO . Alcune persone possono vedere solo in bianco e nero (fonte: un amico delle storie del college d'arte su come prendere una lezione di teoria del colore pur non essendo in grado di percepire alcun colore a causa di un intervento chirurgico all'occhio laser fallito). Alcune persone sono ipovedenti o parzialmente / legalmente ciechi. Avete bisogno di sfumature diverse di grigio come punto di partenza in modo che i colori che facciamo scegliere sono visualizzabili e distinti per TUTTI .

Per ottenere tutto ciò e avere colori che sembrano belli, ti preghiamo di considerare questa immagine, ottenuta sovrapponendo una sfumatura arcobaleno orizzontale in modalità fusione colori sopra una sfumatura verticale da nero a bianco (provalo tu stesso, magari con un colore personalizzato gradiente diverso dall'arcobaleno!):

Dal più scuro al più chiaro: nero, blu, rosso, magenta, verde, ciano, giallo, bianco.

Riesci a vedere il debole zigzag di "colore puro"? Questo è il valore naturale dei colori illustrati. Anche quando si usano colori puri, il blu è il più scuro e il giallo è il più chiaro. Utilizza queste informazioni per scegliere colori che soddisfino entrambi i requisiti di valore per i giocatori che sono daltonici e / o ipovedenti E che sono esteticamente graditi alle persone che possono percepire la piena maestosità delle tonalità selezionate.

Spero che sia di aiuto! : -)

PS Voglio assicurarmi di aver visto anche questo commento!

La migliore risposta alla daltonismo è semplice non fare affidamento sul colore. Ogni giocatore dovrebbe idealmente avere una silhouette unica per tutti gli attori che controlla. E intendo silhouette, non una sorta di simbolo; troppi giochi di tipo Match 3 sbagliano del tutto, e anche per chi non ha il daltonismo, è difficile giocare e causa troppa affaticamento agli occhi. - Sean Middleditch il 30 dicembre 12 alle 5:08

Un modo per garantire il set ottimale in termini di colori distinguibili per un numero variabile di giocatori (senza tenere conto del daltonismo) sarebbe quello di scegliere dal modello di colore HSL (Tonalità, Saturazione e Luminosità).

Scegli una luminosità e una saturazione costanti, a seconda della tua scelta. Quindi si sposta la tonalità del colore di 360 / playerCount, come nel seguente pseudo codice:

saturation = 200;
lightness = 128;
hueDelta = 360 / PLAYER_COUNT;

for (int i = 0; i < PLAYER_COUNT; i++)
    color[i] = Color.FromHSL(hueDelta * i, saturation, lightness);

Voglio presentare una combinazione di colori alternativa:

Questi sono i colori RGB (stesso ordine) con i nomi suggeriti:

#eeeeee - white
#efef00 - yellow
#00e1da - cyan
#bfbf00 - olive
#12c055 - light green
#e21e80 - pink
#777777 - gray
#c10008 - red
#8900ae - light purple
#7c3900 - light brown
#0029b9 - blue
#400086 - dark purple
#4b1c00 - dark brown
#003004 - dark green
#07004b - dark blue
#111111 - black

Nota: non ho usato il bianco e nero puro, pensando che forse sono usati come sfondo o contorni.

Metodologia: ha scelto 12 colori sulla faccia satura del cubo di colore (pensando che sarei felice con 12), osservandone la separazione e poi, usando uno strumento per simulare il daltonismo, ha iniziato a sfogliare. Successivamente, ho aggiunto un quasi bianco, un quasi nero e ho nascosto un grigio, perché potevo. Questo mi ha dato 15 colori. Volevo 16 colori perché ha una potenza di 2 e ho pensato che potesse rendere le cose più facili per gli sviluppatori. Alla fine ho trovato un modo per aggiungere un 16 ° colore, ho dovuto spostare gli altri per quello. Quindi ... controlla di nuovo con lo strumento di simulazione daltonismo, correggi e ripeti.

Ecco i diversi casi di daltonismo:

Normale:

protanopia:

deuteranopia:

tritanopia:

protanomaly:

Deuteranomaly:

Tritanomaly:

acromatopsia:

Achromatomaly:

Dopo aver giocato per un po 'con lo strumento di simulazione daltonismo, devo dire che il contrasto è fondamentale.

Si consideri ad esempio, considerare i colori 5 ° (verde chiaro), 7 ° (grigio) e 9 ° (viola chiaro). Sembrano simili in alcuni casi, in particolare di piccole dimensioni e separati da un altro colore. Tuttavia, mettili fianco a fianco e puoi distinguerli. Aumenta l'area coperta dal colore e puoi distinguerli molto più facilmente. Quindi ... progettare per daltonismo non è solo scegliere i colori.

In quella nota ... se scegli una combinazione di due colori anziché uno per rappresentare una fazione, questo fa molta strada.

Questi colori sono stati scelti con un metodo molto empirico. Ho notato che un punto molto importante è assicurarsi che siano tutti di diversa luminosità. Noto anche che la maggior parte dei "colori" appare due volte (ci sono due verdi, due viola, due marroni, ecc ...). In effetti, il 4 ° colore (oliva) è l'ultimo che ho aggiunto e decido che sarebbe un colore giallo, perché non c'era niente come il giallo. Suppongo che possa essere la base per un modo più sistematico di scegliere i colori.

In retrospettiva, probabilmente dovrei rendere il secondo colore giallo (oliva) più scuro e usare quel punto di luminosità per un rosa (vedi 7 ° colore). Perché? Perché ti darebbe più sfumature con cui giocare. Ern ... questo è abbastanza buono, e ottenere tutte le foto è una seccatura.

Addendum : Qualcosa che non ho preso in considerazione è il modo in cui i colori dello schermo LCD si distinguono se guardi fuori dalla gamma di angoli preferita.