1

El carrito de compra móvil perfecto

BCN MAD SCL MDE BOG LIM MEX MIA SFO

50 mejores prácticas para diseñar un proceso de check-out imbatible.

2

Grandes retos de las compras móviles

No es de extrañar que los smartphones – especialmente cuando hablamos de compras móviles – presenten unos paupérrimos ratios de conversión. ¿Los motivos? Muchos.

  El móvil es un dispositivo que aún se presta más para informarse y hacer research que para concretar una compra sobre todo tipo de productos y servicios.

  El consumo que hacemos de los móviles vive de la interrupción y un contexto de uso on-the-go que dificulta la pausa y el espacio para iniciar y terminar un proceso de compra en línea.

  El ancho de banda móvil sigue siendo un limitante (muchas veces navegamos en 3G con coberturas pobres) y el ingreso de datos desde el celular es bien pesada.

3

Conversión en mobile vs. desktop

  Según datos de Monetate, los ratios de conversión se sitúan en 1,31%, bien lejos del 3,59% en desktop o del 3,38% en tablets. Y aunque se ha notado una cierta mejora en los últimos tiempos, la realidad es nos queda todavía mucho por hacer para conseguir unos ratios más razonables.

  Y sí es cierto, no podemos comparar conversiones en desktop y en mobile. Hacerlo es como comparar peras con manzanas. Contextos diferentes llevan a comportamientos diferentes y, por tanto, resultados diferentes.

4

  El contexto de uso y las motivaciones para realizar una compra online con un smartphone son de momento las que son y no las vamos a poder cambiar. Pero, sin lugar a dudas, podemos intentar repensar nuestros procesos de check-outs móviles para hacerlos más sencillos y que consigan que los ratios de abandono del carrito puedan ir mejorando en el tiempo.

Abandonos de carrito alarmantes

  Si en desktop nos acostumbramos a tener unas tasas de abandono del carrito de entre el 60% y el 70%, en mobile esa cifra supera el 95% (exactamente un 97% según SeeWhy).

5

  Aunque las estadísticas hablan no sólo de tasas de conversión más bajos - también de pedidos medios menores y clientes de menor valor -, el protagonismo que el móvil está adquiriendo en el ecommerce es impresionante y sus espectaculares crecimientos están haciendo que se espere que el share-of-wallet de las compras online desde un móvil supere el 20% de las ventas online este 2016 (según la solución de ecommerce Custora).

El m-commerce empieza a ser relevante

6

Buscando mejorar nuestros check-outs móviles

  Entendiendo la importancia que está teniendo el mobile y las importantes tasas de abandono del carrito de la compra, en Multiplica nos hemos puesto a pensar en las mejores prácticas todo check-out móvil debería considerar.   Empecemos sin más a mejorar nuestra conversión móvil con 50 mejores prácticas.

7

01. Empujando el check-out desde el primer momento

  ¿Cuántas veces le hemos dado al botón “Añadir al carro” y hemos tenido la sensación de que no había pasado nada? O peor, no entendemos el por qué no se añadía el producto, cuando nos faltaba elegir la talla o el color.

  En mobile confundir al usuario y no hacerle entender que su producto ya está en el carrito de la compra es un error que no nos podemos permitir.   Debemos invitar a iniciar el check-out desde el primer producto que se añada al carrito de la compra como por ejemplo nos propone Land’s End (www.landsend.com).

Acceso al carrito

8

02. Teniendo visibilidad del carrito con productos en todo momento   Pensemos en evidenciar como avanzar en el proceso de compra, que acompañen al usuario a lo largo de su navegación en nuestro site.

Fab (www.fab.com) lo resuelve de manera maravillosa con íconos semitransparentes que recuerdan al usuario su carrito de compra.

Acceso al carrito

9

03. Permitiendo fácilmente seguir comprando

  Sin interrumpir la compra de otros productos, debemos tener siempre la opción de “continuar comprando”.   Evitemos enviar directamente a tramitar su pedido a los usuarios que acaben de incorporar un producto en el carrito de compra, pero mostremos claramente que el usuario realmente ha incluido el producto en el carro y que tiene opciones para continuar cuándo y cómo le plazca.

