Para crear una paleta acorde a tu marca y que funcione al 100% primero hay que entender ciertos aspectos de los colores en el diseño digital:
Aquello que resalta a nivel cromático (un color entre varios) será lo que queremos que el usuario vea primero, puede ser una acción, una promoción, una dirección, etc.
• Es decir, el color se utiliza para atraer al usuario. Si el color tiene una buena función estética puede atraer al usuario pero si no es así, puede generar rechazo.
• El color puede utilizarse para indicar significados de forma visual, por ejemplo un semáforo.
• También puede utilizarse para distinguir categorías o secciones, para indicar dónde estamos parados dentro de una app por ejemplo.
En el diseño digital tenemos dos modelos cromáticos:
RGB que significa red, green, blue. Consiste en representar distintos colores a partir de la mezcla de estos tres. En este modelo manejamos colores luz, que quiere decir que al combinarse llegamos a la luz blanca pura.
Se utiliza para el diseño en cualquier pantalla o interfaz digital.
La gama cromática es más amplia y genera colores más vibrantes, brillantes.
CMYK que significa: cyan, magenta, amarillo y negro. La “K” reprenta la tinta engra, que es la cuarta o ultima capa de impresion. Es un modelo de color sustractivo ya que al mezclar los cuatro colores primarios en una superficie blanca se genera color negro.
Se utiliza para el diseño impreso.
El negro se añade porque la combinación de las 3 tintas resulta en un castaño. En algunas ocasiones al negro se le añade un porcentaje de cyan o magenta de 20% o 30% para hacerlo mas profundo.
En resumen:
En toda la identidad visual vamos a proporcionar los colores en el modelo:
• RGB: valores que van del 0 al 255 para el diseño digital.
• CMYK: valores que van del 0 al 100% para diseños impresos.
• Pantone: son colores preparados y estandarizados por la empresa. Pantone crea paletas especiales para empresas y accesible a diseñadores. Es similar a las pinturas que se compran para pintar.
En Illustrator nos encontraremos con las siguientes opciones:
Hexadecimales: son colores consistentes a traves de la pantalla web y se definen por 6 caracteres. Por ejemplo el hexadecimal de blanco será: #ffffff.
En RGB los valores llegaran hasta 255 en cada unos de los canales, porque al mezclar los 3 banales obtendremos luz pura.
CMYK tendremos porcentajes en los 4 canales. Por ejemplo, para el blanco tendremos el valor 0% en los cuatros canales, ya que en impresiones el blanco no es color, sino ausencia de tinta.
Como vimos anteriormente, las personas podemos relacionar colores a circunstancias o sentimientos, esto se llama “psicología del color”. Algunas marcas se basan en la psicología del color para hacer asociaciones con la personalidad de su marca. Por ejemplo:
Una vez que entendimos cómo funciona el color en las pantallas digitales y en la impresión, y como los encontraremos en Illustrator, veamos cómo podemos combinar estos colores:
• Paleta monocromática: es la mezcla de un color puro con negro, gris o balnco. Es decir, conseguiremos una gama homogénea de un color. por ejemplo:
• Circulo cromático: es una representación visual de los colores primarios(rojo, amarillo, azul) y su combinación para crear todos los colores visibles. Es una herramienta que nos ayudará muchísimo para entender cómo combinar colores:
• Colores complementarios: son los colores que se encuentran opuestos, uno en frente de otro. Con esta mezcla conseguiremos un contraste de color.
• Colores complementarios análogos: son los colores que se sitúan a los dos lados de un color. Con esto conseguiremos una paleta armónica y suave.
• Colores complementarios adyacentes: son los colores situados a los lados de un color complementario.
Como se prepara una paleta de colores en el diseño digital: generalmente tendremos una paleta muy reducida (entre 3 y 5 colores) con los siguientes criterios:
Colores primarios: 1 a 2 colores primarios, éstos serán los que definan el tema de la marca. El color primario va a dominar un 70% del diseño.
Color acento: puede ser uno de los colores primarios o una variación del mismo. El color acento debe representar no más del 10% de la marca ya que sólo se usa para elementos que queremos resaltar.
Color semántico: lo utilizaremos para indicar el estado del sistema e indicar advertencias al usuario.
Colores neutro: grises, blancos y negros. Se van a utlizar para el contenido del texto. Estos colores no son necesarios ponerlos en la paleta de colores si solo se utilizaran para el texto, pero si son parte de la marca (del logo, de lo que representa) sí estarán presentes.
Cuando armamos una paleta de colores hay que tener en cuenta que estamos eligiendo colores que representen a nuestra marca, serán esos colores que el usuario verá y lo hará pensar en nosotros. Pero esto no quiere decir que cuando creemos piezas gráficas no podremos utilizar otros colores, claramente tendremos muchas circunstancias en las que necesitaremos apoyo de otros colores, pero lo que hacemos al crear una paleta es indicar que al menos uno de esos colores debe estar representando a la marca en la pieza que creemos.
Links útiles para paletas de colores:
Extraer una paleta de colores a partir de una imagen en illustrator:
En la opción de "explorar" pueden escribir una palabra clave como viajes, tecnología y automáticamente van a poder visualizar muchas opciones de combinaciones de colores.
También en la opción "crear".
Pueden subir una imagen y es extrae los colores más significativos.
-01.png)
