Vivimos en un mundo colorido, y los diferentes colores de los objetos harán que tengamos diferentes emociones. El color afecta el cuerpo y la mente de las personas. El rojo fuerte puede aumentar la presión arterial, mientras que el azul puede calmar a las personas. Al diseñar una interfaz de usuario, el color es el factor más simple e importante que afecta a los usuarios. Mucha gente piensa que la elección del color de la interfaz de usuario depende del gusto y la estética del diseñador. Sin embargo, el proceso de selección del color es más complicado de lo que parece y juega un papel importante en el diseño. El color se puede utilizar para crear un estado de ánimo, atraer la atención o dar énfasis, estimular el estado de ánimo o calmar. Al elegir la combinación de colores adecuada, puedes crear una atmósfera de elegancia, calidez y calma. La selección del color se basa en la psicología del color y la teoría del color. Presentamos este contenido en detalle a continuación. Psicología del color Las preferencias de color de hombres y mujeres son diferentes, y las preferencias de color de los diferentes grupos de edad también son diferentes. Según la investigación de Joe Hallock, las opciones de color varían mucho entre géneros. El estudio tuvo como objetivo descubrir el grado de preferencia por diferentes colores, desde el color más preferido hasta el color menos preferido. Las preferencias de color de los diferentes géneros son las que se muestran en la figura anterior. Tanto a hombres como a mujeres les gusta especialmente el azul, mientras que a ellos les gusta menos el marrón. Tomemos un caso de aplicación para ilustrar que el objetivo de esta aplicación es gestionar los costos y sus usuarios incluyen tanto hombres como mujeres. Primero supongamos que un principiante que no entiende los colores elige el marrón como color principal de la aplicación porque el marrón es su color favorito. Los resultados son los siguientes: La aplicación de gestión de costos se muestra en la imagen. Aunque el diseño está bien, es posible que la aplicación no funcione correctamente debido a la elección de colores. Entonces, ¿cómo optimizarlo? Más adelante en este artículo, explicaremos cómo optimizar toda la aplicación únicamente mediante cambios de color. Aquí viene el valor de la combinación de colores: los diseñadores deben comprender el significado y el impacto del color para transmitir el tono y el mensaje correctos y guiar a los usuarios a realizar los comportamientos esperados. Cada color tiene un impacto en nuestro pensamiento y comprender el impacto probable puede ayudar a los diseñadores a transmitir el mensaje correcto y guiar el comportamiento del usuario. Como diseñador, debe comprender el significado del color. Aquí hay solo una breve introducción. Para obtener más detalles, consulte /color-meaning.html Teoría del color 1. Círculo de colores Al diseñar una interfaz, hay muchos colores que se pueden usar. usado. Lo primero que hay que mencionar es la rueda de colores. La famosa rueda de colores Otro tema importante es la combinación de colores. Hay muchas formas de combinar colores, pero se deben equilibrar los colores cálidos y fríos. Aquí hay varios estilos de combinación de colores: colores complementarios, colores adyacentes, tríadas, colores complementarios divididos, rectángulos (colores complementarios divididos dos veces), cuadrados. Todo diseñador debe conocer las tres propiedades del color: tono, valor y saturación. La descripción que hace Christian Vizcarra de las propiedades del color es muy detallada y este artículo se basa en su contenido relevante. 2. Hue Hue es el color en su estado natural. Por ejemplo, azul, amarillo, verde, rojo, etc., no hay cambios en la luz y la oscuridad. En resumen, no hay colores que cambien de claro a oscuro en la rueda de colores. Como se muestra a continuación: 3. Valor El valor se refiere a la claridad y oscuridad del color. Tomando la naturaleza como ejemplo, algunos objetos tienen diferentes colores por la mañana y por la noche. Por ejemplo, los árboles y las montañas tienen colores más claros por la mañana y se vuelven más oscuros por la noche a medida que disminuye la luz. Foto de Nextvoyage de iconscout Cuanto más cerca esté el objeto de la fuente de luz, mayor será el brillo y viceversa. El brillo juega un papel importante en el diseño de la interfaz de usuario si se usa bien, se puede lograr un buen efecto de contraste. Cuando el brillo llega a 100, el color se vuelve blanco; cuando el brillo llega a 0, se vuelve negro. Como se muestra a continuación: Brillo del color 4. Saturación La saturación es la pureza del color. Aumente la saturación y los colores se volverán más intensos, vívidos y vívidos; disminuya la saturación y los colores se volverán apagados y apagados. Saturación de color Antes de utilizar la saturación, es necesario conocer el soporte del diseño, ya sea impreso o electrónico. Al diseñar para imprimir, la saturación no puede ser demasiado alta porque el modo CMYK utilizado para imprimir tiene ciertas limitaciones. La proporción áurea de colores en el diseño de la interfaz de usuario: el principio 6:3:1. El principio de 60 30 10 es la mejor proporción para lograr el equilibrio de color. Utilice el color principal en 60 espacios, el color secundario en 30 espacios y los 10 espacios restantes para otro color.
Esto hace que sea muy cómodo para la vista del usuario desplazarse de un punto a otro. Utilice la paleta del principio 6:3:1. Las sombras en la interfaz de usuario no tienen sombras negras completamente puras. El color de la sombra se verá afectado por el color inherente del objeto en sí, como se muestra en la siguiente figura. Foto de Brigitte Tohm de iconscout El tono cereza es un rojo intenso que parece casi negro, pero no negro puro. Por ejemplo, también hay sombras en las flores, los platos y los gofres, que no son de color negro puro. La luz y el entorno determinan el color de las sombras. Un error común en el diseño de la interfaz de usuario es utilizar negro translúcido como sombra. Las sombras y los colores de fuente de los elementos de la UI. La mayoría de las interfaces actuales son blancas. El propósito es simplificar la interfaz tanto como sea posible y centrarse en el contenido en sí, por lo que la tipografía se ha convertido en un elemento muy importante. El color del texto de la izquierda es negro puro (# 000000) y el color de la derecha parece negro, pero en realidad es negro con azul agregado, lo que lo hace azul-negro (# 181441). El color de fuente es muy importante en la mayoría de las interfaces blancas, como se muestra en la siguiente figura: Contraste de dos colores en la misma transparencia. Bajo la misma transparencia, los dos grupos de texto tienen diferentes colores de fuente y diferentes efectos. Un grupo es gris y el otro es gris azulado. Los diferentes tonos de texto tienen un impacto significativo en la interfaz. En la foto a continuación: Usar negro y gris, ¿es malo? No. La gente suele decir que "el negro hace que todo sea genial", por lo que depende de los sentimientos personales. Al trabajar con el color, tener en cuenta los matices permite lograr un mejor contraste y armonía. Después de que la optimización de la aplicación de gestión de costos se cambió a verde, la aplicación se veía mucho mejor. Porque necesitábamos mostrar un fuerte deseo emocional de dinero y crecimiento en esta aplicación, y el verde describe el mundo del dinero y las finanzas, tanto a hombres como a mujeres les gusta el verde. (Nota del traductor: en países extranjeros, el verde representa el aumento del mercado de valores, por lo que para ellos es más apropiado usar aplicaciones verdes para dinero. El uso del color es más adecuado para el grupo de usuarios y la experiencia será mejor. . El color también se vuelve más informado)