7 consejos para diseñar una mejor página de pago
Con la temporada navideña a la vuelta de la esquina, muchos de nosotros haremos algunas compras en línea. (OK ... ¡tal vez muchas compras!) La página de pago de un sitio web puede hacer que esa experiencia sea inolvidable, o una que desearía poder olvidar.
Si está diseñando una página de pago, hay muchas consideraciones: funcionalidad, usabilidad, seguridad y diseño. El último elemento es algo en lo que cada diseñador puede tener impacto. Una página de pago no debe diseñarse como una ocurrencia tardía; Podría decirse que es la página más importante en la experiencia de compra en línea.
Hazlo visual
Esto puede parecer una idea obvia, pero la página de pago de una página de comercio electrónico debe ser visual. Demasiados sitios web lo convierten en una forma básica.
Esto es importante por varias razones. Una conexión visual entre las páginas de pago y el resto del sitio establece la credibilidad de la marca. Si la página de pago se parece al resto del sitio, se siente segura y pertenece al sitio. Las imágenes, desde logotipos hasta artículos en el carrito, ayudan a los usuarios a recordar por qué y dónde están en la web. (Recuerde, gran parte del mundo es un grupo bastante distraído de usuarios de Internet).
Entonces, ¿qué tipo de imágenes deberías usar?
- Imágenes Como mínimo, cada artículo debe ir acompañado de un ícono que muestre lo que el usuario está comprando.
- Logos El logotipo de la empresa siempre debe ser claramente visible (y debe poder hacer clic para volver al resto del sitio).
- Botones grandes. Realice llamadas a la acción como "Agregar al carrito", "Actualizar artículo" y "Comprar ahora" grandes, coloridas y visualmente atractivas. Los botones deben ser fáciles de encontrar y hacer que desee hacer clic en ellos.
- Color. Demasiadas páginas de pago son todas blancas con cuadros delineados. Está bien usar color. Mantenga la combinación de colores del resto del sitio web en la página de pago.
- Tipografía. El texto debe ser simple y fácil de leer. (Las personas tienden a "confiar" en las tipografías serif simples o sans serif más que en un script o fuente novedosa). Pero también puede divertirse con elementos de texto más grandes.
Incluye logotipos de pago y sellos de seguridad
Incluya imágenes que hagan que los usuarios se sientan bien comprando con usted. Si bien la mayoría de las personas entienden que pueden pagar con una tarjeta de crédito en línea, tener pequeños logotipos junto a los botones de pago refuerza esta idea.
Es una señal visual pequeña pero tranquilizadora para los usuarios. Puede ayudar a eliminar la confusión sobre qué tipos de pago se aceptan.
Solo recuerde incluir logotipos para todos los tipos de pago. (Demasiados sitios recuerdan logotipos de tarjetas de crédito pero olvidan PayPal o Apple Pay). Mantenga las imágenes pequeñas y agrúpelas de manera organizada. (Afortunadamente para los diseñadores, la mayoría de estos elementos se reproducen bien en formatos pequeños y tienen relaciones de aspecto similares).
Considere diseñar o descargar un kit de logotipos de interfaz de usuario especializado para este propósito. No está limitado a los logotipos de stock de la empresa. Simplemente no te pongas demasiado loco con el diseño; El objetivo es que los usuarios reconozcan los logotipos en un tamaño muy pequeño en la pantalla.
Considere ampliar imágenes
Las páginas de pago que permiten a los usuarios echar un último vistazo a los artículos en el carrito son una gran ventaja. Los efectos de desplazamiento que amplían cada elemento en el carrito o una ventana emergente pueden facilitar a los usuarios ver las compras potenciales por última vez y eliminar la frustración de tener que navegar hacia atrás para verificar un color o tamaño.
Otra opción es crear imágenes en miniatura de gran tamaño para los elementos en la página de pago. Esta imagen adicional puede ayudar a un usuario a confirmar su elección de compra y sentirse aún mejor con la compra.
Demasiados diseñadores descuidan incluir imágenes, lo que hace que sea más fácil abandonar un carrito. Piénselo de esta manera, tener una imagen al momento de pagar es equivalente a estar en la fila en una tienda física con un artículo en la mano. No mucha gente cambia de opinión en este momento.
Usar tablas
La información en el carrito debe organizarse a la perfección. La forma más fácil de lograr esto es diseñar el carrito en forma de tabla o un formato similar basado en la cuadrícula.
Use columnas y filas para mostrar cada artículo, una imagen, descripción, cantidad, precio y cualquier otra información relevante. Los elementos deben clasificarse verticalmente en columnas con otra información en la fila correspondiente. Este estilo de clasificación es esencial para los carros con múltiples artículos para que los usuarios no se vean obligados a moverse a través de las pantallas en lugar de subir y bajar (lo que es más cómodo).
Dentro de cada tabla o cuadrícula, use una alineación consistente. La izquierda es lo más común. Considere la forma en que los precios se alinean también para que sean fáciles de ver en la pantalla. Idealmente, los precios deben alinearse de manera que los números antes y después de un período estén en las mismas posiciones para cada artículo.
Piensa en la funcionalidad
Si bien gran parte de la funcionalidad general del diseño de una página de pago puede no ser la directiva de un diseñador, es algo que debe considerarse. (Si los diseñadores o desarrolladores crean estos conceptos puede variar según el equipo).
Las preocupaciones clave de funcionalidad que necesitan elementos de diseño incluyen:
- Capacidad y facilidad de impresión desde múltiples pantallas, incluso antes y después del pago.
- Incluya la funcionalidad de la lista de deseos u otro método para guardar artículos para su posterior compra. Haga que esa información se pueda compartir.
- Demasiadas páginas de pago se convierten en agujeros oscuros sin enlaces a otras partes de la experiencia de compra. No bloquee a los usuarios en páginas de las que no pueden salir.
- Permitir la edición de artículos en el carrito.
- Considere una opción o página de facturación imprimible. (Esto es especialmente importante si sus clientes incluyen clientes comerciales).
- Facilite a los usuarios la comprensión de cómo modificar, cambiar o actualizar pedidos. Muchas páginas de pago incluyen un contador de cantidad al lado de cada artículo. Haga que ese número sea fácil de editar (y debería actualizarse automáticamente).
- Facilite la creación de una cuenta después del pago. No todos los clientes han comprado con usted antes. Debe ser rápido y fácil realizar una compra y luego registrarse para obtener una cuenta. Encubrir la venta primero.
Deben aparecer iconos clave en cada página
Pensando en el diseño de la página de pago, comienza en el momento en que el concepto del sitio web comienza a incluir una opción de comercio electrónico. Ciertos elementos de diseño deben llevarse por todo el sitio web.
Los íconos de agregar al carrito y de la página de pago deben llevarse a lo largo del diseño. Los botones o elementos de navegación deben tener el mismo diseño (o bastante similar) que los botones de acción correspondientes en la página de pago.
Recuerde usuarios móviles
Un porcentaje cada vez mayor de ventas se produce en dispositivos móviles en lugar de computadoras de escritorio. Piense en el diseño de su página de pago y en la facilidad de uso para estos clientes también. (Nada es más frustrante, y demasiado común, que un sitio web que funciona en un teléfono hasta la página de pago).
Diseñe elementos con toque y deslizamiento en mente. Los botones deben ser más grandes y fáciles de ver. El formulario debe incluir cuadros más profundos para que sean fáciles de acceder sin tener que acercar la pantalla.
Cuando se trata de usuarios móviles, mantener todo en una sola página es igualmente importante. Cree una página de pago que se desplace en lugar de pasar varias pantallas.
Conclusión
Diseñar una página de pago puede ser una gran tarea para cualquier diseñador. La clave es algo de lo que hablamos a menudo en la comunidad de diseño: manténgalo simple. Diseñe un esquema simple con efectos mínimos y un enfoque en la usabilidad y es más probable que encuentre el éxito.
Recuerde al usuario cuando piense en las páginas de pago. Esfuércese por diseñar una página que tenga atractivo visual, logotipos para guiar e informar a los usuarios, muchas imágenes, un diseño organizado, función, iconos para guiar y promover las ventas y una interfaz amigable para dispositivos móviles.
Fotos de archivo Cortesía de Creative Market.