Acceso al carrito

10

04. Con la opción de seguir comprando en otro momento

  Debemos dar la opción de grabar la compra para retomarla más tarde; iniciar el proceso de check-out, interrumpirlo y retomarlo en cualquier momento o disponer de un carrito de compra persistente. Asos (www.asos.com) entiende que un porcentaje importante de los usuarios que añaden productos al carrito están simplemente “de mirandas” y les facilita reanudar el proceso en cualquier momento, ofreciéndoles la opción de guardar lo añadido para comprar más tarde. Acceso al carrito

11

05. Dejando claro el producto que se está comprando

  Nuestro cliente no debe tener duda alguna sobre el producto que está comprando.   Deberemos visualizar el producto o productos que van a comprarse e incluir el enlace a la ficha de producto, precio y cantidad seleccionada. Será buena idea mostrar un resumen del pedido cerca del momento de la verdad; darle al botón definitivo de comprar. Muchos usuarios experimen-tan pánico aún cuando hayan revisado 20 veces su carrito de la compra. Best Buy (www.bestbuy.com) lo tiene claro.

Carrito

12

06. Con la posibilidad de editar el carrito fácilmente

  Debemos permitir añadir/editar, fácilmente la cantidad y/o los productos que tenemos en el carrito de la compra.   Evitemos íconos difíciles de interpretar y mostremos claramente las opciones disponibles.

Carrito

13

  Muchos productos se prestan a ser complementados por otros que también vendemos. Nos debemos preocupar de proponerlos en el momento adecuado y conseguiremos pedidos medios mucho más interesantes.

  Lo mejor es dejar que el cliente elija primero el producto que estaba buscando para que, una vez que lo haya añadido al carro, reciba sugerencias. De esta manera no interferimos en su decisión y también seremos transparentes a la hora de mostrar el precio total del sumatorio de productos, sin sorpresas a posteriori.

07. Sepamos cuándo proponer y recomendar venta cruzada

Carrito

14

08. Permitiéndome comprar más rápidamente lo que compro

  Debemos facilitar una compra más rápida permitiendo comprar lo que el cliente elige siempre o repitiendo la compra anterior.   En supermercados y farmacias es una funcionalidad que deberíamos considerar por el considerable ahorro de tiempo que representa, sobre todo si ya contamos con la información.

Carrito

15

09. Solicitando lo antes posible los datos de contacto

  Debemos solicitar, lo antes posible, los datos de contacto: email y/o teléfono. Si disponemos del correo electrónico o el teléfono siempre podremos intentar recuperar a un cliente que haya abandonado su proceso de compra.

Carrito

16

10. Sin la necesidad de registrarse   Muchos clientes agradecerán comprar

de forma anónima, sin tener que pasar por un registro completo previo. Para ellos, la opción de ‘invitado’ puede funcionar y cubrir el máximo de ventas puntuales o esporádicas. Un buen ejemplo es cómo Made (www.made.com) resuelve comprar en su tienda sin tener que registrarse.

  Podemos solicitarle únicamente un email previo y luego aprovechar los datos de pago para completar registro y contraseña. O avisarle al principio del proceso que podemos continuar sin interrupciones y que ya nos requerirán los datos mínimos necesarios para el registro al final del proceso, si así lo desean.

Registro

17

11. Facilitando al máximo el login y acceso

  Para ello, ¿qué mejor login que el usuario pueda hacer con cuentas que ya tengan y sean de su confianza como Paypal, Amazon o Facebook? Menos datos que introducir. Más velocidad y seguridad en iniciar y terminar una compra desde el móvil. Secret Sales (www.secretsales.com) lo resuelve de manera óptima.

Registro

18

12. Incentivando el registro

  Haciendo el registro opcional y dándonos los incentivos oportunos para que creamos cuenta desde nuestro proceso de check-out móvil.

  Desigual (www.desigual.com) nos ofrece un 10% de descuento en compras superiores a los 100 euros.

Registro

19

