Tips para diseñar un buen Slider pensando en UX

Tips para diseñar un buen Slider pensando en UX

Los carruseles de imágenes ocupan espacios únicos de alto impacto dentro de un sitio. Esto se debe a que se llega al usuario con varios mensajes o contenido único, reemplazando a una imagen estática. 👀 Pero esto no te asegura que el usuario verá todas las imágenes del carrusel por lo que deberás tener en cuenta los tips que te dejamos en este artículo para mejorar el alcance de tu publicación.

Los tips más importantes que te mencionamos a continuación, son claves y se basan en mantener principalmente la buena experiencia de usuario y el diseño de interacción.

  1. Incluir máximo 5 slides dentro del carrusel

Esto es para no aumentar la carga cognitiva y cansar al usuario. Debemos pensar en no perder su atención, ya que utilizar demasiados pases de diapositivas lo dispensará, no lo recordará y no se logrará comunicar el mensaje. 

Si utilizas más de 5 pases, te recomendamos que midas sus resultados para controlar su efectividad. Esto lo puedes realizar midiendo la cantidad de impresiones y clics que recibe cada slide teniendo en cuenta la posición que ocupan en el carrusel.

  1. Utiliza marcadores de posición

Utilizar los marcadores de posición del carrusel ayuda al usuario a estar en control y tener referencia de la dimensión de la publicación, cuantos slides existen y en cual se encuentra.

Pueden tener diferentes diseños, desde los clásicos puntos debajo del carrusel, hasta botones con texto que ayudan a contextualizar el contenido de cada pase. También puedes incluir botones con texto, ayudan a que los usuarios conozcan el contenido de cada slide sin necesidad de visualizar o tener que pasar por todos los anteriores.

  1. Incluir controles de navegación dentro del carrusel

En estos controles de navegación, el diseño que se utiliza por lo general son los botones con un icono de flecha en su interior. Este tipo de control te recomendamos que aparezcan dentro del carrusel, así evitas problemas con pantallas muy pequeñas o muy grandes. 

Si lo colocas por debajo, fuera o separados por un pliegue, luego será muy difícil intentar encajarlos en el ancho de muchos dispositivos. Los botones deben ser suficientemente grandes y proporcionados para que no generen una mala experiencia del usuario en cualquier dispositivo.

  1. Priorizar los elementos del carrusel y conceder un acceso secuencial

Te recomendamos priorizar los pases o diapositivas del carrusel. De esta manera las diapositivas más interesantes deben mostrarse primero. Es importante que los usuarios puedan llegar al último elemento del carrusel o diapositiva tras tocar, deslizar o clicar 3 ó 4 veces. 

Aquí se ve la importancia de medir los resultados y tener un sistema de seguimiento asociado a la navegación del usuario, con estos datos podrás modificar la posición de cada slide en función de los intereses mostrados por los usuarios, su lista de deseos, su última búsqueda, etc.

  1. Proporcionar la ilusión de continuidad

A veces se puede dar el caso de que un usuario con cierta prisa no perciba un carrusel. Este tipo de casos se acentúa en dispositivos móviles.

Muchas veces el usuario no percibe que está en un componente distinto de la interfaz, debido a la prisa o el dispositivo, por lo que es importante dar señales al usuario como elementos que generen la ilusión de continuidad y que hay más contenido horizontalmente.

🤳Las señales pueden ser: 

  • Los puntos o líneas como marcadores de posición, estos son los menos eficaces ya que suelen ser pequeños y no son tan visibles.
  • Las flechas como elementos de navegación, su visibilidad depende del contraste de lo que tiene debajo por lo que si se utiliza se deberá controlar esto.
  • Mostrar parte de la siguiente diapositiva o producto, es la más eficaz para que el usuario comprenda que es un carrusel.
  1. Incluir el deslizamiento.

Es importante incluir esta interacción para que el usuario avance en el carrusel ellos ya están familiarizados con este gesto para la navegación horizontal.

Si el usuario quiere interactuar con el carrusel en una pantalla táctil deslizará el dedo. No incluirlo sería un comportamiento inesperado y generaría una mala experiencia para el usuario.

👉 “Lo que debes tener en cuenta es que tu carrusel aporte contenido de valor a tu usuario”.

Regresar al blog