¿Verde, amarillo y rojo no pueden ir juntos? Los etíopes deben ser terriblemente insultados. Busque imágenes en verde, amarillo y rojo en Google, y creo que encontrará varios ejemplos atractivos (junto con los feos).
La combinación de cualquier conjunto de colores depende de las coordenadas exactas del color y de las posiciones relativas, las formas, los tamaños de los objetos coloreados y el efecto que desea tener (por ejemplo, calmante versus emocionante, divertido versus serio, audaz versus sutil). ) No tengo reglas estrictas para ti, pero aquí hay algunas cosas para experimentar.
Compensación de saturación de tamaño
Para evitar un efecto discordante (suponiendo que no desee eso), el tamaño del objeto coloreado debe ser inversamente proporcional a su saturación de color. Su ejemplo tenía saturaciones bastante altas, así que pruebe con saturaciones de color más bajas (por ejemplo, pasteles) o coloree algo diferente al fondo. Por ejemplo, puede colorear el texto y dejar el fondo neutral, o puede colorear una pequeña forma o símbolo al lado del texto. Esto último brindaría la oportunidad de usar la forma para codificar de forma redundante la coincidencia de habilidades para fines de accesibilidad e impresión en blanco y negro (marca de verificación verde para Satisfecho, signo de exclamación amarillo para Déficit y símbolo rojo de "no ingresar" para No es lo suficientemente bueno) .
Espaciado
El aspecto de los colores depende de su proximidad entre sí. Los colores que chocan cuando están adyacentes se ven bien con una pequeña separación. Intente colocar un borde neutral alrededor de cada celda para separar más los colores (como lo tiene en sus encabezados), a menos que haya un significado para que las celdas del mismo color se mezclen para ser percibidas como un solo objeto. Prueba diferentes espesores. Intente separar cada celda con bordes blancos , buscando un aspecto de mosaico.
Modelo
La combinación de los colores también cambia con el patrón de los colores, así que asegúrese de evaluar maquetas con proporciones y posiciones típicas de los colores. Por ejemplo, si la mayoría de las veces todo es verde, y es más importante que los usuarios presten atención a los "reflejos" de los amarillos y rojos, entonces elija un verde que haga un buen fondo (p. Ej., Baja saturación, luz), y amarillo y rojo parece sentarse "en la parte superior" (por ejemplo, mayor saturación, oscuro). Tenga en cuenta que la estética del patrón también puede comunicar y motivar al usuario. Si el usuario tiene un conjunto de habilidades particularmente inadecuado o desequilibrado, tal vez desee un patrón feo. El patrón más atractivo debe corresponder al estado más ventajoso para el usuario.
Usabilidad
Su pregunta se refiere a la estética, pero la elección del código de color también tiene importantes implicaciones de uso. Sus selecciones de color deben ser:
Visualmente distintos entre sí, especialmente si se usan en condiciones visuales degradadas (p. Ej., En un móvil a la luz del sol).
Proporcione un buen contraste con el fondo (si es el primer plano) o con el primer plano (si es el fondo). Por ejemplo, el texto negro sobre rojo no es tan bueno. En general, el primer plano y el fondo necesitan diferentes niveles de brillo.
Asegúrese de que los colores sean consistentes con lo que codifican. Por ejemplo, las cosas a las que el usuario debe asistir deben contrastar más con el fondo y otros colores.
Proporcione accesibilidad y capacidad de impresión, donde cada color también tiene un nivel diferente de oscuridad, con la oscuridad escalada a las filas (rojo más que amarillo más que verde). Haga que su verde sea algo azulado y / o su rojo algo anaranjado para que los usuarios daltónicos de color rojo-verde (el tipo más común de daltonismo) aún puedan ver las diferencias de color.
Use la codificación de color para una sola variable. No sé para qué usas el gris y el naranja, pero es probable que cause confusión y dificulte que los usuarios usen los colores rojo, verde y amarillo. Cada vez que tiene más de tres colores, es difícil mantener las cosas utilizables. Encuentre otra forma de codificar cualquier código gris y naranja (por ejemplo, use el tamaño o el peso de la fuente, o use líneas discontinuas para los bordes de las celdas; consulte Colocación de la G en la GUI ).
En un proyecto en el que trabajé, los colores con los que vine fueron # E00000, # FF8400 y # C0FFE0 (no era un amarillo muy amarillo, pero aún funcionaba).
Tengo más información sobre cómo elegir códigos de color, incluido cómo calcular el color y el contraste de brillo en Romper el código de color .