1. El color
|
| El color juega un papel muy importante en nuestra percepción visual. Indirectamente, los colores mandan mensajes determinados al receptor, ya sea por una cuestión social o porqué psicológicamente estamos predispuestos a recibir una sensación determinada. |
 |
| Con la imagen gráfica estamos transmitiendo ideas básicas al receptor que recibirán de forma distinta según su pertinencia cultural, la edad, el género... Los colores son elementos comunicativos, por lo tanto, es muy importante saberlos utilizar correctamente y sacarles el máximo partido. |
| Los colores corporativos son los que identificaran nuestra marca y la harán memorable, por ejemplo, los colores de Google y Ebay, el rojo Ferrari, el naranja Repsol, Coca-Cola, McDonald, el violeta de Yahoo... Todas estas marcas tienen colores asociados. |
| |
2. Conceptos básicos de la teoría del color
|
| Para empezar, debemos saber diferenciar el color RGB y CMYK. |
| Los monitores, cámaras digitales, y plataformas digitales en general trabajan con RGB, mientras que las imprentas y los soportes en papel se basan en CMYK. |
| RGB son los colores aditivos, los colores luz (R=Red, G=Green, B=Blue). La suma de estos tres colores en la misma proporción forman el color blanco. |
| CMYK son los colores sustractivos, los colores pigmento (C=Cian, M=Magenta, Y=Amarillo, K=Negro). El cian, el magenta y el amarillo son los colores primarios y su suma forma el color negro. Si los combinamos obtendremos los colores secundarios: el naranja, el violeta y el verde. Los colores que están en espectro CMYK no se pueden ver con precisión en un monitor. |
| Colores análogos. Son los colores que se encuentran cerca de un color determinado, a ambos lados. Por ejemplo, los colores análogos del rojo son el naranja y el amarillo, y los colores análogos del violeta son el azul y el magenta. Producen una sensación armónica. |
 |
| Colores complementarios. Son los colores contrastados. Dentro del círculo cromático, se encuentran uno frente al otro, son colores puestos. El color complementario del azul es el naranja, el del verde es el rojo y el del amarillo es el morado. Produce un efecto llamativo y en determinados colores, agresivo. |
 |
| |
| Colores monocromáticos. Una gama de un mismo color, sin presencia de otros colores. Producen una sensación de homogeneidad. Para evitar la monotonía podemos jugar con la luminosidad y la saturación. |
 |
| |
| Colores acromáticos. Son los colores comprendidos entre el blanco y el negro. |
| Tríada de colores. Tres colores que en el círculo del color son equidistantes. El turquesa, el violeta y el amarillo son una tríada de color. |
| |
3. Significados del color
|
- Amarillo: Representa la calidez y la felicidad. Es un color estimulante y se suele asociar al intelecto. Desprende alegría. En determinados contextos puede simbolizar la velocidad.
- Rojo: Es un color estimulante, dinámico, y si abusamos de él, puede resultar agresivo. Se asocia al optimismo, el liderazgo, el coraje y la fuerza.
- Naranja: Es energético y agradable. Representa la vitalidad. Se utiliza para crear diseños dinámicos pero con menos fuerza que los tonos rojos.
- Azul: Representa la seriedad, la verdad y la seguridad. Produce calma y da sensación de confianza.
- Verde: Representa la estabilidad, el equilibrio, la tranquilidad, la vida y el bienestar. Aporta armonía al diseño.
- Violeta: Se asocia al lujo y la creatividad. También es un color que se asocia con la empatía y la afectividad y la magia.
- Rosa: El amor y la belleza.
- Marrón: Es la tierra y el orden.
- Blanco: Representa la sencillez, la pureza, la limpieza y la tranquilidad.
- Gris: Simboliza el dolor, la seguridad y la madurez
- Negro: Elegancia. También representa el misterio y el terror.
|
| |
4. Combinación de colores
|
| La combinación de colores es importantísima para cualquier diseño. Hay que tener en cuenta el impacto que pueden tener tanto en una web como en la imagen corporativa general ya que la influencia y la sensación que producirá en los usuarios es realmente importante. |
| Una de las primeras cosas a tener en cuenta es el número o cantidad de colores. Muchos colores con un grande contraste entre ellos pueden resultar un diseño demasiado agresivo y con muchas distracciones, pero por ejemplo, solo tres colores complementarios pueden crear una combinación más agradable. Siempre es mejor pocos colores. Tres colores diferentes en una misma composición son, en la mayoría de los casos, suficiente. Con menos de tres, hay posibilidad que la página resulte aburrida, monocromática y poco expresiva. |
 |
|
 |
| Combinación colores complementarios |
|
Combinación colores monocromáticos |
| |
|
|
 |
|
 |
| Combinación tríada de colores |
|
Combinación colores análogos |
|
| |
5. Consejos para estructurar los colores de nuestra web
|
| Con los colores podemos controlar o guiar al usuario sobre qué camino seguir de una forma subliminal. |
| Primero debemos elegir el color primario, el tono básico de la página. Lo podemos utilizar en el fondo de la web. |
| El color secundario será el segundo color predominante. Es aconsejable que sea análogo al color primario. Lo utilizaremos para acotar o resaltar áreas. |
| Por ultimo, necesitaremos un color destacado, preferiblemente complementario a los colores primario y secundario. Debe utilizarse con moderación en títulos u otros textos que queramos destacar. |
| |
6. Colores y tipografías
|
| Cuando se combinan colores con tipografías para títulos o textos destacados, hay que tener en cuenta que esta continúe siendo legible. Hay que elegir colores que enfaticen y mejoren la tipografía. Si utilizamos colores análogos, el texto se convierte menos visible. |
| Para textos más largos, es mejor si atenuamos el contraste para no cansar la vista. Por ejemplo, para el fondo de los contenidos, es mejor utilizar un color suave en lugar del blanco. |
| |
7. Herramientas gratuitas para la generación de combinación de colores.
|
| Adobe ® Kuler ® es una aplicación que nos ayuda a generar temas de color para nuestros proyectos. Se pueden modificar o crear nuevos temas. |
| Web de Adobe Kuler |
| Color Api es una aplicación que busca paletas de colores a partir de imágenes de Flickr. Por ejemplo, si buscamos el color azul, obtendremos numerosas imágenes de Flickr junto a una paleta de color. |
| Web de Color Api |
| Color Hunter nos genera a partir de una imagen una paleta de colores. Podemos utilizar esta herramienta para obtener una combinación a partir de un logo. |
| Web de Color Hunter |