13. Dejando claro siempre dónde está el usuario

  Debemos indicar el momento del proceso en el que estamos, permitirnos ir a cualquiera de los pasos, así como mostrar el paso siguiente que vamos a dar, para transmitir la sensación de absoluto control y libertad.   Numeremos y etiquetemos claramente cada paso del proceso. Bonobos (www.bonobos.com) - en su proceso de check-out - el usuario tiene completo control del proceso que está iniciando y el paso en el que se encuentra en él en todo momento.

Proceso de compra

20

14. Evitando cualquier distracción

  Evitemos demasiados elementos visuales en cada página ya que pueden reducir la atención y el foco en el proceso de checkout.   Necesitamos que el proceso sea lo más limpio y directo.

Proceso de compra

21

15. De ser posible, sin pasos

  El check-out móvil ideal es aquel que evita el uso de pasos pero tampoco lo convierte en una página con scroll interminable.

  Guardemos la información del usuario y asumamos que para la próxima compra querrá utilizar los mismos datos.   Así lo resuelve Amazon (www.amazon.com) quien te muestra toda tu información en una sola página, con los campos ya completos y la opción de editarlos en caso de ser necesario. Proceso de

compra

22

  Son pocos los actores los que se animan a ofrecer la compra en un simple clic.   Una de las excepciones es Dafiti (www.dafiti.cl). Con One clic invita al usuario a vincular su tarjeta de crédito con su cuenta en Dafiti y así poder realizar compras con sólo un simple clic.

16. … u ofreciendo la compra en un simple clic.

Proceso de compra

23

17. Con tiempos de transición y descarga optimizados

  Deberíamos validar sobre todo de los tiempos que toman las transiciones entre pasos (menos de 2 segundos). Si lo hacen en más de 3 segundos, perdemos según Akamai el 57% de nuestros visitantes desde el móvil (el 74% abandona si es en más de 5 segundos).

  Optimicemos la cantidad y peso de imágenes y/o elementos.

  Asegurémonos que el uso de web services de terceros para la validación de direcciones o la autorización de tarjetas de crédito funciona a la perfección.

Proceso de

compra

24

18. Con claras llamadas a la acción

  Debemos visualizar de manera óptima las llamadas a la acción (CTAs), para que el usuario fluya fácilmente durante todo el proceso de check-out, enfatizando siempre una llamada a la acción prioritaria que le lleve a avanzar en el proceso, evitando múltiples botones.

  Esta llamada a la acción en forma de botón con el suficiente tamaño, color, relieve y contraste para que no genere ninguna duda.

CTAs

25

19. CTAs ubicadas siempre en visibles en cada paso

  Evitemos tener nuestras llamadas a la acción centrales debajo del fold y si no es posible, repitamos arriba a y abajo las mismas llamadas a la acción.   Amazon (www.amazon.com) prioriza sus llamadas en su check-out móvil ubicándolas en primer lugar después del header con su logo.

CTAs

26

  Debemos trabajar con copies que no generen duda alguna. Un copy adecuado es básico para que el usuario entienda perfectamente la acción que realmente está realizando al dar clic en una de nuestras llamadas a la acción.

20. Con llamadas que no den lugar a dudas

CTAs

  ‘Comprar’ puede tener mayor fuerza que ‘Añadir a mi compra’, ‘Añadir a la cesta’, ‘Añadir al carrito’ o ‘Añadir a mi bolsa’ pero podría sugerir al usuario que está por finalizar su compra sin haber podido revisar su compra, ahuyentándolo.

27

21. Con llamadas fijas   Si a pesar de movernos arriba y

abajo en la página, el botón principal o llamada a la acción prioritaria se mantiene en el mismo lugar y bien destacada, los clientes no tendrán ninguna duda de que es allí donde deben hacer clic para avanzar en su proceso de compra.

CTAs

28

  El proceso de compra no es el momento idóneo para preguntarle al usuario todos los detalles de su vida. Los formularios en mobile deben solicitar, única y exclusivamente, los datos imprescindibles para validar la compra. Muchas veces, un exceso de datos puede implicar el abandono del proceso de check-out.

  Evitemos pedir campos en móvil que puedan ser opcionales y si nos vemos obligados a solicitar determinados datos que a veces el usuario no entiende muy bien por qué los pedimos, expliquemos el motivo.

22. Pidiendo sólo aquellos datos imprescindibles

