UX: Mejora la experiencia de usuario de tu eCommerce

UX: Mejora la experiencia de usuario de tu eCommerce

A día de hoy, para nadie debería ser una novedad que el user experience o la experiencia de usuario es uno de los factores de mayor valor en el comercio electrónico actual.

Es más, diría que el UX o User eXperience cada vez más influye en el SEO, las conversiones y en casi todo lo que tenga que ver con el éxito o no de una página web, blog o tienda online.

Esa buena experiencia de la que muchos hablan, es fundamental tanto para posicionarse en la mente de tus potenciales clientes como en las búsquedas de Google.

¿Cómo optimizar la experiencia de usuario de tu eCommerce?

Tendiendo en cuenta la importancia de este tema y la necesidad de información que hay sobre el mismo, es que en este 49º guest post cuento con la colaboración de Ernesto Olivares.

Ernesto nos ha preparado una Guía completa con muchos consejos importantes para mejorar el UX (User eXperience) de nuestra tienda online.


¿Cómo optimizar la experiencia de usuario de tu eCommerce?

Mejora el UX (User eXperience) de tu eCommerce en 8 pasos

¿Tienes un ecommerce y no vendes tanto como te gustaría?

Sabes que necesitas hacer algo para que las cosas mejoren, pero tienes un serio dilema: ¿Debes buscar más tráfico? ¿O sólo mejorar la tasa de conversión? ¿Y qué hay del diseño? ¿No estará fallando tu sitio por el diseño?

Vale, no es un dilema. Son varios. Vender por internet no es tan fácil como parece.

Las cosas claras antes de que sigamos: no existe el remedio milagroso que lo arregle todo de un plumazo. Hay que analizar y probar muchas cosas, y en ocasiones hay que sacrificar algo.

Pero si hay algo que se parezca a una solución universal para los problemas de un ecommerce (y de cualquier sitio web), eso es sin duda optimizar la experiencia de usuario (UX = user experience).

¿Qué es la usabilidad o UX?

Cualquiera que tenga algo que ver con ecommerce y marketing digital en general necesita saber todo lo posible sobre esta disciplina.

El user experience o la experiencia de usuario está un escalón por encima del SEO, la conversión digital y el diseño web.

Tus usuarios son los que van a decidir el éxito o fracaso de tu sitio web. Y por eso debes optimizar su experiencia.

Se trata de eliminar las fricciones, esos pequeños problemas que, sumados unos a otros, hacen que los usuarios se alejen de tu principal objetivo: la venta.

¿Qué factores entran en juego para que la experiencia de cada usuario sea la mejor posible?

Todo: desde la adquisición de tráfico, hasta el diseño o interface de la web (UI), pasando por supuesto por la manera en que tratamos de “empujarles” hacia la conversión.

Todo eso es UX.

A continuación, te muestro 8 formas de optimizar la experiencia de usuario, mejorando tanto las ventas como la percepción que el público tenga de tu marca. Ocho puntos de partida sencillos para trabajar y pulir la UX de tu ecommerce.

1) Hay que ganar al cliente en la primera interacción

“La experiencia de usuario comienza con la primera impresión de un producto o marca” – Michael Cumming

Hablemos de primeras impresiones… ¿Qué sensación te da cuando llegas a una web lenta, sobrecargada y desordenada? ¿Te dan ganas de quedarte y navegar o de salir corriendo?

Incluso si el sitio tiene “buena presencia” y carga bien, hay otras razones por las que un usuario puede salir “rebotado” de un sitio, como por ejemplo:

  • Un contenido superficial y vacío.
  • Mala gramática o faltas de ortografía.
  • Precios poco claros.

Incluso que insistan demasiado en venderte algo que no necesitas puede provocar una reacción negativa inmediata.

Igual que ocurre en las entrevistas de trabajo, la primera impresión hace muchísimo. El usuario que salga con una mala impresión de tu sitio probablemente no volverá jamás.

Esto, que es importante para cualquier tipo de sitio web, es absolutamente esencial para un ecommerce. ¿Por qué?

Imagínate que estás en una tienda online y tienes intención de comprar algo. Tras unos segundos te das cuenta que el sitio es desesperadamente…  leeeeento.

