Trends de diseño de Interfaz de Usuario 2017

Maryl González
TechWo
Published in
8 min readJun 13, 2017

(UI Trends)

Nacidas de la experimentación y la innovación, las tendencias son los factores impulsores del cambio y que en conjunto con la tecnología pueden generar cambios significativos en los comportamientos y costumbres de toda una generación. Es bastante común entre los diseñadores creer que seguir las tendencias es una parte crucial de su trabajo, tanto así que estar constantemente al día se considera obligatorio.

Como Product Designer, es mi trabajo seguir y monitorear estas tendencias para adaptarlas a un lenguaje actual hacia mis clientes y usuarios finales.

Muchos diseñadores evalúan el trabajo de otros a través de un prisma de tendencias: etiquetar algo como “Viejo” puede ser visto como un insulto, como si no encajar con el estilo más reciente le restara valor a sus proyectos.

Visitar sitios de inspiración como Awwwards, FWA, CSSDSGN o Dribbble para inspirarte, te ayudará a aventurarte fuera de tus hábitos de diseño. Ver el trabajo de otros te puede ayudar a seguir mejorando tus habilidades y al mismo tiempo te mantienes fresco cuando se trata de las últimas tecnologías.

Últimamente se ha hecho notar que muchos diseñadores están tratando de alejarse de composiciones simples y cerradas. Se están creando más y más composiciones abiertas, aparentemente caóticas y cortadas. El contenido comenzó a ser desplazado, movido, sus partes a veces se superponen y se entremezclan; lo cual nos lleva a perder totalmente el famoso dicho “el contenido es el rey”, cuando hoy en día es más sabido que UX es el rey.

La experimentación se ha convertido en un factor importante para la innovación dentro de cualquier terreno y siempre ha estado presente en lo creativo. Como ejemplo, Pablo Picasso rompía las reglas previamente preestablecidas en sus obras; permitiéndole crear nuevos métodos a través de la experimentación continua.

Pablo Picasso haciendo pintado con luz, rompiendo las reglas básicas de la fotografía.

Los diseñadores buscan hacer más impacto en la experiencia y sentimientos que su diseño puede evocar y junto con un equipo de respaldo, se tiene como meta crear y lograr esto en conjunto.

La interfaz de usuario está cambiando y evolucionando constantemente y con eso en mente, traigo una lista de 5 tendencias que considero que son las más importantes a monitorear en los próximos meses:

1. Adiós a las imágenes de Stock, bienvenida sea la imagen personalizada

La fotografía de stock reduce la confianza y a menudo es completamente ignorada, ya que el usuario puede detectar a veces con facilidad cuando se trata de imágenes que no representan realmente a sus empleados o a las personas a las que van dirigidos sus productos, en consecuencia esto es malo para el diseño e incluso peor para los negocios. Con tantos sitios de fotografía auténtica en línea como Unsplash, encontrar imágenes de gran calidad se convierte en una tarea sencilla y gracias a ello veremos la disminución de la fotografía de stock plano y aburrido al que nos tienen acostumbrados.

Invertir en una sesión fotográfica para tu cliente, ayudará a darle un gran sentido de pertenencia a su marca y le entregará un producto más real, logrando generar confianza entre sus clientes finales.

https://unsplash.com/

La iconografía personalizada también forma parte importante de la identidad de una interfaz, es común ver en un gran número de interfaces el uso de librerías como Font Awesome, que aunque si bien nos permiten hacer un buen uso de su iconografía, termina siendo bastante común hasta llegar al punto de ser aburrida. Dedicar un tiempo extra del proyecto a diseñar tu propia iconografía, puede causar un gran impacto entre los usuarios de tu interfaz y puede darle un sentido único al mensaje que quieres enviar de una manera única y original.

Uso de iconografía personalizada.

2. Diseño de tarjetas y diseño en base a retículas (Card design & Grid design)

Este tipo de diseño se empezó a popularizar gracias a sitios como Pinterest y actualmente se puede encontrar en uso en muchos sitios que muestran contenido como noticias, eCommerce y portafolios multimedia. Estos trends continúan configurando e influenciando las tendencias de diseño web y mobile y seguramente veremos más este estilo de cuadrícula dinámica en 2018. Lo que hace que las tarjetas sean tan atractivas es la sencillez, organización, flexibilidad y capacidad de respuesta que crean. Los diseños de cuadrícula son particularmente adecuados para páginas con abundancia de datos, ya que hacen que la información sea más accesible y atractiva.

Google hace un gran uso de las tarjetas en su lenguaje de diseño Material Design.

Google Grid (Material Design)

3. Bots de Inteligencia Artificial (AI) e interfaces conversacionales