Formularios

29

  La tecnología actual nos permite saber fácilmente el país donde se encuentra nuestro clientes. Usemos este tipo de funcionalidad para facilitarle la introducción de datos. O con el código postal, rellenemos nosotros la provincia, la población o el país.

  Facilitemos al máximo el completar el formulario. Por ejemplo, si la información de envío es la misma que la de facturación, incluyamos un checkbox que rellene esos datos de manera automática. Así lo hace Desigual (www.desigual.com).

23. Automaticemos la entrada de datos cuando sea posible

Formularios

30

24. Geolocalízame si con ello me ahorraré tiempo

  Son múltiples las tiendas las que te invitan a facilitar la ubicación del cliente para encontrar la tienda más cercana y consultar si hay disponibilidad en el producto que estás consultando.   Best Buy publicó que el 28% de sus usuarios visitaban su tienda móvil para materializar una compra en una tienda física, un porcentaje nada despreciable que claramente se beneficiaría de la funcionalidad de geolocalización del móvil.

Formularios

31

25. Validando los campos en tiempo real

  Los usuarios – en general – prefieren una validación en el momento de cada dato que introducen. Con un pequeño JavaScript/AJAX que nos permita ayudarle a identificar posibles errores lo antes posible les ayudaremos.

  El corte inglés (www.elcorteingles.es) incluye un pequeño texto debajo de aquellos campos donde pueda existir un error.

Formularios

32

26. Grabando los datos en todo momento

  Todo carrito de la compra móvil debe entender que la interrupción es la parte de la experiencia móvil. El teléfono puede sonar en cualquier momento y al responderlo no deberiamos perder dato que hayamos introducido.   Zappos (www.zappos.com) lo tiene claro y guarda nuestro avance a través de tu proceso check-out.

Formularios

33

27. Incentivando registrarse a nuestro newsletter

  No obliguemos a nuestros clientes a recibir a nuestro newsletter. Invitémoslos.   A nuestros clientes no les gustará si el registro a nuestro newsletter es obligatorio. De ahí que debamos optar siempre por un opt-in en lugar de un opt-out y buscar un argumento o gancho para que los clientes quieran recibir ofertas y novedades interesantes.

  Dafiti (www.dafiti.cl) incentiva a sus clientes con un cupón de envío gratis al suscribirse al newsletter.

Formularios

34

  Debemos recrear el orden y formato de los campos del formulario de una manera óptima y con unos tamaños que aseguren la máxima legibilidad y faciliten la entrada de datos.

  Cuando pensemos nuestro check-out, diseñemos como si estuviéramos a 25 cm del celular. Eso significa tipos grandes, espacios claros, padding en los enlaces, botones de más 9 mm2, tamaños de letra de 16px, etiquetas encima de los campos, una sola columna…

28. Formularios con una óptima visualización

Formularios

35

  Debemos gestionar con mucho cuidado la introducción de cupones o códigos promocionales. En estudios realizados, hasta 1 de cada 4 usuarios que abandonan un proceso de compra argumentan buscar un cupón.

29. Hagamos el mejor de los usos de cupones y promociones   Una integración inteligente de este tema pasaría por incluir en la misma URL el cupón al cual aspira el usuario y fue el motivo que le llevó a visitarnos o realizar una determinada ruta en nuestro site.

Formularios

36

  Hagamos uso de recursos de navegación que faciliten desde el móvil la entrada o edición de datos.

30. Aprovechemos la propia interface del smartphone

Formularios

  En Diapers (www.diapers.com) el incremento de cantidades no se hace a través de un desplegable que nos obligaría a hacer varios clics.

37

  Ubiquemos claramente los mensajes de error cerca del campo que se ha introducido erróneamente y hagámoslo de una manera suficientemente visual pero que no genere alarma o desconcierto.   Evitemos mostrarlo sólo arriba de la página especialmente en páginas que tiene scroll.

31. Ofrezcamos mensajes de errores claros y contextuales

Formularios

