Krypton Solid

La última tecnología en raciones de 5 minutos

4 formas en que los colores vibrantes mejoran el diseño de la interfaz de usuario

4 formas en que los colores vibrantes mejoran el diseño de la interfaz de usuario

El color es una de las herramientas más poderosas en el juego de herramientas del diseñador. Puede llamar la atención, establecer un estado de ánimo, influir en las emociones, percepciones y acciones de los usuarios. Con la presencia persistente de Flat and Material Design, el color tiene aún más prominencia en el diseño de UI en la actualidad. Los colores brillantes son igualmente adecuados tanto para diseños de dibujos animados divertidos centrados en el entretenimiento como para los estilos elegantemente minimalistas centrados en soluciones empresariales. Esta versatilidad hace que los colores vibrantes sean una de las mayores tendencias de diseño de interfaces de usuario de 2017.

El atractivo de la tendencia del color vibrante es que se puede aplicar de muchas formas y estilos diferentes al diseño. En este artículo, analizaremos más a fondo cuatro tendencias de combinaciones de colores y analizaremos algunos ejemplos inspiradores que las implementan de manera muy efectiva.

1. Monótono

Una de las formas más populares de usar colores vibrantes en su diseño es una técnica llamada monótona. Las paletas monótonas incluyen un solo color con una mezcla de tonos y tintes. Monotone es bastante fácil de crear: piense en el color que mejor se adapte a su mensaje y considere la cantidad de variación que desea entre los tonos.

Mejorar la legibilidad

Monotone ayuda a establecer una base sólida para el contenido en primer plano, cuidando la legibilidad. Junto con una tipografía espectacular, los esquemas de colores monótonos pueden crear una experiencia verdaderamente memorable.

001

Sydneystockhom usa colores llamativos para crear una apariencia memorable de una manera muy simple

2. Duotono

Como sugiere el nombre, el duotono es una imagen compuesta por dos colores. Pueden ser dos tonos del mismo color o dos colores contrastantes. La técnica que alguna vez fue un elemento básico de impresión ha encontrado una nueva vida en línea. Gracias a Spotify, el duotono está ganando popularidad casi todos los días.

Crea una atmósfera

Duotones te permite inyectar cualquier imagen con los atributos emocionales de cualquier color. Recuerde que los diferentes colores evocan diferentes emociones. La combinación de colores suave y modesta es capaz de crear una atmósfera seria. Por ejemplo, en Holm Marcher & Co Por ejemplo, cada detalle intenta contribuir a la atmósfera profesional, y las imágenes de fondo no son una excepción.

002a

Mientras que una combinación de colores brillantes puede crear una sensación de felicidad. Diseño de New Deal llama la atención gracias a una atrevida elección de color. Crean un ambiente agradable y crean un estado de ánimo positivo.

002b

Incrementar la legibilidad

Duotone es capaz de dar mucho contraste al texto. Ajusta las variaciones de color en una imagen para que el texto se pueda colocar usando un solo color en casi cualquier lugar de la imagen.

002

3. Gradientes

Los degradados han regresado a las GUI, esta vez utilizando colores complementarios de alto contraste. Los degradados modernos pueden incluir varios colores, irradiar desde el centro, provenir de una esquina o caer horizontalmente.

Crea una apariencia moderna

Los degradados regresaron y dieron nueva vida a la tendencia de colores brillantes. Combinados con una paleta de colores planos, pueden evocar sentimientos de modernismo. Con un solo color, Zample utiliza un efecto degradado en su fondo sin caer en tonos apagados.

003

Al utilizar uno de los colores brillantes y saturados asociados con Material Design, puede evocar sentimientos de modernismo.

Haga que el diseño sea agradable a la vista

Los degradados pueden mejorar la comunicación visual. La transición de naranja a rosa en Symodd’s El siguiente ejemplo proporciona profundidad y contraste a la interfaz y crea algunos efectos visuales llamativos. El cambio de claro a oscuro sigue los patrones naturales de escaneo del ojo humano que se mueven desde la parte superior izquierda de la página hacia la parte inferior derecha.

