La web es un espacio que evoluciona rápidamente y así, nuevas tecnologías y técnicas de desarrollo pueden aparecer rápidamente. La mejora continua de las herramientas permiten una mayor libertad al diseñar interfaces e interacciones y, debido a esto, los patrones de diseño web y las técnicas pueden iniciar una tendencia en un corto período de tiempo.

A continuación se muestra una lista de las tendencias de diseño web a tener en cuenta durante el año 2017. No todos son nuevas, algunas mantienen su popularidad desde el 2016.

Hay algunas técnicas y tecnologías bastante nuevas que puede que desees implementar en tu sitio. Estas no necesariamente son de uso generalizado aún pero es posible que desees tomar ventaja de ellas para estar un paso adelante.

COLOR

Como sabemos ya seguramente hemos oído, la elección del color de un sitio web es muy importante pues puede influir en las emociones, los pensamientos y las tasas de conversión de los visitantes. Entonces, ¿cuáles van a ser las tendencias de color para 2017?

Pantone ha promovido su color 2017 del año: Verdor. Ha sido elegido como un símbolo de nuevos comienzos, un tono refrescante y revitalizante. No esperamos que todos los sitios web en 2017 serán verdes pero estamos seguros que habrán varios diseños web inspirados en este color.

Debido a la popularidad de la normativa de diseño Material Design de Google, los colores y combinaciones de colores recomendados por esta guía de diseño sea probablemente la tendencia en el 2017. Estos colores son brillantes y resaltantes. Incluso fuera de Material Design han habido muchos ejemplos de diseños web que incorporan colores brillantes recientemente.

El “duotono” es una imagen que se compone de dos colores. Hemos visto muchas imágenes de este tipo que se han utilizado en el último año y esperamos que este estilo sea más popular en el 2017.

Sitios como Spotify han utilizado imágenes duotono con gran efecto. Puedes haber notado que el duotono es un estilo popular en muchas imágenes miniatura en los videos de YouTube.

UN MODERNO RETRO

Ya sea el arte del pixel, tipografía clásica o imágenes inspiradas 80s y 90s, lo “retro” con un toque moderno está en boga. Ha estado impactando en el diseño web en los últimos años y muchos sitios están haciendo uso de este estilo.

CINEMAGRÁFICOS

Los cinemagráficos son imágenes con movimientos repetidos. Han ganado popularidad recientemente ya que , bien hechos puede ser visualmente sorprendentes.

Los cinemagráficos puede ser archivos GIF o de video y pueden dar como resultado un tamaño de archivo bastante grande si el cinemagráfico es de alta calidad. Los cinemagráficos GIF puede ser de más de 3MB por lo que es posible que desees considerar streaming de video en su lugar.

MATERIAL DESIGN

Material Design de Google está presente desde 2014. Está esencialmente construido en base al principio de papel y tinta, traduciendo estas cualidades a un formato digital. Por ejemplo, el uso de sombras y bordes para indicar que se debe tocar, por ejemplo, un botón.

Material Design ha crecido en popularidad en los últimos dos años, con numerosos temas y plantillas que se están creando para los CMS.

Una de las críticas que usted oirá de Material Design es que muchos de los sitios construidos con él parecen muy, pero muy, similares. Esto se debe a un error de aplicación dura del estilo de Material Design en lugar de aplicar sus principios de diseño.

Prevemos ver muchos proyectos web más pequeños que adopten el estilo Material Design, no sólo sus principios de diseño sino su estilo o tema actual aunque con cierta resistencia creciente en el tiempo para este último.

TIPOGRAFÍA RESALTANTE Y CREATIVA

2016 vio algunos usos muy creativos de la tipografía y se espera que en el 2017 se acreciente esta ola. Los tipos no sólo ocupan más espacio en pantalla sino que también hay expectativa para ver más tipos de letra creativos.

DISEÑO MODULAR

El diseño modular a pesar de no ser un tema nuevo ha ganado popularidad en los últimos años. Se trata de un enfoque de diseño que utiliza un patrón de cuadrícula modular en  bloque para colocar los elementos de diseño. Al mirar los datos de Google Trends se muestra un interés de por la búsqueda del «diseño modular» que ha crecido desde principios del 2011 y se espera que esta tendencia continúe en el 2017.

SVG

¿Si tus imágenes se transforman de forma indeseada al ajustarse a diferentes dispositivos o al hacer operaciones de zoom, deberías probar los archivos SVG en lugar de los formatos habituales de JPG y PNG.

El formato SVG es adecuado para todas las imágenes con gráficos vectoriales, por lo que, claro, no se puede usar para escalar cualquier foto, sin embargo, para imágenes como logos funcionan brillantemente.

Los SVG han estado desde aproximadamente 1999 pero aún vemos que se usan los formatos PNG y JPG en lugar de usar un conveniente SVG. Pero todo esto parece estar cambiando. Es probable que hayas visto que se menciona más acerca de los SVG y además Google Trends muestra que el interés en los SVG ha crecido año tras año desde el 2013. Prevemos un mayor uso y difusión de este formato en el 2017.

Las ventajas de un SVG es permitir que la imagen se escale sin distorsión y además una imagen SVG tiende a tener tamaños de archivo muy pequeños que es ideal para la velocidad de carga.

FLEXBOX

Flexbox es un modo de diseño CSS3 que facilita el trabajo con páginas que se espera se muestren en distintos dispositivos. El interés sobre Flexbox ha crecido cada año más y ahora con el apoyo de los navegadores modernos, más desarrolladores de interfaces front-end lo estén utilizando.

VIDEO 360 Y REALIDAD VIRTUAL

En el 2016 se ah dado un gran impulso a la RV. Muchos videojuegos de VR han sido lanzados y el video 360 ha sido buscado con mayor interés. Se espera que los diseñadores idearán formas de incorporar tanto el video 360 como la RV en los sitios web durante el 2017, utilizando por ejemplo, Google VR View, una API JavaScript que permite agregar fácilmente experiencias de video 360 al sitio web.

MICROINTERACCIONES

Las microinteracciones son, como dice su nombre, interacciones pequeñas que se dan entre el usuario y el sitio web, tales como gustarle un post, enviar un mensaje o rellenar un campo de formulario. Su propósito es mejorar la UX proporcionando retroalimentación e información para el usuario.

Las microinteracciones se han popularizado cada vez más y las maneras en que la retroalimentación y la información es dada a los usuarios es cada vez más creativa esperándose ver mucho más en el 2017.