[Buenas prácticas UX en eCommerce] 11 principios científicos para mejorar la experiencia de usuario de tu tienda online

Tu eCommerce va bien, no te puedes quejar… pero la tasa de conversión está estancada.

Por mucho que te empeñas en mejorar tu estrategia de ventas, sigue habiendo un porcentaje alto de visitas que llegan a tu web y se van enseguida, sin comprar.

Y has leído por ahí que la clave podría estar en la experiencia de usuario. Es decir, en lograr que las personas que visitan tu tienda se sientan cómodos navegando por ella.

Pues estás tras la pista correcta, porque la experiencia de usuario es un factor clave de conversión.

Si la de tu tienda es buena, eso se traduce en:

• Mejor posicionamiento SEO: el usuario pasa más tiempo navegando por tu página e interactuando con ella. Para Google, esto es señal de que el contenido de la página responde a la necesidad del usuario y la posiciona mejor.
• Mayor conversión: un usuario que navega con comodidad por tu tienda es mucho más probable que acabe comprando.

Eso son dos razones de peso para enfocarte en mejorar la experiencia de usuario en tu eCommerce. La siguiente pregunta es “cómo hacerlo”.

Y eso es lo que vas a ver aquí.

En este post vamos a presentarte varias buenas prácticas que se ha demostrado que mejoran la experiencia de usuario online, todas ellas basadas en estudios y principios científicos demostrados.

Ponte la bata de laboratorio, que empezamos. 😉

Nota: algunas de estas prácticas son bastante avanzadas, así que si aún no tienes claro qué es la experiencia de usuario o nunca la has trabajado en tu web, te recomendamos que primero te leas este otro post donde te explicamos lo básico. Después de leerlo ya estarás listo para retomar este post y profundizar más aún.

👉 11 buenas prácticas de experiencia de usuario (UX) en eCommerce que aumentarán tus ventas

Para simplificar la explicación, las hemos dividido en 3 grupos en función del “área” de tu web a la que afectan:

• Diseño.
• Navegabilidad y usabilidad.
• Proceso de compra.

Dicho esto, veamos cómo optimizar esa experiencia de usuario para llevar tu tienda al siguiente nivel.

✅ Las mejores prácticas de diseño

Imagínate que entras en una tienda y te encuentras con que las estanterías están desordenadas y que la decoración es un horror.

Lo más probable es que te des la vuelta y te marches, ¿verdad?

Pues lo mismo ocurre con el diseño de tu tienda online. Si lo descuidas, los usuarios se llevarán una primera impresión tan negativa que es probable que se vayan para no volver.

Para que el diseño contribuya a mejorar la experiencia de usuario, aquí tienes algunos principios que deberías aplicar.

➡️ 1. Menos es más (el principio KISS)

El origen de este principio se le atribuye a un ingeniero jefe de la Marina de los Estados Unidos.

KISS son las siglas de “Keep It Simple, Stupid” (literalmente: “Mantelo simple, estúpido“).

Y, aunque suene un poco brusco, el mensaje central que transmite es este: olvídate de los diseños rebuscados y ve a lo sencillo.

Porque se ha comprobado que, en la mayoría de los casos, un diseño simple resulta mucho más efectivo.

¿Cómo puedes llevar este principio a la práctica en tu eCommerce?

• “Economiza” los colores: utiliza 2 o 3 tonos sencillos que combinen bien entre ellos, en lugar de saturar tu página con colores.
• Que sea claro e intuitivo: nada más entrar a la web, el usuario debería ser capaz de identificar los elementos más importantes (el menú, la caja de búsqueda, los productos destacados, etc.).
• Ojo con el exceso de CTAs: las CTAs o llamadas a la acción son esos enlaces o botones que incitan al usuario a realizar una acción concreta. Por ejemplo, meter un producto en el carrito. Asegúrate de que tanto en la homepage como en las fichas no haya demasiadas llamadas a la acción (por encima de 3 es probable que el usuario se sature y al final no haga clic en ninguna).

Pero es que el principio KISS se puede aplicar incluso al proceso de compra.

Por ejemplo, simplificando el checkout para agilizar la compra y reducir los carritos abandonados (sobre esto te daremos algunos consejos más adelante en este post).

➡️ 2. El tamaño y la posición de la CTA importan (la Ley de Fitts)

En este caso fue un psicólogo, Paul Fitts, el que enunció esta ley. Según se dice, se basó en sus experiencias en las Fuerzas Aéreas de los Estados Unidos para desarrollarla.

Lo que demostró es que mientras más lejos esté un objeto y más pequeño sea, más difícil nos resulta localizarlo.