Ahora no solo estás molesto por los preciosos minutos que estás perdiendo: también empiezas a pensar que el proceso de pago no funcionará bien.

¿Qué pasa si la página se bloquea justo cuando acabas de meter los datos de tu tarjeta de crédito?

Ese miedo frustra muchas ventas, en todos aquellos sitios que no son tan rápidos como los usuarios esperan.

¿Y cómo de rápido es eso?

¡Mucho!

No voy a aburrirte con cientos de estadísticas para demostrarlo, pero quédate con esto:

En el 2011, un estudio concluyó que las páginas web sólo tenían 10 segundos para convencer a los usuarios antes de que estos pulsen el temido botón de “volver”.

Cinco años después, todos los expertos coinciden en que 10 segundos es ya una estimación demasiado generosa. Siendo realistas, cuatro o cinco segundos es todo el tiempo que tienes para ganar la atención del cliente… O perderla para siempre.

De hecho, en Google van más allá y dicen que 2 segundos de carga es el máximo umbral aceptable para un sitio de ecommerce, como puedes ver en el siguiente vídeo:

Si todavía no has creado tu web, te puede ser muy útil este estudio en el que analizan qué plataformas de ecommerce muestran los mejores tiempos de carga. Mucho ojo a los datos de Shopify.

Los sitios de ecommerce tienen otro rasgo especial. Porque puedes influir en la primera impresión de tu usuario incluso antes de que estos visiten tu sitio. ¿Cómo es posible?

Bueno, ¿alguna vez has sentido las ganas de comprar en un sitio web después de leer muy buenas críticas? ¿O después de que un amigo te asegure que él ya ha comprado y el servicio es realmente bueno?

Es decir, un sitio te puede gustar más si te han preparado para ello tus amigos o la gente a la que sigues en redes sociales.

¿Alguna vez has oído hablar del poder de los influencers? Pues es justamente eso.

En este otro estudio puedes ver que los usuarios consideran la influencia de las reseñas online como el segundo factor de confianza y credibilidad para comprar en un sitio web, sólo por detrás de los certificados SSL y otros sellos de garantía.

Recapitulando: haz todo lo que puedas para dar una gran primera impresión, ya sea en el mismo sitio o fuera del sitio (redes sociales, reviews, blogs del sector).

“El 88% de los usuarios dicen que no volverían a un sitio web tras una primera experiencia negativa” Econsultancy

2) Sé transparente con tus precios y gastos de envío

Uno de los peores favores que le puedes hacer a la experiencia de tus usuarios es ser poco claro con los precios, o los costes derivados de su compra (impuestos y transporte).

En el ecommerce, aún está bastante extendida la práctica de mostrar sólo precios “parciales”, es decir, sin iva y sin informar a las claras sobre el añadido que supondrá el envío.

Así sólo se consigue una cosa: que el cliente se forme una idea equivocada sobre el precio de su compra, y que se lleve una decepción al llegar al momento supremo: el checkout.

Esta decepción o pequeño encontronazo con la realidad de lo que costará su compra es uno de los principales responsables del síndrome del carrito abandonado.

El usuario estaba dispuesto a comprar cuando creía que el precio era x, pero cambia de opinión cuando ve que el precio es x + iva + gastos de envío.

Dejará el carrito en suspenso (o lo olvidará del todo) y volverá a Google para comparar con los precios reales de tu competencia.

Si la competencia tiene gastos de envío inferiores a los tuyos, ya te puedes olvidar de completar muchas de esas compras.

De hecho, puede darse el caso paradójico de que tú hagas la labor de atraer clientes gracias a los precios iniciales que publicitas, pero luego pasárselos a la competencia cuando averiguan cuál es tu precio real.

Sé que es un problema espinoso y la mayoría de propietarios de ecommerce se resisten como gatos panza arriba a reducir sus gastos de envío (porque son un gasto en el que ellos incurren), pero si al menos no cambias tus precios, trata siempre de ser transparente y no contribuyas a crear ese efecto de decepción en tus visitantes.

