Clientes potenciales visitan cientos de sitios web, por lo que debemos captar su atención. Te traemos una lista de tendencias de diseño web.

Si bien el año 2020 fue un año algo complicado para todos, las tendencias no cesaron. Como sabemos el diseño es algo que no descansa, siempre está en constante evolución. En cuanto a las tendencias digitales y las expectativas del usuario, cambian día a día.

Algunas tendencias quedan obsoletas, mientras otras ganan terreno. Significa que los emprendedores deben seguir las tendencias más recientes para destacar entre la multitud. ¿Pero por qué esto es importante?

¡Fácil! Potenciales clientes digitales visitan cientos de sitios web, por lo tanto estos necesitan captar la atención del consumidor, para que este permanezca en la plataforma por más tiempo. Es por esto que nos hemos dado a la tarea de traerte una lista de tendencias de diseño web, que esperamos ver constantemente durante este año.

Así que deseamos lo disfrutes y te sirva para llevar tu inspiración al máximo nivel.

Aquí te dejamos nuestro top 10 de tendencias en diseño web:

1.- Scrolling Horizontal

La navegación con scroll horizontal no es algo nuevo. De hecho ha estado presente durante mucho tiempo, teniendo sus pros y contras. Este año viene con mucha fuerza y lo podremos encontrar como una manera de mostrar información secundaria y/o en portafolios o galerías digitales.

Para su debido uso debemos tener en cuenta usar pistas vistosas (flechas, textos, etc.) que indiquen que el contenido se mostrará a manera de scroll horizontal. A su vez, no debemos forzar al usuario a navegar completamente de forma horizontal, alterna las formas para que sea más dinámico.

Ten en cuenta que no todo el contenido es apto para mostrarse de esta manera. Opta por elementos visuales tales como las galerías fotográficas, pequeños previews de algún producto, videos o textos pequeños.  

Un buen ejemplo del uso de la navegación por medio del scroll horizontal es el sitio de GUCCI con su colección de marmont.

GG Marmont

En esta navegación puedes apreciar cada pieza de su colección de bolsos como si fuera una galería de arte, teniendo una navegación limpia con una gráfica impecable.

the production factory

2. Visuales 3D

En esta era de pantallas de alta resolución tanto en PC como en dispositivos móviles, el uso de los visuales 3D están a la orden del día y este estilo está para quedarse durante más tiempo. ¿Por qué? Porque estos visuales 3D añaden un toque extra a la experiencia de usuario. Crean una armonía minimalista entre los elementos de diseño y los elementos 3D, y a su vez estos visuales dan un toque más vistoso al sitio web.

Podemos ver estos visuales acompañados de fondos con desenfoque gaussiano de color, animaciones, productos o personajes 3D.

WELLY
Plink

3. Texturas en imagen

Después de mucho tiempo en el que los bloques de color sólido han sido los favoritos, este año vienen las texturas realistas. Estas texturas no solo nos hacen sentir que el diseño tiene un toque especial, sino que también te sacan de la cotidianidad de las zonas planas. Trata de no granular demasiado las fotografías, de lo contrario el usuario podría perder la atención del sitio por enfocarse más en la fotografía que en el mismo sitio.

4. Colores amigables 

Como bien sabemos, con la pandemia cada vez es más común el home office. Por ende pasamos más tiempo en nuestros monitores, terminando con nuestros ojos cansados y/o irritados. Como diseñadores de experiencia de usuarios nos hemos dado a la tarea de tomar en serio esta problemática, tomando en cuenta el uso de colores que sean amigables con nuestros ojos.

Una opción es crear un sitio y/o aplicación con un cambio de esquema de color de blanco a negro, tal y como lo hizo facebook a mediados del año pasado.

Al mismo tiempo este año se plantea el uso de colores que no vayan de extremo a extremo como lo es el blanco y negro. A su vez ganan terreno los tonos verdes, azul pastel, colores cálidos y/o rosas pálidos. Estos no solo son colores menos agresivos con nuestros ojos si no que basándonos en la psicología del color, son tonos que naturalmente nos calman y relajan. Llevando la experiencia de usuario al máximo nivel.

5. Juega con los productos 

En estos años las ecommerce son de los sitios más solicitados debido a la pandemia. Es por eso que debemos mostrar el producto interactuando con el sitio. El producto deberá volverse un elemento de diseño creativo, para así crear una interpretación del mismo y enganche al consumidor. Básicamente el producto debe volverse dinámico.

¡Es tiempo de mezclar lo real con lo digital!

AHK

6. Formularios amigables