Y aunque ahora mismo te suene algo abstracto, esta ley nos la podemos llevar al terreno del diseño. En concreto, al del diseño de las CTAs.

¿Cómo? Pues haciendo llamadas a la acción que:

• Destacan frente al resto de elementos: por ejemplo, si la CTA tiene forma de botón, puedes ponerle un color que contraste con el fondo de la página.
• Cuanto más cerca del above the fold, mejor: el above the fold es la parte superior de una página y lo primero que el usuario ve nada más aterrizar en ella, sin hacer scroll. Si nos ceñimos a la ley de Fitts, cuanto más cerca esté la CTA de esta parte (cuanto más arriba en la página) más probable es que el usuario la clique.
• Con apariencia “clicable”: es decir que tenga aspecto de botón o, en el caso de un enlace, que esté subrayado. La idea es que, en cuanto la vea, el usuario detecte que se trata de un elemento sobre el que puede hacer clic.
• Dale aire: el botón destacará mucho más si dejas un espacio vacío alrededor.

Como ejemplo, aquí tienes un botón de “Añadir al carrito” que cumple todos los requisitos que te acabamos de explicar.

➡️ 3. Una buena apariencia genera más confianza (la Ley de la estética)

Imagina que te plantan delante dos trozos de tarta:

• El primero está mal montado, cortado de cualquier manera y con restos de nata desperdigados por todo el bizcocho.
• En cambio, el segundo está muy bien decorado, tiene trozos de fruta por encima y una presentación digna de un restaurante de lujo.

¿Cuál de las dos crees que estará más rica?

Lo más probable es que pienses en la segunda. Y eso que, en realidad, el sabor no tiene nada que ver con la apariencia (la tarta mejor decorada podría tener demasiado azúcar y ser muy empalagosa, por ejemplo). Pero nuestro cerebro funciona de esta manera.

Este fenómeno se conoce como Ley de la estética.

Según esta ley, si algo tiene buen aspecto, le asociamos características positivas de manera inconsciente.

Esto, traducido al mundo del eCommerce, significa que si el diseño de tu tienda es atractivo, los usuarios confiarán más en ti, sentirán que les vas a ofrecer un servicio mejor y que tus productos son de mayor calidad.

Para eso es importante que:

• Tu web tenga un aspecto profesional (de ahí que sea tan importante invertir en una buena plantilla).
• Uses colores corporativos armoniosos.
• En la homepage, incluyas fotos grandes y de alta resolución de tus productos.
• Etc.

Para que te hagas una idea, fíjate en la homepage del eCommerce Bliss, cuyo diseño es muy elegante e inspira confianza.

A nivel más específico, podemos aplicar esta ley también en las fichas de producto.

Para ello:

• Utiliza fotos y vídeos profesionales: imágenes de buena calidad que permitan al cliente hacerse una idea de cómo es y/o cómo funciona tu producto.
• Usa imágenes con modelos: está demostrado que las fotos donde aparece una persona llevando el artículo convierten más que aquellas en las que se ve solo el mismo artículo sobre un fondo neutro.
• Da el salto a las fotos 360º: algunas tiendas están empezando a implementar esta tecnología para mostrar sus productos literalmente desde todos los ángulos y así generar aún más confianza.

Aquí tienes un ejemplo del mismo eCommerce anterior.

En este caso, también han optado por incluir vídeos de sus productos dentro de cada ficha. Y, como ves, el resultado es bastante vistoso.

Si quieres saber más de cómo las imágenes y los vídeos aumentan la conversión en las fichas de producto puedes pasarte por el post que tenemos sobre este tema.

Nota: ojo, no confundas el KISS con el principio de estética. En el caso del KISS te hablábamos de implementar un diseño sencillo, mientras que en el principio de la estética nos centramos en que el diseño sea atractivo y usable.

➡️ 4. El cerebro rellena los elementos incompletos (la Ley de continuidad) 

La Ley de la continuidad es una de las 13 leyes de Gestalt, que nos explica (desde la psicología) cómo percibimos las cosas en función de los estímulos que recibimos.

Según la Ley de la continuidad, si vemos un elemento que está cortado o a medias, nuestro cerebro tiende a completar la información que falta.

Ahora quizás te estés preguntando: “¿Y esto qué tiene que ver con mi eCommerce?“

Pues puedes aprovechar esta particularidad de la mente introduciendo ciertos elementos “incompletos” para dar a entender al usuario que continúan.

Aplícalo, por ejemplo, en los carruseles de productos o de categorías. Puedes dejar la última imagen “medio escondida” o fuera del marco, tal y como te mostramos en este ejemplo de Ikea.

Con algo tan sencillo como esto, incitas al usuario a hacer clic para ver todas las categorías que hay en el carrusel.