Recuerda lo que veíamos en el primer punto: el usuario seguramente no volverá después de una primera experiencia negativa; encima puede que estés contribuyendo a elevar la percepción que el público tiene de tu competencia (porque añaden menores costes de envío, o porque son más transparentes).

3) Minimalismo = Menos Distracciones

El diseño importa. Pero lo más importante de todo es que el diseño no se interponga entre el usuario y la venta.

Como contaba en mi post 16 tendencias de diseño gráfico y web para el 2016, ahora mismo dos grandes estilos marcan el paso en el ámbito del diseño web: flat design y material design.

Ambos estilos comparten varios rasgos, y el más importante es que crean sitios web y apps minimalistas, y también experiencias de usuario minimalistas.

Nos guste o no, los usuarios ahora están muy familiarizados con los diseños web minimalistas, claros y con pocas distracciones.

A día de hoy, tu sitio va a ser comparado con esas dos grandes tendencias. Es un hecho.

Sí, ya sé que es bueno ser original y distanciarse del resto, pero, créeme, ahora no es buen momento para tener un diseño sobrecargado y “ruidoso”.

Además, hay una tercera tendencia que tiene sus bases en el diseño minimalista: el diseño en cuadrícula o con elementos geométricos.

Se basa en el orden y en facilitar la navegación. El usuario sabe qué esperar cuando todo está dispuesto en torno a una cuadrícula o matriz regular.

Esto es fundamental en un ecommerce, porque no obliga al usuario a perder tiempo en algo tan molesto como “descifrar” tu diseño o navegación.

Cuanto menos tarde en darse cuenta de cómo funciona todo, antes podrá enfocarse en lo que tú quieres: tus productos.

Eliminar distracciones (como por ejemplo, pasos innecesarios en el embudo de ventas) es esencial para vender más. Quédate con esta frase (que luego voy a repetir): “el usuario siempre seguirá el camino que ofrezca menor resistencia.”

4) La fuerza del Espacio Negativo (o Espacio Blanco)

Al ofrecer menos elementos en los cuales enfocarse, disminuyes el trabajo del usuario.

¿Cómo conseguir que algo llame realmente la atención? Creando espacio alrededor de este algo.

Este espacio alrededor del objeto es lo que llamamos espacio negativo, espacio blanco o white space.

Es sencillo: cuanto más espacio haya alrededor de un objeto, más atraerá a tu mirada.

Hasta hace unos años, los webmasters tenían un miedo irracional al “vacío”.

Todo el mundo quería usar cada espacio disponible en la página, logrando que sus sitios tuvieran este aspecto “infernal”:

UX: La fuerza del Espacio Negativo (o Espacio Blanco)

Dantesco, ¿verdad? Pues así era internet hace poco más de una década.

Como queda claro con el ejemplo, el espacio blanco permite respirar a los usuarios. Todos estamos muy ocupados, sólo queremos encontrar lo que necesitamos y continuar.

Todos estamos continuamente expuestos a un bombardeo de información visual. Por tanto, si  quieres que nos enfoquemos en algo, debe ser algo simple, claro y fácil de procesar.

Esto es imposible si no usas mucho (y bien) el espacio negativo.

Y ya no es sólo la necesidad de ser claro en el mensaje para poder llegar al consumidor.

También está el efecto subjetivo: si tienes un diseño sobrecargado, tus clientes podrían asociarlo a una señal de descuido o poca efectividad. Muy peligroso para un ecommerce.

5) Tarjetas: Todo el mundo sabe cómo usarlas

Usar tarjetas (en inglés cards) es una técnica clásica de diseño. Tan clásica, que hasta tus padres pueden llegar a sentir una cierta familiaridad con una web o app moderno si está basada en un formato de tarjetas.

Después de todo, cuando eran niños jugaban e intercambiaban un tipo de tarjetas muy parecido:

Tarjetas: Todo el mundo sabe cómo usarlas

Fuente: blog.intercom.io

Además, en el ámbito social y de los negocios las tarjetas se usan desde hace siglos. Eso sí que es todo un clásico.

Así que no es extraño que las tarjetas se estén imponiendo en el diseño web actual. No demandan ningún aprendizaje por parte del usuario, y de hecho hacen que este interactúe mucho más.

