Tendencias UI que darán forma a 2019

Permítame preguntarle algo que podría sonar un poco como ciencia ficción. ¿Alguna vez se te ha ocurrido que tal vez el planeta Tierra se ha estado moviendo un poco más rápido últimamente, pero aún no lo hemos notado? Parece que fue ayer que revisamos lo que esperábamos cuando nos mudamos a 2018. ¡Pero extrañamente, ya es casi 2019!

Ahora que lo pienso, 2018 ha sido un año increíble para el diseño de UI. Ahora las cosas son mucho más simples en comparación con años anteriores, gracias a las herramientas de diseño de crecimiento exponencial que hemos experimentado en los últimos tiempos. Ni siquiera tiene que ser un gurú de la codificación para crear un sitio de aspecto profesional con una excelente interfaz de usuario en solo unos minutos.

Y eso apenas cubre la base. Los cambios en las preferencias de los usuarios también han impactado ampliamente en el diseño de interfaces en 2018.

Para ponerlo en perspectiva, 94% de los internautas dejó de confiar en los sitios con un diseño deficiente, por lo que simplemente ya no hay lugar para compromisos.

Entonces, como el desplazamiento ahora es ampliamente aceptado, los sitios ya no están priorizando la colocación de las mejores cosas en la parte superior. Puedes difundirlos proporcionalmente dentro de la interfaz. Pero, de nuevo, hemos aprendido a ser extremadamente cuidadosos con eso considerando 40% de los visitantes. se irá si el diseño general está en mal estado.

Y eso no es todo lo que odian. Los usuarios también se han cansado de los controles deslizantes de contenido solo 1% hará clic en ellos. Curiosamente, mitigar que al eliminar el contenido también sería un movimiento incorrecto ya que 86% de visitantes del sitio desee ver información crítica sobre productos y servicios tan pronto como aparezca en la página de inicio.

Fascinante, ¿verdad?

Entonces, seamos honestos, el diseño de UI nunca ha sido tan emocionante. Los usuarios se están transformando, la tecnología del dispositivo se está desarrollando astronómicamente, la velocidad de Internet ahora está en el nivel de Fórmula 1 y estamos respaldados por una amplia gama de herramientas de diseño en la web. Combine todo eso con las habilidades modernas del diseñador de UI, y sin duda estará de acuerdo en que 2019 está destinado a ser aún más impactante.

Entonces, ¿qué tendencias estamos esperando?

Mobile First

La optimización móvil es una palabra de moda que aparentemente no se retira pronto. La tendencia ha existido desde hace un par de años, por decir lo menos. Y tendría razón al predecir que veremos una mayor adopción de diseños de UI basados ​​en dispositivos móviles en 2019.

También puede suponer que, aparte de la tecnología correspondiente, no hay nada nuevo que pueda surgir en este espacio, al menos durante los próximos meses de 12. Justo lo suficiente, pero consigue esto ...

Verá, desde hace bastante tiempo, hemos estado utilizando el mismo enfoque anterior: diseñar para PC primero, antes de cambiar a móvil. Retrospectivamente, la IU de escritorio fue el foco principal porque la mayor parte del tráfico provino de usuarios de PC.

Luego, algo interesante ocurrió al final del tráfico móvil con 2016, en última instancia, superó el tráfico de PC. A finales de ese año, los teléfonos móviles habían golpeado 50.31% de la cuota de mercado., mientras que las tabletas suman hasta 4.9%.

cuota de mercado móvil

Sin embargo, a pesar de eso, seguimos dando prioridad en la interfaz del escritorio porque sucedió que los usuarios de PC mantuvieron el liderazgo en la cantidad acumulada de tiempo en línea. En América del Norte, por ejemplo, la navegación por teléfono móvil todavía se estaba quedando atrás en 2017, lo que representa 33% del tiempo de navegación..

tiempo de surf

Bueno, ahora que lo pienso, todos sabíamos que era solo el momento antes de que el móvil finalmente se pusiera al día con las PC en esto también. Y por 2018, las mesas habían cambiado completamente, con el uso de dispositivos móviles. 52.2% de todas las páginas web globales.

cuota de tráfico

¿Qué significa esto para la interfaz de usuario?

Para empezar, esperamos un cambio en el enfoque de diseño de interfaz de usuario. Los desarrolladores comenzarán a cambiar sus prioridades al centrarse en la interfaz de usuario móvil antes de diseñar para PC. Los usuarios móviles tendrán prioridad sobre los usuarios de PC.

Uso de las sombras y la profundidad.

No se puede negar que los diseños de UI planas tienen sus beneficios. Pero seamos sinceros. Ahora se han vuelto demasiado monótonos y, ciertamente, bastante aburridos.

