6 tips para escoger colores en nuestra interfaz de usuario (UI)





El diseño de experiencia del usuario involucra muchos procesos que deben llevarse a cabo cuidadosamente para que una interfaz satisfaga las necesidades del público objetivo. Cada paso requiere una atención profunda a los detalles, incluso si no parece demasiado complicado.

Una de las etapas de vital importancia en la creación de la interfaz de usuario (UI) es la elección del color. Los diseñadores a veces pueden pasar horas para elegir la paleta de colores correcta. En este artículo, te dejo seis consejos útiles para ayudarte a elegir colores potentes para la interfaz de usuario y hacer que este proceso sea más fácil y productivo.

Consejo 1. Aprende la regla 60-30-10


Esta regla, o técnica, proviene del diseño interior, por lo que a menudo se aplica para decorar la casa. La idea es simple Para llevar el equilibrio a la composición, los colores deben combinarse en la proporción de 60% -30% -10%. El mayor porcentaje debe ir al tono dominante, la tercera parte de la composición toma color secundario y el 10% por ciento va al color que ayuda a hacer los acentos.

Tal proporción se considera agradable para los ojos humanos, ya que permite percibir gradualmente todos los elementos visuales. Al conocer la proporción adecuada, los diseñadores pueden combinar los colores sin riesgo de convertir la interfaz de usuario en un desorden colorido.

Porcentaje de color interfaz de usuario


Consejo 2. El contraste es tu amigo

El contraste de color es una parte clave de cualquier composición visual. Trae la individualidad para cada elemento de la interfaz de usuario y los hace visibles. Las interfaces de usuario que solo contienen sombras de la misma familia de colores tienen menos oportunidades de llamar la atención a los usuarios. Además, copiar contenido en esta interfaz de usuario parecerá ilegible, lo que hace que las interacciones con un producto sean casi imposibles.

Los diseñadores controlan el nivel de contraste en función de los objetivos que se supone que deben lograr. Por ejemplo, si necesitas que los usuarios presten especial atención a los elementos de IU específicos, es una buena idea aplicar dos colores de alto contraste como el azul y el rojo. El alto contraste se usa a menudo para el diseño de botones CTA.

Sin embargo, hablando de UI como una composición completa, el alto nivel de contraste de color no siempre funciona bien. Si la copia del contenido y los colores de fondo se contrastan demasiado, será difícil leer o escanear el texto. Es por eso que recomiendo a los diseñadores crear un nivel leve de contraste y aplicar colores de alto contraste solo para resaltar elementos. Las pruebas de usuario en varios dispositivos pueden ayudarte a vos como diseñador asegurarte de la efectividad de tus soluciones.

Consejo 3. Toma en cuenta la psicología de los colores