Unos de los puntos críticos y un tanto olvidados en el diseño son los formularios de contacto o cuestionarios.

Es por eso que últimamente se puede apreciar que cada vez es más común el uso de cuestionarios interactivos. Es una manera de evitar que el consumidor lea y busque descripciones de producto, y todavía tenga que decidir entre qué producto usar.

Lo que proponen estos cuestionarios interactivos es facilitar la vida al usuario. Otorgar preguntas de opción múltiple enfocadas a la actividad de interacción en productos que los seguidores de esa marca tuvieron, para así recomendar estos productos al cliente que responde su quizz. Estos quizz son más comunes en landing pages.

Un ejemplo súper claro de estos formularios es el quizz de Herbal Essences, en donde te hacen una serie de preguntas para recomendarte el tipo de shampoo ideal para tu cabello. 

Herbal Essence Quizz

7. Elementos flotantes

El uso de elementos flotantes interpuestos por capas no solo dará un ligero aspecto tridimensional al diseño, también hará sentir al usuario que es un sitio con una onda bastante ligera. 

Para que tengan sentido tus elementos flotantes debes tomar en cuenta la luz de los elementos, ya sea que crees fotografía específica para dicho proyecto o retoques las imágenes para que todas tengan el mismo punto de luz. 

De igual manera puedes usar fondos de color con gradiente, siendo el color más claro el que será la luz de tu diseño y todo tenga más sentido. Recuerda poner la sombra en donde va, para evitar que de un diseño bastante cool pase a ser un diseño de baja calidad.

Lions Good News

8. Experiencias Multimedia

Dentro de las tendencias que estaremos viendo este año son las experiencias multimedia. Tener visuales, textos, audio y video en un solo lugar vuelve enriquecedora la experiencia de usuario. Pero siempre debemos tomar en cuenta lo siguiente: no abusar de los recursos multimedia dentro del diseño. Estos pueden volverse en nuestra contra creando distracciones o un sitio bastante abrumador, donde lo primero que pensaremos en hacer es cerrar tan rápido como nos sea posible ese sitio.

Mantén un diseño simple y limpio. Evita que los videos se reproduzcan automáticamente, es mejor darle oportunidad al usuario de reproducir los archivos multimedia cuando ellos lo crean conveniente. Siempre teniendo a la vista los controles de reproducción.

Como podemos apreciar en la web de Bears Ears, tenemos un inicio a manera de pantalla “Hero” donde al momento de entrar se muestran imágenes de la patagonia invitando a reproducir el vídeo que tiene de fondo de una manera gentil. Al mismo tiempo no solo puedes ver su vídeo de forma fija, también lo puedes apreciar a manera de VR, haciendo una experiencia de usuario mucho más completa y atractiva.

Bears Ears

9. Experiencias con realidad aumentada

Desde hace un par de años podemos apreciar la realidad aumentada en diversas redes sociales, con las fotografías interactivas, vídeos, etc. Logrando una experiencia bastante atractiva.

Con esta situación de la pandemia vamos a apreciar más sitios web que usen la realidad aumentada para mostrar sus productos sin necesidad de salir de tu hogar. De esa manera puedes visualizar cómo se verá X sillón en tu sala, de qué color pintar tu pared antes de hacer la decisión de compra, aprender cosas nuevas o incluso hasta comprar un coche.

Un ejemplo bastante bueno sobre la experiencia de usuario y su interacción con la realidad aumentada es este ejemplo de Learn Calligraphy, en donde aprendes caligrafía por medio de la realidad aumentada.

Learn Calligraphy

10. Scrollytelling

El scroll es el punto máximo dentro de la navegación que tiene el usuario en tu web. Porque por medio del scroll se obtiene una interacción constante y si a esta interacción le agregamos una respuesta a la pantalla, el usuario se verá más interesado en seguir navegando en la web.

Con el scroll podemos contar historias por medio de animaciones, cambios de color, cambios de página, etc.

El sitio web de sgrappa nos muestra una navegación de interacción usando el scroll, en la que parece que te adentras al sitio web. Tiene un diseño bastante bueno con elementos flotantes, juega con sus productos y elementos temáticos de la marca, así como animaciones y efectos que te hacen realmente seguir conociendo la web.

sgrappa

Estas son algunas de las tendencias en diseño web que estaremos presenciando este año. Muchas son bastantes novedosas, muchas otras se adaptan a la situación que estamos viviendo para lograr que las experiencias de usuario sean lo más cómodas y placenteras posibles.

Muchas gracias por leernos y esperamos lo hayas disfrutado.