Si nada más, 2017 ha sido un año de color en el diseño de sitios web. Las tendencias de color han dominado la conversación sobre el diseño, con tonos más brillantes y brillantes como una gran parte del paisaje.
Hay una nueva tendencia de color que combina muchas de esas opciones brillantes en paletas de colores más grandes que podría esperar: los patrones de colores del arco iris. Así es, más diseñadores están tomando un cambio con mucho color e incorporando vívidos colores de degradado, arco iris en proyectos de diseño. ¡Y está muy bien!
Aquí le damos un vistazo a la tendencia y algunas ideas sobre cómo usar colores vívidos que no son llamativos.
Animación del arco iris para el compromiso
Casi desde que Spotify entró en escena, ha ido dando forma a las tendencias de diseño y superando los límites de lo que parece ser un diseño atractivo. El sitio de música actualiza y cambia constantemente su diseño y utiliza micrositios para resaltar géneros y artistas específicos.
El diseño del sitio web de London Grammar Moodmix utiliza una mancha de color que rebota para captar la atención del usuario. La animación es interesante y te da ganas de acercarte y tocarla. Y ese es el objetivo de esta animación en color arco iris. Observe que la llamada a la acción está justo en medio de todo ese color.
El resultado es un diseño simple con una animación interesante que lleva a los usuarios al objetivo del diseño. La animación trabaja con mucho color debido al movimiento. El blob no sería tan interesante en un solo color.
Color Vs. Oscuro
Los colores del arco iris pueden ser difíciles de usar debido a las preocupaciones sobre el contraste. Poner tonos brillantes de estilo arco iris sobre un fondo oscuro puede resolver la mayoría de estos problemas.
Los colores brillantes casi saltarán de un fondo oscuro.
Otro nombre bien conocido en diseño y desarrollo de sitios web, Github, está usando los colores del arco iris para promover su conferencia este año. El sitio web simple utiliza un divertido logotipo estilo arco iris y botones de llamada a la acción para la venta de boletos. Lo diferente de este diseño de muchos otros estéticos del arco iris es que el diseño es bastante plano y no se usa un degradado para los colores. Cada línea en el logo es de un color diferente al igual que las letras. Un gradiente se utiliza sólo para el botón CTA.
Savee va en otra dirección con el color del arco iris sobre un fondo oscuro, usando muchas imágenes de colores altos para crear un mosaico con una sensación de arco iris. Si bien la mayoría de los usos del color del arco iris proporcionan una graduación de rojo a amarillo a verde a azul, no siempre es así. Las paletas de colores del arco iris pueden ser cualquier cosa con un amplio uso de matices.
Color sutil
A veces, los mejores usos de los estilos de arco iris no saltan de la pantalla. Southwest usa una paleta más sutil con tonos de arco iris en el fondo.
La interesante elección casi rompe muchas de las otras tendencias de color del año y el resultado es refrescante. Usted ve el diseño casi porque es muy diferente a muchos de los otros diseños de sitios web disponibles ahora mismo.
Incluso con una paleta de colores del arco iris más tenue, ponga énfasis en el contraste entre los elementos de fondo y de primer plano para garantizar que cada elemento sea fácil de ver y leer. Este es el problema más común con los diseños estilo arco iris: no hay suficiente contraste y es difícil de leer.
Logo del arcoiris
Considere el uso de colores del arco iris para un logotipo simple. Este es probablemente el uso más difícil del color del arco iris, pero puede tener un efecto sorprendente.
Es un desafío debido a todos los lugares y formas en que se puede usar un logotipo. Optar por los colores del arco iris podría funcionar mejor para pequeñas marcas que no usan el logotipo en muchas aplicaciones. Definitivamente querrá una opción secundaria también para cuando una gran cantidad de color simplemente no funcione.
Richard Gazdik usa un logotipo de arco iris para su cartera, y para la navegación posterior. Funciona casi perfectamente gracias a sus iniciales - RGB - y la relación con los colores seleccionados. No todos tendrán esta suerte, pero muestra cómo un logotipo de alto color puede ser efectivo en un esquema de diseño simple.
El color como punto focal
El color del arco iris puede ser lo que atraiga a los usuarios a un diseño con una primera impresión fuerte.
Pero hay una línea delgada entre el color del arco iris que se engancha y el color del arco iris que puede alejar a los usuarios. ¿Recuerda algunos de los diseños de sitios web de finales de los años 90 y principios de los 2000 cuando casi todos los sitios web tenían colores brillantes salpicados (y parpadeando)? Ese tipo de tratamiento del color del arco iris puede ser desastroso y alejar a los usuarios.
Lonsdale hace lo contrario con un video en bucle de Rainbow Liquid que es fascinante de ver. Los cambios de movimiento y color son atrevidos y te dan ganas de mirar. El fondo del arco iris está compensado por el tipo de blanco y los elementos de navegación para conducir a los usuarios a través del resto del diseño, que se adhiere al color en imágenes sobre un fondo blanco.
Código de color tiene otro enfoque con muchos colores brillantes en todo el diseño. El color se utiliza para atraer el enfoque visual hacia el producto en la pantalla: teléfonos y relojes que muestran aplicaciones.
Crear un fondo atractivo
Las manchas de arco iris casi podrían ser una tendencia de color por sí mismas: animaciones líquidas, estilo de tinta, burbujas de colores en movimiento. Como elemento de fondo, el color del arco iris puede ayudar a establecer el tono de un proyecto e impulsar la participación del usuario. (Solo piense en lo mucho más atraído por el color que en un solo fondo beige).
Si bien muchos de estos elementos de fondo tienen algún movimiento en forma de animación o video, no tienen por qué hacerlo. Lo que es común entre los sitios web con fondos de arco iris es que a menudo se encuentran en la página de inicio o en el diseño que aparece sobre el desplazamiento y el resto del sitio web está menos ocupado.
Esa es una gran técnica cuando se trata de compromiso. Hay algo de inmediato para que los usuarios se conecten, lo que los lleva a contenido en el que pueden profundizar un poco más.
Más técnicas de gradiente
Los colores del arco iris pueden ser una extensión de otra tendencia de color de este año: el regreso del gradiente.
Intente una superposición de degradado con una sensación de arco iris. Elija un cambio de color a gran escala de rojo a azul, como SpicyWeb o elija colores un poco más modernos como Talkd.
De cualquier manera, usar un degradado puede ser una forma divertida de agregar color sin sentirse abrumador. Funciona a pantalla completa o en elementos más pequeños. Un degradado también puede ayudarlo a incorporar colores de marca en una combinación de colores de estilo arco iris sin un rediseño de sitio web completo.
Resaltar algo diferente
Usa la tendencia del color del arco iris para resaltar algo inusual o diferente en tu diseño. Debido a que los colores del arco iris son tan llamativos, pueden ayudar a los usuarios con un patrón de usuario poco convencional, llamar la atención sobre cierto contenido o parte de la pantalla o ayudar a crear clics y conversiones.
Jony Guedj usa el color para la navegación. Los elementos del menú no están compuestos de la forma habitual, se encuentran en la parte inferior de la pantalla y trabajan solo con la acción de desplazamiento para mostrar diferentes videoclips. Si bien típicamente este tipo de diseño no sería aconsejable, funciona aquí. Los colores del arco iris atraen a los usuarios a participar con ellos y ayudan a las personas a entender cómo usar el sitio web.
Conclusión
La tendencia del color del arco iris es muy divertida.
Puede ser difícil de usar si el color te intimida un poco. Pero comience con algo pequeño con un elemento de color arco iris para ver cómo funciona. La mayoría de los diseñadores no están convirtiendo sitios web completos en diseños de arco iris; están usando el color del arco iris para crear imágenes efectivas que atraen a los usuarios. Es probable que haya surgido la tendencia.