✅ Buenas prácticas de navegabilidad y usabilidad

Antes de nada, vamos a dejar claros los conceptos básicos:

• La navegabilidad web es la facilidad con la que el usuario se mueve dentro de una página.
• La usabilidad web es la facilidad con la que un usuario puede interactuar con los elementos de una web (si las CTAs son cómodas de clicar, si es fácil desplegar los elementos del menú, etc.).

Y ambos son dos pilares fundamentales de la experiencia de usuario de tu eCommerce.

Así que veamos cómo mejorarlos.

➡️ 5. La experiencia de búsqueda es clave

Esto no es una ley como tal, pero lo sabemos por experiencia propia: el buscador interno de un eCommerce es una pieza fundamental para mejorar la conversión.

Pero, ¡ojo! No te vale con un buscador cualquiera.

Necesitarás uno que sea capaz de guiar al usuario hasta el producto que busca en cualquier circunstancia. Y suena a algo básico, pero no lo es tanto.

Para empezar, tu buscador interno debe ser capaz de ofrecer resultados relevantes ante:

• Sinónimos: no importa si el usuario escribe “nevera” o “frigorífico”. Un buscador avanzado le devolverá los mismos resultados porque “comprende” que la persona está buscando el mismo producto en ambos casos.
• Erratas: aunque la persona escriba por error “tostadra”, el buscador debe ofrecerle resultados de tostadoras (esto es algo que la mayoría no son capaces de hacer).
• Non-product search queries: porque cada vez más gente utiliza el buscador para realizar este tipo de búsquedas sin producto. Por ejemplo, para dar con las políticas de devolución, gastos de envío, etc.

Además de todo esto, también es importante que el buscador interno cuente con otras funciones extras como:

• Autocompletado.
• Faceted search.
• Búsquedas por voz y por imagen.
• Resultados personalizados gracias a la inteligencia artificial.

De esta forma, puedes mejorar la experiencia de usuario y aumentar (mucho) la conversión.

Para que te hagas una idea, los clientes que usan el buscador inteligente Doofinder han visto cómo sus ventas aumentaban entre un 10 y un 20 % gracias a estas funcionalidades (entre muchas otras).

>> Si quieres comprobarlo por ti mismo, entra aquí y prueba Doofinder de forma gratuita durante 30 días en tu tienda online.

➡️ 6. Un aspecto familiar genera confianza (la Ley de Jakob)

Vamos con el siguiente principio de usabilidad.

La Ley de Jakob dice que los usuarios se sienten más cómodos navegando por un sitio que tenga una estructura similar a la de otros sitios web con los que están familiarizados.

En conclusión: haz que los clientes se sientan como en casa.

¿Cómo aplicamos esto?

Fíjate en los puntos en común que aplican la gran mayoría de eCommerce:

• El menú principal se encuentra en la parte superior.
• El botón de compra se coloca en la parte derecha de la ficha de producto y las imágenes, a la izquierda.
• El buscador se sitúa arriba a la derecha o en el centro del menú.

Por ejemplo, Amazon cumple todos estos puntos. Y, por eso, aunque entráramos en su web por primera vez, sabríamos por instinto cómo navegar por ella.

➡️ 7. La ciencia detrás del número 7 (la Ley de Miller)

Todos sabemos que nuestra capacidad para procesar mucha información a la vez es limitada.

¿Pero sabías que un psicólogo estadounidense realizó un estudio concreto sobre este fenómeno?

Pues sí.

George Miller publicó un ensayo donde analizaba los límites de la memoria a corto plazo. Y es que, al parecer, solo tenemos la capacidad de mantener en la memoria entre 5 y 9 elementos a la vez (de ahí que se redondeara al número 7).

Por lo tanto, para mejorar la experiencia de usuario, debemos tener esto en mente y pensar que mientras más elementos agreguemos a una tarea, más complejo será para el usuario realizarla.

Puedes llevarlo a la práctica de la siguiente manera:

• Asegúrate de que los carruseles de productos no tengan más de 7 productos a la vez.
• Si ofreces un número de teléfono para contactar contigo, muéstralo fraccionado en grupos de 2 o números.

Ahora que lo sabes, seguro que empiezas a ver grupos de 7 elementos por todas partes. 😉

Pero ojo, que nosotros no nos vamos a quedar aquí…

➡️ 8. El contenido personalizado le da al usuario justo lo que necesita

Entras en una tienda online de equipamiento de cocina y compras una batidora Moulinex.

A los pocos días vuelves a la misma tienda y, entre los productos destacados de la homepage, te aparece un accesorio específico para ese modelo de batidora que compraste.