004

La página de inicio de Symodd presenta un fondo degradado completo de naranja a rosa. Es un degradado sutil ya que los dos tonos no son muy diferentes entre sí, lo que lo hace agradable a la vista.

Úselo como acento

Si bien el degradado se usa a menudo como fondo para las páginas, también pueden funcionar en lugares más pequeños. Considere usar degradados como acento en la navegación, para imágenes secundarias o para tipos específicos de contenido. Lo bueno de las áreas más pequeñas de degradado es que tienes más libertad para jugar con esta técnica. Y cuando se usa en espacios más pequeños, puede ser visualmente interesante jugar con múltiples pares de colores, al igual que Bloomberg hizo en el ejemplo siguiente.

005

Bloomberg usa gradiente para el ticker Latest News.

4. Superposiciones

Superponer es filtrar una imagen a través de una “lente” de color. Las imágenes con superposiciones de color han sido una opción de diseño popular durante mucho tiempo porque es bastante fácil crear este efecto: simplemente cubre una imagen o video con un cuadro de color semitransparente.

Centrar la atención del usuario

La superposición de efectos puede ayudar a los usuarios a centrarse en determinados elementos de diseño. Sin embargo, cuando utilice un solo color como superposición, piense en el grado de saturación y transparencia del color. Las combinaciones de colores intensos (menos transparencia y más saturación) ponen más énfasis en el color en sí:

006

Superposición de color utilizada por Contornos pone más énfasis en la imagen

Conclusión

Es difícil encontrar una técnica de diseño con la que sea más divertido jugar que el color. Los efectos de color pueden ser dramáticos, impresionantes e incluso serenos. No tenga miedo de salir de su zona de confort cuando se trata de trabajar con colores. Si eres un fanático de los tonos brillantes y atrevidos o prefieres un blanco y negro más minimalista, lo único que debes recordar: no hay colores incorrectos, lo que más importa es cómo los usas.

Deja un comentario

También te puede interesar...

Samsung, SK Telecom lanza el servicio LTE-R

Samsung Electronics y SK Telecom han lanzado el primer servicio LTE-R en Corea del Sur, anunciaron las empresas. La red LTE-R se implementó en la Línea 1 del Metro de Busan en Corea del Sur,

El plan TPG ilimitado llama la atención de la ACCC

La Comisión Australiana de Competencia y Asuntos del Consumidor (ACCC) ha calificado las afirmaciones de TPG de planes de banda ancha ilimitados como falsas y engañosas y ha anunciado planes para demandar a la compañía

El robot T-HR3 de Toyota imita el movimiento humano

Video: la gente prefiere los robots defectuosos a los perfectos Toyota está presentando su último robot, un humanoide llamado T-HR3, en el Salón Internacional de Robots de Tokio esta semana. El robot en sí parece

Prueba: ¿Realmente odias Comic Sans?

Prueba: ¿Realmente odias Comic Sans? Eres diseñador: usas cuadernos Moleskine, las pegatinas en la parte posterior de tu MacBook Pro están dispuestas ingeniosamente, hay un póster motivacional colgado sobre tu escritorio y … llevas tu

Las mejores cuentas del mercado monetario para 2022

Cooperativa de crédito Patelco Con la tasa de interés más alta para saldos modestos, sin tarifas mensuales o mínimas e incluso cheques gratuitos, Patelco Credit Union es nuestro ganador de la mejor cuenta del mercado

CEO de Toysrus.com: Quiere a tu madre

Sus rivales hablan de verdaderos ejércitos de adolescentes que se apresuran en la Web, con los bolsillos llenos de dinero. Pero el CEO de Toysrus.com, John Barbour, cree que el futuro de las ventas de

Cómo desbloquear a Wonder Woman en Fortnite

¿Quiénes son los superhéroes más populares? Al hacerle esta pregunta a muchas personas, es probable que surjan dos respuestas: Marvel y DC Comics. En el primer caso inmediatamente vienen a la mente nombres como Iron