Teoría del Color para Diseñadores, Parte 2. Entendiendo los Conceptos y Terminología

Traducido y 'resumido' de SmashingMagazine

Si vas a usar acertadamente los colores en tus diseños, necesitas saber algunos conceptos del color y su teminología. Un conocimiento profundo de los conceptos de croma, valor y saturación es clave para crear tus propios esquemas de colores impresionantes.

Matiz

El matiz es uno de los terminos más básicos del color y basicamente indica el color de un objeto. Cuando decimos 'azul, 'verde' o 'rojo', estamos hablando sobre el el matiz. Los matices que usas en tus diseños transmiten mensajes importantes a los visitantes de tu pagina web.

Ejemplos

Usando un monton de matices junto puede añadir un look juvenil y jugueton al diseño, como lo han hecho en el header y en otras partes de la pagina web.

El rojo puro es un matiz muy popular en el diseño web.

Croma

También llamado croma, se refiere a la pureza del calor. Un matiz con alta saturación no tiene negro, ni blanco ni gris. Añadirlos le reduce la saturación. Puede ser pensado como el brillo de un color en comparación del blanco.

En diseño, evita usar matices que tienen una saturación similar. Opta por matices con saturaciones que son iguales o un poco diferentes entre si.

Ejemplos

El cian tiene una alta saturación así que se destaca entre el negro y el blanco.

Combinar saturaciones altas y bajas del mismo matiz puede dar un diseño elegante y sofisticado.

Colores con saturaciones altas es mejor usarlas con mederación, asi como aquí.

Saturación

Se refiere a como un matiz aparece sobre un condicion de luz particular. Piensa en saturación en terminos de débil vs fuerte o pálido vs matices puros.

En diseño, los colores con niveles de saturación iguales haces diseños más cohesivos. Como el croma, los colores con similar pero no con saturaciones iguales pueden tener un efecto discordante en tus visitantes.

Ejemplos

Los niveles de saturacion de los diferentes matices son similares, añadiendo una sensación de unidad a todo el diseño.

Matices con niveles de saturacion bajas no son necesariamente más encendidas

Este es un excelente ejemplo de como usar un matiz de alta saturacion contra un fonde de baja saturación puede hacer el primero destacar.

Brillo

También puede llamarse Luminosidad. Se refiere a que tan claro u oscuro es un color. Los colores claros tiene un brillo más alto. Por ejemplo, el anaranjado tiene un brillo más alto que el el azul marino o el morado oscuro. El negro tiene el brillo más bajo que cualquier matiz y el blanco el más alto.

Cuando aplicas brillo a tus diseños, escoge colores con diferentes brilllos, especialmente los de alto croma. Altos contrastes del brillo generalmente resulta un diseño estéticamente agradable.

El alto brillo del amarillo destaca en contra del bajo brillo del negro y el gris

Combinando colores con brillos similares hacen un fondo más vivo.

Tonos

Son creados cuando el gris es añadido a un matiz. Tonos son en general más apagados o tiene un look más suave que los matices puros.

Son más faciles de usar en los diseños. Tonos con más gris pueden llevar a una sensación vintage a los sitios web. Dependiendo de los matices, pueden añadir un look elegante y sofisticado.

Ejemplos

Hace que este sitio se ve sofisticado añadiendole algunos elementos vintage y antiguos

Los tonos son intensificados añadiendole gris.

Los tonos de esta pagina le dan una sensación vintage y de hecho a mano.

Sombras

Una sombra es creado cuando negro es añadido al matiz, haciendolo más oscuro. A veces es usado incorrectamente al describir tono o tinte, pero sombra solo se aplica cuando los matices se hacen más oscuro al añadir negro.

En diseño, las sombras más oscuras son usualmente usadas en lugar del negro y puede servir como neutral. Al combinar sombras con tintes es mejor no añadir mucho negro y un look muy pesado.

Ejemplos

Combinando textura con sombras

Tintes

Un tinte es formado cuando se agrega blanco a un matiz, iluminandolo. Muchos tintes claros a veces son llamados pasteles pero ningun matiz puro con blanco es un tinte. (?)

Los tintes son usualmente usados para crear diseños femeninos o iluminados. Los tintes pasteles son especialmente usados en diseños femeninos. También pueden ser usados en diseños vintages o para bebes.

Ejemplos

Los tintes azules son populares para el cielo y motivos naturales.

Populares en diseños basados en acuarelas

Conclusión

Matiz es color (azul, verde, rojo, etc)

Croma es la pureza del color (un croma alto no tiene añadido negro, blanco o gris)

Saturación se refere a que tan fuerte o débil es un color (siendo fuerte alta saturación)

Brillo se refiere a que tan claro u oscuro es un color (claro siendo un brillo alto)

Tono son creados al añadir gris a un color, haciendolo más apagado que el original

Sombras son creados al añadir negro a un color, haciendolo más oscuro que es original.

Tinte son creados cuando le añades blanco a un color, haciendolo más claro que el original.

Traducido y 'resumido' de SmashingMagazine