Actualmente en términos visuales, es improbable que los bots tengan un gran impacto en el diseño, pero influirán significativamente en cómo los diseñadores piensan a la hora de crear su interfaz. Los bots de AI se van a poner aún más realistas y complejos este año, dando poder a las empresas para automatizar la comunicación con sus clientes finales. Utilizando herramientas como Letsclap, las empresas en línea pueden conectarse con sus clientes a través de aplicaciones de mensajería como WhatsApp, Facebook Messenger o WeChat, proporcionando asistencia personalizada al cliente y comercio. Las interfaces de conversación serán un gran cambio, ayudando a las grandes marcas a expresar diferentes aspectos de su personalidad y haciéndolos más humanos y accesibles.

Cualquier marca puede construir un bot de Facebook ahora sin ningún conocimiento previo de programación. Las integraciones con herramientas como Botsify o Chatfuel hacen que el proceso de configuración sea tan simple que es cada vez más inusual no usar un bot personalizado. Este año, veremos que las interfaces convencionales alcanzarán un nivel más alto de personalización e inventiva.

https://chatfuel.com/

4. Composiciones tipográficas originales con pesos y tamaños dinámicos

Este trend es uno de mis favoritos, ya que utilizando de manera creativa la tipografía podemos hacer bellas composiciones de texto + imagen.

La tipografía es también un poderoso medio visual, capaz de crear personalidad, evocar emociones y establecer tonos. A medida que las resoluciones del dispositivo se vuelven más nítidas y el tipo de letra se vuelve más fácil de leer en la pantalla, como marca se busca empujar aún más los límites de la tipografía para atraer a sus usuarios.

http://www.nurturedigital.com/

Nuture Digital hace un gran uso de la tipografía, usando letras de gran tamaño como una máscara para el contenido de video de fondo que toma el centro del escenario. Los encabezados entrelazados sin serifas y con serifas también ayudan a crear paralelos dinámicos, añadiendo aún más a la experiencia.

5. Realidad Virtual (VR) y videos en 360º

Uno de los trends que se ha visto más en uso desde mediados de 2016, es la incorporación de realidad virtual y videos en 360º no solo en campañas exitosas de Marketing (como Netflix con Stranger Things) sino también en Web.

Un gran ejemplo de cómo el VR y 360º puede ser incorporado en diseño de UI para crear una impresionante experiencia interactiva es la campaña promocional de Peugeot 208 que utiliza ambas tecnologías para mostrar un nuevo producto.

https://thefwa.com/cases/peugeot-catch-the-dragon

¿Qué trends perduran?

Los siguientes trends son los que seguramente veremos vigentes en lo que resta del año y posiblemente para el año 2018.

  • Diseño Web Responsivo: El diseño responsivo nos permite llegar a más dispositivos y con ello a más usuarios. El diseñador y autor norteamericano Ethan Marcotte creó y difundió esta técnica a partir de una serie de artículos en A List Apart, una publicación en línea especializada en diseño y desarrollo web, idea que luego extendería en su libro Responsive Web Design.
  • Degradados: Los degradados ayudan a connotar una sección deseada en nuestro sitio Web, haciendo más sencillo el acompañamiento de imagen + texto.
  • Menos es más: El uso del minimalismo en las composiciones nos ayuda a ser más directos a la hora de comunicar y aunque parezca ser sencillo, el uso del minimalismo en nuestras composiciones puede ser la tarea más ardua a la hora de diseñar una interfaz, pero de ser bien logrado puede ayudar a crear un impacto significativo en lo que deseamos comunicar a nuestros usuarios.
Uso del minimalismo en un eCommerce.
  • Flat + Material Design: El lenguaje de diseño de Material Design es bastante completo y cuenta con una gran documentación para todo aquello que se quiera adentrar en su diseño. Siendo un lenguaje modular que nos permite su uso en cualquier dispositivo, nos puede traer grandes ventajas a la hora de usarlo en nuestros diseños.
  • Duotono y doble exposición como efectos en las fotografías: Esta tendencia se ve mucho en uso en una gran cantidad de sitios y aplicaciones y sirve también como un buen complemento entre imagen + texto.
Spotify en un gran ejemplo del uso de degradados y duotono en sus composiciones.

¿Qué trends se van?

Estos trends han demostrado ser de gran valor en su tiempo, pero como todo trend se han vuelto algo pasajero; impactando incluso de manera negativa las estadísticas de visitas y tiempo en que un usuario usa nuestro producto digital.

  • Parallax
  • Sliders
  • Scroll infinito
  • Popups con publicidad
  • Videos y música en autoplay

El usuario tiene una gran demanda por interfaces bien diseñadas y pensadas especialmente para el mismo y aunque un producto bien programado es esencial, el impacto que puedes lograr con un diseño de interfaz bien cimentado en previa investigación (UX) puede ser un gran catalizador para su éxito.

Lo cuál, nos deja con la siguiente frase:

“You don’t get a second chance to make a great first impression.

Be impressive, be be impressive!! 😎

--

--

Maryl González
TechWo
Writer for

Co-Founder @ The App Chefs | SCRUM Master Certified | Design Thinking Evangelist | Digital Nomad in Progress | Blockchain Believer | Truth seeker #WomenInTech