Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. Design Theory
Webdesign

Definiendo y reconociendo colores

by
Length:ShortLanguages:
This post is part of a series called Design School for Developers.
Introducing Wireframes to Your Design Process
Understanding the Qualities and Characteristics of Color

Spanish (Español) translation by Rodney Martinez (you can also view the original English article)

Cuando estás diseñando para cualquier medio, es decir; no solamente para la web, la forma en cómo uses los colores en tus diseños impactará la forma en cómo ese diseño se percibe, entiende e interpreta.  Es muy importante recordar que los colores nos provocan emociones (buenas y malas) en las personas y las culturas. 

En gran parte, unirse en su fase de investigación, digamos que es una manera sabia de asegurar que entiendes cuál es tu público objetivo y cómo los afectarán los colores.  Después, puede ayudarte a atender los diseños del sitio web y cómo luce el sitio y cómo se siente a través del uso inteligente del color. 

Pero antes que empieces a trabajar con los colores en tus diseños, primero deberás empezar por entender más acerca de lo que es el color.  Suena ridículo cuando, por supuesto, sabes la diferencia entre rosado y azul, sin embargo, no se trata de poder hacer una diferencia obvia, sino que es más acerca de entender la diferencia que el color puede hacer en diseño, es decir; cómo los colores evocan sentimientos dentro de una persona o de una cultura y cómo los colores pueden ser utilizados efectivamente en sus diseños para ayudar a tener mejores experiencias para tus usuarios.


La rueda de color.

La rueda de color, es un diagrama, el cual muestra los tonos de color principales y cómo esos colores se relacionan con los demás.  Por lo general, la rueda de color más común funciona con seis o hasta con doce colores.

color-wheel

Los colores principales de la rueda de color (rojo, naranja, amarillo, verde, azul y violeta) funcionan en ambas ruedas, es decir; con la adición potencial de seis colores extras (rojo-naranja, amarillo-naranja, amarillo-verde, azul-verde, azul-violeta y rojo-violeta).

Como puedes ver, todos los colores extras en la rueda de color más grande se relacionan a los colores principales que ya están allí —efectivamente, están “entre” los mismo colores originales—.


Colores primarios

Es muy probable que reconozcas estos colores, ya que son parte de los tres colores primarios, como son: rojo, azul y amarillo.

color-wheel-primary

Los colores primarios son los colores base de cualquier rueda de color y de todos los espectros de color.  Para crear cualquier otro color, tendrás que usar una combinación de dos o todos los tres colores primarios.


Colores secundarios.

Estos son púrpura, naranja y verde.

color-wheel-secondary

Los colores secundarios se crean cuando mezclas dos colores primarios.  Estos colores también yacen directamente opuestos a los colores primarios en la rueda de color, así como ellos están entre los dos colores que se habían mezclado para hacer este color secundario.

Nota: Nos referimos a estos colores opuestos o contrastantescomo colores complementarios. Cuando se mezclan, estas combinaciones de colores complementarios (como rojos + verde) produce un color neutral.


Colores terciarios.

Los colores terciarios son creados cuando se mezclan un color primario y un color secundario Como tal, hay más colores terciarios que primarios y secundarios, debido a que hay más combinaciones que pueden hacerse.

color-wheel-tertiary

En la rueda de color, estos colores terciarios se encuentran entre cada uno de los colores primarios y secundarios.


Familias de colores.

Cuando pienso en color, hay dos elementos familiares que sobresalen para mí, los colores cálidos y los colores fríos.  Un pequeño truco que hace que sea fácil descifrar cuales colores pertenecen a cuales familias, es como partir a la mitad la rueda de color.

Colores cálidos.

Los colores que pertenecen a la familia de los colores cálidos son rojos, naranjas y amarillos. Todos ellos evocan un sentimiento de calor en alguna manera: rojo, por ejemplo, es apasionado y ardiente, del mismo modo, naranja y amarillo son veraniegos, como el sol.

color-wheel-warm-family

Colores fríos.

Los colores que pertenecen a la familia de colores fríos son los azules, verdes y púrpuras de la rueda de color.  Estos colores, naturalmente evocan un sentimiento de quietud y calma que los otros colores no pueden. Además, estos colores son más apagados que los colores cálidos, vinculándose más estrechamente al agua, la naturaleza y otros similares.

color-wheel-cool-family

Significado de los colores

En primer lugar, es una excelente idea empezar por aprender acerca de lo que significa cada uno de los colores principales o primarios.  No obstante, es importante recordar que cada color tendrá un significado diferente, dependiendo de cada persona con la que hables y de cualquier parte del mundo.   No vayas a olvidar, que así como la población más amplia, los colores a menudo tienen significados personales para personas individuales o en grupo.  Esto significa que aunque la interpretación clásica o asumida de ese color puede significar una cosa, como un individuo interpreta ese color puede ser completamente diferente.

En diseño web, o en cualquier diseño en realidad, nunca puedes darte el lujo de hacer suposiciones acerca de los gustos de color de los usuarios. Sin embargo, el color es un área donde hay un poco de excepción por hacer.  Como los colores evocan significados personales para cada individuo, tendrás que intentar con la suposición más amplia de lo que un color puede significar para tu público objetivo. A menos que seas muy afortunado de tener una mejor investigación e información que preste en sí misma la elección de la paleta de color en su proyecto.

También necesitas pensar acerca de cómo su color será usado, ya sea; en un sentido práctico en la web, sino también físicamente para los que en verdad usaran tu sitio web.  Piensa acerca de accesibilidad y como estos colores pueden ser percibidos o como se pueden ver o experimentar para aquellas personas que no pueden ver los colores  o que tienen cualquier dificultad visual.  . Aunque es imposible conocer cuales dificultades tendrán los usuarios (y aunque lo hicieras, no hay manera para diseñar para acapararlos a todos) y cuales medidas puedes tomar para usar el color efectivamente, pero de una manera que no cause más problemas para una porción de los usuarios.

Lectura adicional

Gery Coady escribió un libro pequeñito y brillante sobre Accesibilidad del color en el cual entra en muchos detalles sobre construir sitios web con colores accesibles.  Definitivamente, vale la pena leerlo para ampliar su conocimiento sobre la accesibilidad del color.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.