Para muchos las tarjetas son ya el nuevo estándar de diseño web -en lugar de las páginas-.

Las tarjetas se han adueñado ya de nuestros smartphones. Google Now, Twitter, Instagram… Todas estas apps se manejan a partir de tarjetas.

Uno de los pasos más efectivos que puedes tomar para mejorar la experiencia de usuario de tu ecommerce es convertir la página de producto en una tarjeta.

¿Quieres hacer una oferta especial? Ponlo en una tarjeta para captar la atención del usuario.

Si necesitas inspiración, aquí tienes: 15 Delicious examples of card-based web design.

Fíjate mucho en Pinterest. Hay millones de tarjetas – y muchas de ellas son productos.

Piensa cómo harías para que tus tarjetas destaquen dentro de un tablero de Pinterest.

Pinterest es el ejemplo perfecto del diseño de UX

De hecho, Pinterest es el ejemplo perfecto del diseño de UX del que estoy hablando: minimalista, con la cuadrícula como base, mucho espacio blanco y a base de tarjetas. ¿Será una coincidencia que sea tan popular entre los compradores online?

6) Somos visuales: vende con imágenes y vídeo

En la calle, para llamar la atención de los clientes, necesitas un escaparate atractivo. En un ecommerce sucede más o menos lo mismo.

Las personas somos criaturas visuales. Sería una locura no tener en cuenta eso a la hora de vender por Internet.

Durante años, la tendencia ha sido añadir más y más imágenes a la ficha de producto.

Hoy en día, la buena práctica dice que debes usar al menos 10 fotografías en buena resolución (como mínimo de 800×600 píxeles), dándole al cliente posibilidad de ver el producto con todo detalle.

Tener buenas imágenes de los productos es tan importante que Amazon tiene un estudio propio de fotografía en Brooklyn dedicado solamente a realizar fotos de sus prendas de ropa.

Y, ¿sabes cuántas fotos hacen cada día? 19.000, de las cuales 2.400 van a parar a la web de Amazon. Eso es tomarse las imágenes de producto en serio.

¿Cómo llevar más allá lo que ofrece la fotografía? Algunos productos (como los zapatos) suelen incluir vista en 360º, lo que está muy bien, porque cuando nos probamos calzado en una tienda miramos nuestros pies una y otra vez en el espejo desde diferentes ángulos.

Pero hay algo aún mejor: un vídeo de tus productos.

Muestra un video de alguien tocando, vistiendo o probando tu producto y te garantizo que ya habrás disminuido la brecha que te separa de lograr la venta.

Antes te decía que una buena crítica puede hacer maravillas por tu tienda o tus productos. Pues una crítica en video puede tener ese mismo efecto, multiplicado por diez.

Se sabe que comprar es una decisión emocional.

¿Qué puede estimular más el deseo de tu cliente que ver el producto en vídeo, en manos de otra persona? Queremos lo que tienen los demás, no lo olvides.

7) Microinteracciones: Los detalles importan

Apple es una de las pocas empresas de tecnología que tiene auténticos fans. Sí, fans como tiene una estrella de rock o un equipo de fútbol.

Apple tiene fans porque cuida el diseño y la experiencia de usuario hasta el último detalle. Apple cuida las microinteracciones.

Las microinteracciones son los ladrillos con los que se construye la interacción de usuario.

En cada dispositivo, cada vez que haces un ajuste, estás utilizando una microinteracción.

Cada vez que le das a “me gusta” en Facebook, eso es también una microinteracción.

Crear buenas microinteracciones no es fácil. Las buenas interacciones separan los buenos productos de los malos.

El menú de hamburguesa, los me gusta, el autocorrect y el autocomplete son buenos ejemplos de microinteracciones.

Parte de aquello que los usuarios ya han asimilado, y construye con ellos nuevas microinteracciones para hacer tu sitio más personal.

En este post en el blog de SEMrush, María Sánchez cita un buen ejemplo de microinteracción con la pequeña animación de un búho que se tapa los ojos cuando el usuario introduce su contraseña en el formulario.

Eso sí, asegurate de que tus microinteracciones tienen un único propósito. Ese propósito debe ser relevante y necesario para tu sitio o app.