38

  En móvil debemos simplificar en extremo y por ello pasos bien esenciales en desktop deben desaparecer o ser claramente opcionales.   Best Buy (www.bestbuy.com) lo resuelve perfectamente con dos llamadas a la acción. La principal ‘Place Order’ que sirve para confirmar la compra. Y la secundaria ‘Review your Order’ para los que quieren quedarse más tranquilos y prefieren revisar su pedido antes de confirmarlo.

32. Pudiendo revisar el pedido como opción (y no paso)

Resumen

39

33. Permitiendo finalizar el pedido telefónicamente

  Debemos dar siempre la opción de realizar fácilmente el pedido a través del teléfono, incluso un número de pedido que poder materializar fácilmente a través de otro canal como puede ser el teléfono. Domino’s Pizza lo tiene claro.

Resumen

40

34. Dejando claro el costo total del pedido

  Debe quedar claro el coste total incluido el transporte, información del horario de la entrega (si aplica), así como la disponibilidad del producto.   Mostremos cuanto antes posible una estimación del coste de transporte y del tiempo de entrega. Utilicemos la geolocalización para informar desde un inicio del precio de envío para cada opción.   Debemos ofrecer, siempre que se pueda, envío gratuito ya que en la mente del consumidor es una de las barreras más importantes a superar.

Envíos

41

35. Permitiendo definir la urgencia del envío

  Deberíamos permitirle al usuario definir la urgencia del envío. Es importante dar alternativas al usuario, para que éste tenga un mayor control sobre el proceso y le permita elegir desde el horario de entrega preferido hasta la urgencia del envío y, en función de ésta, los costes asociados.

Land’s End (www.landsend.com) le da al usuario la sensación de tener el control sobre su compra permitiéndole tomar algunas decisiones sobre el envío del producto. Envíos

42

36. Empujando el pedido medio con el envío gratuito

  Los clientes pueden fácilmente animarse a comprar un producto más si no representa una gran suma adicional y con eso se ahorran los gastos de envío. Así Mango (shop.mango.com) nos lo propone.

  Informar del importe faltante para que la entrega se convierta en gratuita puede ser el detalle clave que realmente haga mejorar el importe medio de nuestros pedidos.

Envíos

43

37. Pudiendo ahorrar si la entrega es más flexible

  Los costes de envío pueden reducirse si las entregas cuentan con opciones para hacerlas más fáciles o abiertas. Es justo ofrecer un descuento – como hace Ulabox (www.ulabox.com) si el cliente acepta una franja horaria de entrega muy amplia, o bien sea él quien recoja el paquete en un comercio físico acordado.

•  El supermercado online Ulabox no

sólo tiene en cuenta esto, sino que además indica con el ícono ‘eco’ que otro cliente ya programó un envío en esa zona a esa hora, por lo que si la hacemos coincidir con la nuestra, contribuiremos a hacer los desplazamientos más sostenibles.

Envíos

44

  Al mostrarle la confirmación del pedido, debemos mostrarle al cliente que nuestros servicios no terminan cuando paga el pedido, sino que lo acompañamos hasta que tenga el producto satisfactoriamente en sus manos. Aliexpress entrega toda la información de seguimiento, junto con una opción de confirmar que el pedido fue recibido dentro de la fecha de envío. De lo contrario te preguntan si hay algún problema para solucionarlo cuanto antes.

38. Haciéndole ver al usuario que su pedido nos importa

Envíos

45

 Queremos que el cliente se sienta tranquilo de que va a poder recibir el pedido, aunque no se encuentre en el domicilio al minuto de la entrega.   Líder (www.lider.cl) entrega tranquilidad al ofrecer día y tramo de hora en la que que quiere recibir el pedido, junto a la opción de que un tercero lo reciba por ti.

39. Dando alternativas para recibir el pedido

Envíos

46

  Planteemos integrar sistemas complementarios de pago como Paypal, MasterPass o V.me by Visa.

40. Integremos múltiples check-outs complementarios

Pago

47

  Intentemos ofrecer por defecto siempre el método de pago más utilizado.   Si gran parte de nuestras ventas se pagan mediante tarjeta de crédito, destaquemos esa forma de pago como prioritaria. El cliente se ahorrará un clic en la mayoría de los casos.

41. Con las máximas facilidades de pago

Pago