La psicología es uno de los estudios básicos que ayudan en el flujo de trabajo de diseño. Existe una rama de la psicología que muestra la influencia de los colores en el estado de ánimo y el comportamiento humano, llamado psicología del color (https://uxnicaragua.blogspot.com/2017/06/teoria-colores-en-diseno-ux.html). Establece que nuestra mente reacciona sobre los colores, mientras tanto es un comportamiento que generalmente no lo notamos. Cuando los ojos humanos perciben un color, nuestro cerebro envia señales al sistema endocrino que libera hormonas responsables del estado de ánimo y las emociones.

Cada color tiene su propia influencia en nuestra mente y el conocimiento de las posibles reacciones puede ayudar a los diseñadores a transferir el mensaje correcto y llamar a los usuarios para que realicen la acción esperada. Aquí hay te dejo una breve lista de significados de color.

Rojo. Simboliza los sentimientos buenos y malos, incluidos el amor, la confianza, la pasión y la ira.
Naranja. Un color enérgico y cálido que trae los sentimientos de emoción.
Amarillo. Este es el color de la felicidad, la luz del sol, la alegría y la calidez.
Verde. El color de la naturaleza que trae sentimientos calmantes y renovadores.
Azul. A menudo representa algunas imágenes corporativas. Puede estar asociado con la distancia y la tristeza.
Púrpura. Largo asociado con la realeza y la riqueza. También es un color de misterio y magia.
Negro. Se asocia con una tragedia y muerte y significa misterio. Al mismo tiempo, puede ser tradicional y moderno.
Blanco. El color significa pureza e inocencia, así como integridad y claridad.

Además, vos como diseñador debes recordar que la percepción visual es bastante individual para todos. Factores tales como la edad y el género tienen un gran impacto en las preferencias de color, por lo que es vital conocer las peculiaridades del público objetivo.

Consejo 4. No te olvides de las diferencias culturales




Cada cultura tiene sus propias tradiciones y creencias, por lo que antes de elegir los colores, debes asegurarte de que se interpretarán de la manera correcta. El hecho es que a veces un color puede tener significados absolutamente opuestos en diferentes países. Por ejemplo, en los países europeos, el color blanco significa pureza y se usa a menudo en las bodas, mientras que en muchos países asiáticos este color significa muerte y tristeza. El uso incorrecto puede conducir a malentendidos que podrían ser fatales para un producto. Al reconocer las especialidades de la percepción del color de la cultura, los diseñadores disminuyen los riesgos de ser malinterpretados.


Consejo 5. Pon esfuerzo por armonizar el color


En el diseño de la UI se debe esforzar el tema de la armonía. Para que los usuarios se sientan complacidos y cómodos, debes como diseñador intentan equilibrar la interfaz de usuario. La armonía del color se trata de la disposición de los colores en el diseño de la manera más atractiva y efectiva para la percepción de los usuarios. Los colores armónicos contribuyen a una buena primera impresión desde un sitio web o la aplicación.

Después de años de búsqueda, los diseñadores distinguieron los esquemas básicos de color que funcionan de manera efectiva. Veamos cuales son.


  • Monocromo. La armonía del color se basa en un color con varios tonos y matices.
  • Análogo. El esquema aplica colores ubicados uno al lado del otro en la rueda de colores.
  • Complementario. Es la combinación de colores colocados uno frente al otro en la rueda de colores y tiene como objetivo producir un alto contraste.
  • Division-complementario. Este esquema funciona de manera similar al anterior pero emplea más colores. Por ejemplo, si eliges el color azul, necesita tomar otros dos que son adyacentes a su color opuesto, que significa amarillo y rojo.
  • Triadico. Se basa en tres colores separados que son equidistantes en la rueda de colores. Los profesionales recomiendan usar un color como dominante, los otros como acentos.
  • Tetriadico / Doble-Complementario. El esquema de colores tetradico emplea cuatro colores de la rueda que son pares complementarios. Si conectas los puntos en los colores elegidos, formaran el rectángulo.


Consejo 6. Roba ideas de la naturaleza


La madre naturaleza es la mejor artista y diseñadora del mundo. Las combinaciones de colores que podemos ver en el entorno natural son siempre casi perfectas. La gente disfruta de ver atardeceres y amaneceres, bosques de otoño y montañas de invierno, ya que están llenos de combinaciones de colores naturales.

Entonces, ¿por qué no intentar tomar prestadas algunas ideas? Sal a caminar o busca bellas fotos de la naturaleza y definitivamente encontraras la inspiración.

El éxito de un producto digital depende en gran medida de los colores elegidos para tu interfaz de usuario. Los colores correctos ayudan a los usuarios a sentirse cómodos con un producto. Los diseñadores pueden poner a la gente en el estado de ánimo que los impulsa a actuar simplemente aplicando la paleta de colores adecuada. Haz sus elecciones sabiamente, espero que este articulo haya sido de tu agrado :).

Fuente: https://uxplanet.org/color-matters-6-tips-on-choosing-ui-colors-260f56197a7b

Comentarios