Nunca añadas algo sólo por el mero hecho tener algo atractivo o cool. Eso es lo peor que le puedes hacer a la experiencia de usuario.

8) Scroll largo y Lazy load

La última tendencia que te recomiendo incorporar a tu ecommerce es el scroll largo, junto con la técnica de lazy load para cargar las imágenes según se va haciendo scroll hacia abajo.

Esta tendencia es justo lo contrario del modelo de clicks múltiples y paginación que ha sido lo habitual hasta hace muy poco.

¿Por qué no debemos tenerle miedo a las páginas largas, que obligan a hacer scroll hacia abajo una y otra vez?

Porque gracias al uso de los smartphones, el scroll se ha convertido en el nuevo click.

Esto, que parece nimio, es toda una revolución.

¿Alguien habría pensado hace 6 años que hacer scroll era más fácil que hacer clic?

También hay que pensar que cada vez que hacemos clic, el buscador debe cargar una nueva página haciendo esperar al usuario. Y los usuarios odian esperar.

Otra de las pegas de tener una página muy larga con mucho contenido era que tarda en cargar.

Pero eso se termina con el lazy load, ya que todo el contenido no visible ahora mismo está cargándose y preparándose para aparecer en cuanto el visitante haga scroll hacia abajo. Una solución elegante y que crea adicción.

En fin, si te queda alguna duda, recuerda la frase que te dije antes y hazla tu lema:

“El usuario siempre seguirá el camino que ofrezca menor resistencia” – Paul Boag

Paul Boag es uno de los expertos en UX que más admiro. Dice que si quieres una ventaja verdaderamente competitiva sobre otras páginas de ecommerce en tu nicho, debes centrarte en hacerlo sencillo.

Y pienso que esas palabras son la mejor manera posible de cerrar este post. 🙂

Fotos (UI/UX usability design) ShutterStock

Y tú ¿te preocupas por mejorar la experiencia de usuario o  el user experience de tu ecommerce?

Periodista visual. He creado infografías para diarios como El Mundo y La Vanguardia. Actualmente dirijo una agencia de información visual en la que combino mis dos pasiones: el diseño y la visualización de datos.
Showing 4 comments
  • Natalia
    Responder

    ¡Cuantas cosas nuevas! Está claro que hay que anteponer la experiencia de usuario a casi todos los demás factores. Interesante el concepto de micro-interacciones, y tambien el diseño a base de tarjetas, son aportaciones que pueden dar mucho juego. Me ha sorprendido la frase “el scroll es el nuevo click”, ya que yo siempre trataba de huir del scroll en mis diseños. Sin embargo, scroll+lazy-load sí puede dar buen resultado. Investigaremos…
    Un saludo y gracias por el artículo 🙂

    • El Blog de Jose Facchin
      Responder

      Hola Natalia, ya sabes, en este mundo tenemos que estar siempre al tanto de los cambios, todo pasa rápido.

      Y con el scroll, implementarlo pero con mesura, no abuses.

      Saludos.

  • Miguel Florido
    Responder

    La experiencia de usuario es fundamental, tanto para mejorar el posicionamiento web como para aumentar las conversiones y con ellos las ventas.

    Yo añadiría un aspecto, que pese a que es muy simple, también es muy efectivo, me refiero a elegir un buen tamaño y color del botón de compra, eso hará que mejore la experiencia de usuario y que aumentemos las conversiones.

    Excelente artículo y muchas gracias por la mención! 😉

    • ernestoolivares2014
      Responder

      Totalmente de acuerdo contigo Miguel, porque una vez el comprador siente el cosquilleo del “Lo Quiero” el botón de compra tiene que ser percibido inmediatamente. El color, el tamaño y la forma del botón son las 3 variables que nuestro sentido visual captará y asociará con la acción de comprar.
      Hace un par de años escribí un post titulado: “Pensamos 90% en imágenes” https://ernestoolivares.es/pensamos-90-en-imagenes/ acerca de la importancia del mensaje visual y sus razones científicas.
      Espero te guste, un saludo
      Ernesto

Déjanos tu comentario