¿Cuáles fueron las mayores tendencias de diseño web de 2017 y cuáles serán las más importantes en 2018? A medida que el año pasado llegaba a su fin, pedimos a los principales diseñadores y directores de estudio que compartieran sus puntos de vista, perspectivas y predicciones.
Al igual que cuando les presentamos 10 grandes tendencias de diseño gráfico para 2018, no se trata de seguir al rebaño creativo: se trata de hacer un balance de dónde se encuentra la industria en este momento. Entonces, sigas estas tendencias o no, es útil saber cuáles son. Quizás también quieras consultar nuestra guía de las tendencias de ilustración más importantes de 2018.
01. Animación web
“La animación puede desempeñar un papel muy importante a la hora de hacer que las ideas y las interfaces sean más fáciles de entender”, afirma el diseñador interactivo Chris Gannon. “En un mundo donde todo el mundo tiene prisa y el tiempo es escaso, la animación puede transmitir ideas complejas en poco tiempo y, al mismo tiempo, atraer e informar”.
Bruno La Versa, diseñador digital senior de Lightful, está de acuerdo. “La narración de historias y la personalidad es algo en lo que las marcas nuevas y antiguas están trabajando para captar la atención de los usuarios, y las animaciones están empezando a jugar un papel más importante en esto”, afirma. “Las animaciones han mostrado y seguirán mostrando la fuerza de la marca en nuestro mundo digital, dando una fuerte personalidad a la marca, haciéndola menos estática y más dinámica”, afirma La Versa.
Esta animación de Chris Gannon es parte de la aplicación GIF oficial de Twitter.
Entonces, ¿qué veremos más específicamente en animación en 2018? Los logotipos animados son una tendencia obvia que brinda a las empresas una gran oportunidad de mejorar aún más su marca. Sin embargo, hacerlo bien es una gran responsabilidad. “Es una representación visual de la empresa en un espacio pequeño y, si es un buen logotipo, tiene mucho significado”, explica Gannon.
También estamos viendo el regreso del GIF, en parte gracias al hecho de que los GIF animados básicos pueden ser leídos por casi cualquier cosa. “Parece que el mundo está listo (y de hecho está pidiendo a gritos) animación de todo, ya sean bucles cómicos de gatos que caen de las mesas o agregar un sentido de diversión al logotipo en su firma de correo electrónico”, dice Lee Fasciani, fundador de Proyectos de Territorio.
Los GIF, como este de Chris Gannon, vuelven a estar de moda
¿Qué ha causado entonces este entusiasmo por la animación? Bueno, el volumen de herramientas de creación ahora disponibles para los diseñadores ha jugado un papel importante. “Muchas de estas herramientas están dirigidas a diseñadores, desarrolladores u otras personas que no son animadores y tienen interfaces diseñadas para simplificar las complejidades de su construcción”, dice Gannon.
“Esto abre el campo de juego a más y más personas y les permite experimentar con la animación. Esto es bastante grande porque históricamente los no animadores se han mantenido alejados de la parte de animación del proyecto”.
Mireia López, directora creativa de la agencia creativa digital DARE, también señaló cómo estas herramientas están ayudando a difuminar las líneas entre diseño y desarrollo. “Hemos visto equipos de diseño animando, creando prototipos y aprendiendo codificación ordenada para utilizar herramientas de creación de prototipos más complejas para comunicar conceptos a los clientes y explicar los viajes digitales a los desarrolladores”, dice.
Cuando se combina la disponibilidad de dichas herramientas con las mejoras del navegador, es fácil ver por qué la animación será tan importante en 2018. Los navegadores actuales superan los 60 fps, incluso en formatos vectoriales como SVG y móviles.
Como ocurre con cualquier tendencia, es importante no incluirla por incluirla: tiene que ser adecuada para su proyecto. “Todos tenemos la responsabilidad ante nuestra audiencia de elegir cuándo y cuándo no utilizar la animación”, advierte Gannon.
“¿Mejora o contribuye positivamente a la experiencia? Mi corazón se hunde cuando un cliente se acerca a mí y me dice que quiere 'esparcir animaciones por toda nuestra aplicación'. Introducir una animación en un diseño rara vez termina bien porque la animación no tiene ningún propósito aparte de excitar.”
Pero no hay discusión: cuando se hace bien, la animación puede transformar un buen proyecto en uno excelente. Para sumarse a la tendencia, consulte nuestros 5 pasos para dominar la animación web y 10 brillantes animaciones web de Chris Gannon.
02. Colores más aventureros
“Durante el año pasado hemos visto un aumento en el uso de colores llamativos en las plataformas digitales”, señala James Bearne, director creativo de Kagool. Un gran ejemplo es el del nuevo esquema de marca de DesignStudio para la temporada 2016/2017 de la Premier League.
“Un cambio seguro de la identidad anterior, el sorprendente tratamiento visual no se detuvo en el sitio web o su aplicación; llegó rugiendo a las canchas con vallas publicitarias, redes sociales y más”.
El trabajo de Design Studio para la Premier League está lleno de colores llamativos
Y esto no disminuirá en 2018, predice Bearne. “Con nuevas herramientas como Khroma que nos ayudan a encontrar formas más interesantes de utilizar el color, parece probable que veamos a más diseñadores explorando cómo se puede utilizar el color para ofrecer experiencias excepcionales.
“Lo que será interesante ver es cómo se puede utilizar el color junto con la personalización para crear experiencias verdaderamente únicas para los consumidores que marcan varias casillas a la vez”.
03. Tipografía inventiva
En la batalla por captar la atención, la tipografía es un arma poderosa y su uso en la web se ha ampliado este año, dice Kelly Morr, gerente senior de estrategia de contenido de 99designs. “La tipografía es poderosa y cuanto más grande, mejor. Entonces, mientras los estilos neogrotescos sans-serif como Helvetica siguen de moda, los diseñadores se están diversificando y recurriendo a la gran variedad de tipos de letra disponibles”.
Ella predice que en 2018 veremos el regreso de las serifas a la pantalla, así como un número cada vez mayor de sitios que combinan fuentes serif y sans-serif (como se ejecuta maravillosamente en GE) para crear una experiencia de usuario dinámica.
La tendencia del recorte de tipografía en acción en el sitio web de Danbury
El hecho de que las resoluciones de los dispositivos sean cada vez más nítidas, aumentando el factor de legibilidad, también está abriendo la puerta a un aumento en las fuentes personalizadas. “Los diseñadores están optando por tipografías con mucha personalidad, no sólo por el énfasis, sino también por el efecto estético. Todo esto, más el dramatismo que ofrecen las tipografías de gran tamaño, demuestra que 2018 no será todo cuestión de sutilezas, y podemos esperar ver que se sigan desarrollando tendencias audaces”.
Otra tendencia relacionada con la tipografía identificada por Gee Guntrip, gerente de estudio de Hyped Marketing, es la de los recortes de tipografía. “La técnica utiliza un bloque de color sobre una imagen fija o en movimiento que aparece a través de letras claras”, dice. “Elegir el tipo de letra correcto y limitar el número de letras es fundamental para que esto funcione.
“Por ejemplo, Danbury lo ha hecho muy bien con un recorte de texto brillante que atrae la atención del usuario hacia su vídeo. Comedie Francaise utiliza el efecto de tipografía al pasar el texto. Y Nurture Digital muestra videos a través de cartas”.
04. Narración de datos
“2017 ha sido un gran año para el diseño”, dice Craig Taylor, gerente senior de diseño de visualización de datos en Ito World. “Hemos sido testigos de un auge en las visualizaciones animadas y de un mayor apetito por la representación de datos desde una perspectiva 3D. Pero, ¿de qué sirven estos datos, hermosos o no, si no son digeribles y, en última instancia, utilizables?
Ingrese lo que Taylor llama el narrador de información. “Ahora se hace un enorme énfasis en contar historias de forma eficaz a través del diseño, transmitiendo información a menudo compleja de la forma más sencilla y atractiva posible a una variedad de audiencias”, explica. “Los diseñadores están pensando fuera de lo común con creaciones nuevas y personalizadas: las paletas apagadas de lo antiguo se abandonaron en favor de transiciones de colores vibrantes combinadas con una tipografía minimalista pero audaz”.
Entonces, ¿qué nos depara el 2018 para el diseño de la información? “Una mayor accesibilidad a las nuevas tecnologías sin duda provocará un aumento en el número de diseñadores que utilizan la animación como medio para contar historias”, cree Taylor.
“Y con los avances de AR y VR que marcan el comienzo de la perspectiva de la exploración simulada de modelos virtuales, es importante que recordemos mantener la información y los datos en el centro de lo que hacemos. Si lo hacemos bien, las esferas superpuestas de la ciencia de datos y el diseño permitirán ejemplos de visualización de datos cada vez más informativos, fundamentados y claros”.
IKEA y Apple se unieron recientemente para crear una aplicación de diseño de viviendas con realidad aumentada
Lee Fasciani está de acuerdo en que la realidad aumentada y la realidad virtual tienen mucho más que ofrecer en el futuro. “La tecnología nos ha permitido mezclar más fácilmente nuestro mundo real con nuestro mundo basado en pantalla”, dice. “Estamos dejando atrás un deseo cada vez mayor de agregar video a nuestras experiencias digitales; colocándolos en capas con una profundidad y riqueza inalcanzables no hace mucho tiempo.
“Una realidad mixta nos lleva firmemente a lo 'nuevo'. Con grandes empresas de tecnología comprometidas con la innovación en AR, el diseño futuro deberá considerar nuestro mundo en las cuatro dimensiones. Estamos viendo el comienzo de esta realidad mixta en juegos populares y más. aplicaciones funcionales como IKEA Place”.
El trabajo de Mike Brondbjerg, como estos estudios de proximidad, visualiza los datos de nuevas maneras.
Para los principiantes que quieran empezar a explorar una visualización de datos más sencilla, hay muchas herramientas nuevas disponibles. “Las bibliotecas como D3.JS son excelentes, pero pueden resultar un poco intimidantes para quienes no son desarrolladores”, dice el experto en visualización de datos Mike Brondbjerg. “Pero ahora hay muchas plataformas que importarán, visualizarán y alojarán sus proyectos de datos. Plataformas como Datawrapper son excelentes para producir fácilmente una variedad de gráficos estándar, y Flourish está haciendo grandes cosas con visualizaciones de estilo periodístico y narrativo”.
Sin embargo, toda esta innovación debe conllevar cierta precaución. Brondbjerg ofrece una advertencia: “En la era de las noticias falsas, la visualización de datos de alta calidad también debe ser clara, transparente y confiable”.
En 2017, parece que no ha pasado un día sin una nueva aplicación, herramienta o característica de la talla de InVision, Adobe XD, Figma, Axure, Marvel, Vectr y otros. Y eso incluye Sketch, cuya actualización de formato de archivo abierto, Sketch 43, ha supuesto un verdadero cambio. (Puede obtener más información sobre esto en esta guía).
“Digamos que, si todavía estás usando Photoshop para el diseño de la interfaz de usuario, probablemente necesites echar un vistazo a tu alrededor”, dice Bruno La Versa. “2017 ha sido el año de las nuevas herramientas de diseño: Figma, Webflow, InVision Studio, por nombrar algunas. La explosión de herramientas de diseño pone de relieve cómo el diseño se está convirtiendo en un elemento central del funcionamiento de las empresas”.
InVision Studio es la última incorporación a la explosión de herramientas de diseño que hemos visto este año.
Bearne, sin embargo, señala que esta tendencia plantea un desafío particular para las agencias. “En 2017, surgió una gran cantidad de herramientas con la esperanza de ser la 'herramienta elegida' para la industria, pero al mismo tiempo, la avalancha de productos se volvió frustrante, ya que todos afirmaban estar a la altura de enormes expectativas.
“Esto ha creado un problema para el trabajo entre agencias, donde los equipos tienen diferentes procesos, ya que cada uno fue probado para descubrir si podía reemplazar a Sketch. El mercado, a su vez, se ha saturado con opciones pero poca orientación sobre cómo crear eficiencias.
“El lanzamiento de InVision Studio, previsto para enero de 2018, será interesante, ya que veremos si puede utilizar su plataforma colaborativa para finalmente estandarizar el proceso de diseño. ¿Qué pasará con Sketch si InVision es tan bueno como parece? ¿Ha llegado finalmente a su fin la lucha de Photoshop por la supervivencia?
Para obtener más información, lea nuestra publicación 30 herramientas de diseño web para acelerar su flujo de trabajo en 2018.
06. Diseño plano 2.0
El diseño plano no es…