Desafortunadamente, el uso de diseños 3D fue un desafío debido a los incómodos gráficos resultantes. La carga de una página web con una interfaz 3D, por ejemplo, generalmente lleva más tiempo que una con un diseño plano.

Bueno, hasta que los navegadores web comenzaron a mejorar sustancialmente. Y los diseñadores, por otro lado, desarrollaron una técnica excepcional de aprovechar las sombras para introducir la ilusión de profundidad.

sombras y profundidad

Por lo tanto, en 2019, esperamos ver un uso progresivo de las variaciones de sombra para lograr diferentes perspectivas de la interfaz 3D.

Por ejemplo, los diseñadores que buscan llamar la atención sobre elementos específicos pueden crear sombras falsas con diversos grados de suavidad e intensidad. El resultado final es un elemento que puede parecer que se desplaza sobre el resto en 3D.

Otra técnica popular es colocar sombras en patrones para crear varios niveles de texturas y, posteriormente, dar vida a los elementos de la interfaz.

Entonces adivina qué? Los recientes avances en las herramientas de diseño de UI han ampliado aún más las dinámicas que vienen con estos enfoques de diseño. Ahora puede combinar fácilmente sombras con cuadrículas y diseños de paralaje para extender sistemáticamente la profundidad correspondiente y, en consecuencia, lograr ilusiones 3D más realistas.

En otras palabras, el uso avanzado de las sombras continuará logrando una profundidad más refinada en la pantalla 2D. Y al hacerlo, elimine la necesidad de pantallas 3D especiales.

minimalismo

En el año 2000, la capacidad media de atención humana, al menos según un estudio realizado por microsoft, fue 12 segundos. Entonces adivina qué? Por 2015, sorprendentemente cayó a 8 segundos, sorprendentemente más corto que un pez de colores estándar.

Bueno, justo cuando pensamos que no podría empeorar, Internet hizo que la gente se volviera más impaciente. 47% de los visitantes de su sitio ahora espere que sus páginas se carguen en menos de 2 segundos. Simplemente no pueden soportar esperar más tiempo. De hecho, 40% de ellos se irá si se demoran más que 3 segundos.

Sorprendentemente, muchos diseñadores web no han tomado esto en serio. La corriente La velocidad promedio de carga de la página es 8.66 segundos.- a pesar de la recomendación de Google de menos de 3 segundos para 2018.

tiempos de carga de la página

Y eso no es todo. Resulta que la situación es considerablemente peor para los sitios móviles, ya que toman una promedio de 22 segundos cargar. Sin embargo, lamentablemente, 53% de los visitantes de páginas móviles no se quedan por más de tres segundos.

Pero, ¿cómo se relaciona esto con la interfaz de usuario?

Si bien las velocidades de carga de las páginas suelen estar determinadas por varios factores, el diseño general de la interfaz de usuario es especialmente crítico. Ahí es donde comienza la reacción en cadena.

Entonces, ¿qué significa esto para 2019?

Bueno, Actualización de velocidad de Google en julio, 2018 fue el principio del fin de las complejas IU de gráficos que comprometen sustancialmente las velocidades de carga. Ahora estamos cambiando cada vez más hacia UIs minimalistas y bien optimizadas que se cargan mucho más rápido.

En esencia, el minimalismo implica lograr un equilibrio ideal entre simplicidad, conveniencia y funcionalidad. Esto no solo mejora la velocidad general y el ranking del motor de búsqueda, sino que también reduce la tasa de rebote del tráfico correspondiente.

Efectos superpuestos

La era moderna del diseño gráfico introdujo efectos superpuestos para combinar múltiples capas, crear una sensación de espacio y, lo que es más importante, hacer que las interfaces sean más cautivadoras.

Pero espera. ¿Qué es un efecto de superposición en primer lugar?

En general, esto implica colocar elementos como imágenes, texto y colores para que se superpongan con estilo. Apuesto a que ya te has encontrado con gráficos superpuestos en varios sitios web a estas alturas.

efectos superpuestos

Bueno, hay que admitir que la tendencia de diseño se ha ido recuperando considerablemente en los últimos años. Pero, como ahora los dispositivos modernos vienen con una reproducción de gradiente de color mucho mejor, se espera que 2019 provoque una adopción extensa de los efectos superpuestos en las UI de PC y móviles.

Samsung Mobile, por ejemplo, cambió de pantallas LCD a tecnología OLED muy avanzada Cuando lanzaron el Galaxy S7 hace dos años. Luego Apple se unió al carro con el iPhone X, que ahora tiene un mayor contraste de pantalla que sus predecesores LCD. La empresa incluso tiene planes de mantener esto en todos los modelos de iPhone programados para 2019.