48

  Siempre con la filosofía de facilitarle las cosas a los clientes recurrentes, integremos la funcionalidad para poder recordar los datos de la tarjeta de crédito como nos propone Domino’s Pizza (www.dominos.com).

  Si como empresa transmitimos la seguridad y confianza necesarias, el cliente agradecerá el detalle (siempre opcional) de cara a futuras compras más rápidas y directas.

42. Permitiendo guardar mis datos de tarjeta

Pago

49

  Debemos mostrar claramente nuestra preocupación por la seguridad y la privacidad de los datos de nuestros clientes. Es importante incluir cualquier elemento que transmita seguridad (VeriSign, logos de tarjetas de crédito…).   Utilicemos recuadros o cajas con un color diferente para remarcar cualquier elemento que tenga que ver con la introducción de datos de pago.   Y evitemos en lo posible incluir elementos no seguros en páginas seguras (http://). Lo peor que nos puede pasar es leer un mensaje diciendo: “this page contains insecure elements.”

43. Con una clara preocupación por la seguridad

Pago

50

  Para compras de grandes importes, puede ser un gran gesto de cortesía incluir la posibilidad de pagar con dos tarjetas de crédito diferentes como nos propone Crate&Barrel (www.crateandbarrel.com).   Así sortearemos el límite de crédito que frecuentemente los bancos imponen por contrato, sin dejar escapar las compras que los clientes con límites bajos descartan.

44. Con la posibilidad de pagar con múltiples tarjetas

Pago

51

45. Evitando los errores más habituales

  Evitemos los errores más habituales al rellenar un formulario de check-out, ofreciendo ayudas contextuales e instrucciones que ayuden al usuario a no cometerlos.

  Pongamos especial atención a los posibles errores que el usuario puede tener al entrar los datos de su tarjeta de crédito. A nadie le gusta ver que su pago con tarjeta ha sido rechazado por algún error y menos si no somos capaces de ofrecerle al usuario ninguna solución. Si el error se debe a la introducción de un código CVV incorrecto mostrémosle una imagen que le permita saber dónde encontrar tal código en la tarjeta como MediaMark (tiendas.mediamarkt.es) nos propone.

Pago

52

46. Con una ayuda permanente

  Debemos tener una ayuda clara y permanente y responder las preguntas que en cada paso pueden producir alguna fricción.   Apple (www.apple.com) resuelve la inclusión de informaciones relevantes de manera exquisita a través del uso de menús expandibles que permiten acceder a aquella información de valor sin tener que ir a otra página o sección.

Ayuda

53

  Debemos dejar claras las políticas de devolución mostrando lo fácil que es devolver el producto. Dafiti (www.dafiti.com) lo resuelve con un breve video que explica rápidamente, sin dejar duda, cómo puedo cambiar o devolver un producto.

47. Con políticas de devolución bien claras

Ayuda

54

  Debemos posibilitar hablar vía chat con algún vendedor o con alguien del departamento de atención al cliente (desde la misma página de check-out) como hace Apple (www.apple.com).   Incluso cabría considerar que se abra automáticamente un layer – cuando hayan pasado varios minutos de inactividad por parte del usuario en una determinada página del check-out – que ofrezca hablar con alguien de atención al cliente.

48. Posibilitemos todo tipo de contacto

Ayuda

55

  Propongamos al cliente que se descargue nuestra app añadiendo un pequeño banner y link de descarga en la cabecera de la tienda online.   Incluyamos la ventaja que supone la app respecto a la tienda móvil (descuentos exclusivos, más y mejores funcionalidades, más comodidad…)

49. Empujemos nuestra app desde nuestra tienda móvil

Otros

56

  Podemos automatizar – como hace Mr Wonderful (www.mrwonderful.com) el envío de un email recordatorio a todos aquellos usuarios que lanzaron artículos a su cesta y luego se fueron sin comprar.   Si facilitamos el poder acceder de nuevo al carrito abandonado con un solo clic, conseguiremos una nueva oportunidad para que los clientes rematen su compra.

50. Permitiendo recuperar el carrito abandonando

Otros

57

USER EXPERIENCE CONVERSION ANALYTICS

Resultados digitales extraordinarios para clientes más que felices.

58