Consejos de diseño de pantallas de selección de métodos de pago

El Black Friday y el CyberMonday son dos fechas en las que quienes trabajamos en el ámbito del e-commerce sabemos que preceden a la campaña de Navidad. Son fechas en las que, entre otras cosas, ponemos a prueba la eficiencia del e-commerce. Por ello queremos hacer un repaso a uno de los puntos clave de cualquier tienda electrónica: los métodos de pago.

Imagen original de Victor en Flickr

Las pantallas de selección de métodos de pago, como ya hemos dicho en otros posts de este blog (“Diseño del formulario de inserción de datos de pago”), son muy importantes dentro del proceso de compra y hay que integrarlas de una manera transparente, que genere las menos fricciones posibles con el usuario.

Es importante que el usuario conozca de antemano cuáles son los métodos de pago aceptados. Muchos usuarios tienen confianza en determinados métodos de pago, ya sean una determinada tarjeta de crédito, un sistema de pagos online como PayPal o una determinada plataforma de pago de un banco o una agrupación de ellos.

Además, para ciertos usuarios poco acostumbrados a las compras online puede ser importante incluir vías tradicionales de pago como la transferencia bancaria o el envío contra reembolso, ya que pueden generan mayor confianza y seguridad.

El problema puede presentarse cuando tenemos que diseñar el proceso de la mejor manera posible, y es ahí cuando se pueden plantear preocupaciones a la hora de diseñar las pantallas de pago para el e-commerce. Os recuerdo los puntos que Dani señalaba como elementos claves a la hora de diseñar este tipo de procesos en el post anteriormente nombrado:

• Ayudar al usuario en el proceso
• Adelantar todo el trabajo posible al usuario
• Ser lo más obvio posible
• Hacer sentir seguro al usuario
• Asegurarse de que el usuario conoce el precio final

Además de lo ya dicho, podemos seguir los consejos de Jamie Appleseed, experto del Baymard Institute, en su post “Checkout Design: Payment Method Selection” (Diseño del proceso de compra: Selección del método de pago en castellano):

• Coloca las opciones lo más cerca posible de tal manera que el usuario vea todos los métodos de pago de una sola vez, permitiendole compararlos y tomar una decisión sobre cuál elegir.
• Deja claro cuál es la opción que ha seleccionado el usuario. Éste nunca debe dudar de cuál ha elegido.
• Usa una apertura progresiva para mostrar gradualmente los campos del formulario de tal manera que el usuario sólo los vea cuando seleccione un método.
• Explica los diferentes métodos de pago y subraya sus condiciones (tipo “con X tarjeta le cargamos un 1% de gastos de gestión” o “el producto sólo se enviará cuando recibamos la transferencia bancaria”) para que el usuario elija la opción más adecuada para él.
• Considera tener una selección por defecto para acelerar el rellenado del formulario y reduciendo el tiempo de parada mientras se elige, guiando a los usuarios a un método particular de pago (el que usen más los usuarios normalmente).

Appleseed pone como ejemplo de buenas prácticas a Best Buy y Blue Nile. La primera como ejemplo de selección de métodos de pago en pestañas y la segunda como ejemplo de selección mediante radio buttons cercanos donde se explican también los métodos de pago.

Al final Appleseed en un adendo del artículo habla de las ventajas de tener múltiples métodos de pago para evitar un error muy habitual de muchas tiendas virtuales, como es tener sólo un proveedor o método de pago:

• Redundancia: cuantos más métodos de pagos aceptes, más redundancia tendrás en tu sistema de pagos si uno se rompe temporalmente o está caído por mantenimiento. En esos casos, puedes desactivar temporalmente el que no funciona sin tener que parar la tienda entera.
• Preferencia: algunos usuarios prefieren unos métodos de pagos sobre otros por muchas razones(comisiones, privacidad, etc…). Además los usuarios suelen apreciar poder elegir incluso aunque el otro método no esté disponible para él.
• Último recurso: no sólo tus sistemas pueden fallar, los instrumentos de pago del usuario también, temporalmente (tarjetas de crédito que no funcionan actividad inusual, problemas técnicos…) o permanentemente (tarjetas caducadas, cuentas cerradas, etc…) En estos casos, poder pagar con una amplia variedad de métodos de pago nos permite que el usuario pueda pagar al menos con uno de sus métodos de pago.

Os recomendamos leer el artículo completo en inglés como casi siempre en estos casos, ya que incluye datos y fuentes que os ayudarán en vuestra tarea de diseño.

Cuando diseñemos una pantalla de selección de métodos de pago tendremos muy en cuenta considerar los dispositivos móviles, ya que según el informe de Criteo sobre comercio electrónico en dispositivos móviles en España casi el 30% de las compras se realizaron desde un dispositivo móvil. Asimismo, el citado informe en España recomienda cuidar los dispositivos Android, ya que dobla el porcentaje de uso frente a iOS (13% frente al 5%). Para ello nos podemos ayudar de herramientas como Responsinator para ver y poder interactuar con el diseño en diferentes dispositivos móviles y resoluciones.

Como final recordaros que lo importante es el proceso de compra completo y que los métodos de pago son una parte de la experiencia. Tan importante como tener una buena pantalla de selección de métodos de pago, deberían ser el resto de pantallas del proceso de compra. De nada sirve tener la mejor pantalla de selección, si los pasos anteriores o posteriores son insatisfactorios.

En Torresburriel Estudio apoyamos el rediseño de tu producto digital, con un proyecto de acompañamiento donde aplicamos metodologías de diseño centrado en el usuario. Contacta con nosotros, y cuéntanos tu proyecto. Te enviaremos una propuesta adaptada a tus necesidades y presupuesto.