¿Casualidad?

Casi seguro que no: lo más probable que la página en cuestión cuente con la tecnología de inteligencia artificial para ofrecer al usuario contenido personalizado.

Esto es, que el sistema se ha basado en:

• Las fichas de producto que has consultado.
• Las búsquedas previas.
• Tu historial de compras.

Para mostrarte productos que se adaptan a tus necesidades.

Y este contenido personalizado no se limita a los productos destacados.

Si cuentas con un buscador inteligente (como Doofinder) puedes incluso ofrecer sugerencias de búsqueda personalizadas.

Es decir, que el buscador interno le mostrará a cada usuario resultados de búsqueda diferentes en función de su comportamiento previo.

Por ejemplo, si el usuario ha estado viendo ropa de mujer anteriormente, cuando escriba en el buscador “pantalones” este le mostrará sugerencias de pantalones de mujer, y no de hombre.

➡️ 9. Los mensajes claros y directos guían al usuario (UX copywriting)

El UX copywriting es una rama del copywriting cuyo propósito es favorecer la navegabilidad mediante el texto de la web.

Este tipo de redacción se basa en:

• Usar mensajes que sean concisos.
• Que se entiendan a la primera.
• Y que dejen claro cómo seguir navegando o interactuando.

El objetivo es que el usuario nunca se quede parado, preguntándose: “Y ahora… ¿qué hago?“.

Como ejemplo tienes la página de error 404 de la tienda Natura.

El texto informa al usuario de que se ha topado con una página de error, y a la vez le indica cómo regresar a la homepage. Todo ello aderezado con un toque de humor para conectar más con la persona y “suavizar” el error.

✅ Buenas prácticas en el proceso de compra

Y, para acabar, te contamos dos prácticas perfectas para optimizar el proceso de compra y reducir los temidos carritos abandonados.

➡️ 10. Las tareas incompletas nos mantienen alerta (el efecto Zeigarnik)

La descubridora de este efecto es la psicóloga Bluma Zeigarnik, que lo estudió tras observar un fenómeno curioso en un grupo de camareros.

Lo que vio es que, mientras la cuenta de una mesa seguía abierta, los camareros recordaban qué persona había pedido cada plato. Pero en el momento en que los comensales pagaban la comida, los mismos camareros eran incapaces de recordar el importe ni los platos pedidos.

Tras observar este fenómeno, Zeigarnik descubrió que nuestro cerebro recuerda mejor aquellas tareas incompletas, porque nos mantienen “alerta”, mientras que desecha la información de las ya completadas.

¿Se te ocurre cómo puedes aprovechar este fenómeno en tu eCommerce?

Por un lado, puedes usarlo con los marcadores de progreso en procesos con varios pasos, como:

• El checkout.
• El proceso de registro en la plataforma. 

Así le vas indicando al usuario en todo momento cuánto le queda para acabar.

Por otro lado, esto también explica el impacto de los emails de carrito abandonado.

Con este tipo de emails le recuerdas al usuario ese proceso incompleto y “activas” el efecto Zeigarnik en su cerebro (lo mismo ocurre con las campañas de retargeting, por ejemplo).

➡️ 11. Un checkout sencillo favorece la conversión (la Ley de Hick-Hyman)

Y acabamos con la ley de Hick-Hyman.

Según esta ley, a más opciones le des a una persona, más aumentará el tiempo que tarda en tomar una decisión.

¿Recuerdas cuando antes te dijimos que más de 3 CTAs juntas pueden abrumar al usuario? Aquí tienes a la “culpable”. 😉

Y esto se puede aplicar también en el proceso del checkout: mientras más alternativas le des al usuario, más probable es que acabe abandonando la compra.

Pero claro, siempre decimos que es fundamental ofrecer diferentes opciones de pago, modalidades de envío, etc.

¿Cómo puedes congeniar ambas ideas y darle suficientes alternativas al usuario sin llegar a abrumarlo?

Una buena idea es establecer una opción por defecto.

Por ejemplo, que aparezca marcado el pago con tarjeta y el envío ordinario. Y si al cliente le interesa elegir otra opción distinta, ahí estará para que la marque.

👉 Utiliza estas leyes como tus nuevos mandamientos para mejorar la experiencia de usuario

Con esto que te hemos explicado ya tienes material de sobra para optimizar la experiencia en tu eCommerce.

Pero cuidado: que sean “leyes” no significa que sean principios infalibles.

Y es que, como ya sabes, en el mundo online nada está grabado en piedra. Lo importante es que apliques estas ideas y realices un seguimiento de tus analíticas para ver cuáles te funcionan mejor a ti.

Así que ánimo y a poner en práctica esos principios. 😉