¿Y quién se beneficia más?

Como era de esperar, el mundo del diseño gráfico está aprovechando en gran medida esto para crear superposiciones con gradientes más nítidos y nítidos que parecen más naturales. Nos encanta cómo las pantallas OLED han mitigado sustancialmente el problema más grande con elementos superpuestos: los usuarios se distraen con los elementos secundarios subyacentes debido al mal contraste.

Esta tendencia también desencadenará el desarrollo de la transparencia en los diseños de UI. Veremos un mayor uso de texturas "de vidrio" en las interfaces de usuario, ya que los diseñadores capitalizan la transparencia para mostrar simultáneamente los gráficos primarios y secundarios, sin interferir necesariamente con el énfasis deseado.

Diseños sin marco

Y aún en los dispositivos modernos, ciertamente ha notado lo más sobresaliente de su diseño exterior general en la actualidad. No, no estoy hablando de cómo están usando demasiado el vidrio en casi todas las superficies.

Ok, admito que podría tener algo que ver con eso. Por alguna extraña razón, todos parecen odiar los marcos de visualización. Los principales fabricantes de pantallas de teléfonos inteligentes y televisores están reduciendo gradualmente el espacio entre el contorno de la pantalla y los bordes correspondientes de sus dispositivos. Luego, para completar el diseño, eligen combinarlo con los bordes redondeados del dispositivo.

Samsung incluso ha seguido adelante para eliminar los marcos de borde al extender algunas de las pantallas de sus teléfonos inteligentes más allá de los bordes. Apple, por otro lado, ha decidido cubrir toda la cara del iPhone con la pantalla, dejando solo espacio para el auricular.

borde sin marco

Pensándolo bien, creo que tiene todo que ver con la ilusión infinita, la necesidad de hacer que la pantalla parezca una parte del entorno natural. Y, para ser honesto, está funcionando bastante bien para los usuarios, que según los informes, encuentran que las pantallas son más envolventes.

Tal vez, como era de esperar, esta tendencia se ha extendido a la industria de las aplicaciones. Las interfaces de usuario cambian progresivamente de contornos enmarcados a líneas suaves combinadas con bordes redondeados. En consecuencia, esto ha ayudado a las interfaces a integrarse sin problemas con las pantallas del dispositivo y, posteriormente, a crear una perspectiva sin marco a pantalla completa.

A medida que los fabricantes de dispositivos continúan con esta tendencia en 2019, esperamos que las interfaces de usuario bajen progresivamente los bordes afilados de la generación anterior para lograr diseños suaves, redondos y sin marcos.

Micro-animaciones

Son sutiles y pueden parecer insignificantes a veces. Pero, la verdad es que las micro-animaciones en las interfaces de usuario han demostrado ser extremadamente poderosas para atraer y ayudar a los usuarios mientras navegan.

¿Has visto esos botones que cambian de color cuando te desplazas o haces clic en ellos? Definitivamente, también ha encontrado diseños de menú que se abren para mostrar opciones adicionales tan pronto como el puntero cae sobre ellos. Bueno, todos son ejemplos de micro-animaciones que crean pequeños efectos visuales para enriquecer la experiencia del usuario.

micro-animaciones

Dado que los elementos en movimiento son particularmente efectivos para captar la atención, muchos diseñadores ya los están aprovechando para llevar a los usuarios hacia varios puntos de conversión. Esta tendencia es tan frecuente ahora que estaría dispuesto a apostar una fortuna por lo que no puede encontrar más de cinco sitios que aún no han implementado alguna forma de micro-animaciones.

Entonces consigue esto. Todos los navegadores web dominantes actualmente soportan micro-animaciones satisfactoriamente tanto en PC como en móvil. Así que diría que la tendencia está aquí para permanecer a medida que nos acercamos a 2019: esperamos que las IU vengan con jerarquías visuales estructuradas sistemáticamente.

Conclusión

En general, solo hemos cubierto algunas de las tendencias más notables. Estamos obligados a ver más cosas emocionantes a medida que pasa el tiempo, y no podemos esperar a que 2019 ponga la bola en marcha.

Dicho esto, ¿qué crees que podría ser la tendencia de diseño de interfaz de usuario más impactante? ¿Y qué otras tendencias notables agregarías a esta lista?

imagen del encabezado cortesía de Walid Beno

Bogdan Rancea

Bogdan es miembro fundador de Inspired Mag, habiendo acumulado casi 6 años de experiencia durante este período. En su tiempo libre le gusta estudiar música clásica y explorar artes visuales. También está bastante obsesionado con los fixies. Ya es dueño de 5.