Mobile checkout – MANGO

2016

EL PROYECTO

El checkout mobile de Mango se había quedado desactualizado y presentaba problemas de arquitectura de la información. Se hizo una propuesta con la información más ordenada y dividida por pasos.

SERVICIOS

Arquitectura de la información, UX Design.

CLIENTE

MANGO

Objetivos del proyecto

El objetivo del proyecto era mejorar la conversión del checkout móvil, facilitando la compra a los usuarios nuevos y recurrentes.

La propuesta

En la versión anterior del checkout móvil, toda la información estaba concentrada en una página, lo que originaba problemas de navegación. La nueva propuesta divide el checkout en pasos separados para el Envío, el Pago y el Resumen de compra.

Mobile checkout por pasos – wireframes

Mango mobile checkout - wireframe

En la primera imagen, se ve el bloque de envíos, en la segunda el bloque de pagos y en la tercera el bloque de resumen. (ver prototipo)

La hipótesis era que, al desglosar la información y mostrarla en distintos pasos, la comprensión era más fácil –el usuario concentraba la atención en una tarea concreta y podría terminarla con menos distracciones y más confianza–. Al aumentar el control sobre las decisiones de envío y pago y, finalmente, resumiendo la información, se esperaba un incremento de la conversión. El riesgo identificado para el negocio era que, al crear más pasos, se creaban momentos adicionales para el posible abandono de la compra por parte del cliente.

Para validar la hipótesis, se llevó a cabo un test A/B entre la versión anterior del checkout y la nueva propuesta, mostrando cada una de ellas al 50% de los usuarios.

Resultados

El nuevo diseño de checkout hace que el flujo de compra sea más sencillo haciendo que la conversión del funnel del checkout aumente un 5,3%.