Tarjetas de regalo Prácticas recomendadas de UX y UI

No sorprende que las tarjetas de regalo se hayan convertido en un tema candente en el comercio electrónico. No solo son excelentes para expresar gratitud y afecto, sino que también son una solución eficaz para algunos dilemas de compra espeluznantes cuando se está quedando sin tiempo para pensar en una idea inteligente para un regalo.

Tabla de contenido

• ‍ ‍ Diseñe una ruta de compra separada para las tarjetas de regalo
• Cree una página de destino separada que enumere todas las opciones de obsequio
• Proporcione una sección separada para que los clientes verifiquen el estado de la tarjeta de regalo
• Promocionar tarjetas de regalo en múltiples espacios
• Diseñe el viaje de compra de la tarjeta de regalo
• Elección del tipo de regalo
• Selección del formato de la tarjeta
• Elegir fecha de entrega (opcional)
• Elegir el monto de la tarjeta de regalo
• Proporcionar la información de los destinatarios
• Personalización del código de la tarjeta de regalo
• Selección de plantillas de vales de regalo
• Subir una foto para personalizar las tarjetas
• Proceso de pago
• Envíe tarjetas a los destinatarios a través de múltiples canales
• Cree un diseño de correo electrónico efectivo
• Canjear tarjetas de regalo‍
• Permitir reembolsos parciales
• Diseñe el campo de entrada de la tarjeta de regalo
• Crear mensajes de éxito y error
• Diseñar notificaciones de caducidad de tarjetas de regalo
• Resumen
  

Casi $ 3 mil millones en efectivo de tarjetas de regalo no se usaron solo en 2019. Mientras tanto, el gasto total en tarjetas de regalo en 2019 registró $ 98.6 mil millones. Fuente

Sabiendo que las tarjetas de regalo son una herramienta extremadamente potente, vale la pena simplificar el proceso de compra y canje de las tarjetas de regalo. Pero, ¿cómo se deben diseñar los campos de entrada? ¿En qué subpáginas deberían promocionarse? ¿Y cómo debería verse la compra y el canje de tarjetas según los principios de UX?

Esta publicación de blog recopila las mejores prácticas e inspiraciones para diseñar tarjetas de regalo UX y UI para sitios web y dispositivos móviles. Cubriremos todo el viaje del cliente, desde la promoción de tarjetas de regalo en su sitio hasta completar el proceso de compra, compartir la tarjeta con el afortunado destinatario y, finalmente, canjear la tarjeta en su tienda.

{{LIBRO ELECTRONICO}}

{{ENDEBOOK}}

Nota: Todas las capturas de pantalla de escritorio se realizaron en Mac, Chrome.

Nota: El enfoque principal de esta publicación son las tarjetas de regalo que se pueden comprar como códigos digitales o tarjetas impresas. Si desea obtener más información sobre el uso de tarjetas de regalo como herramientas de promoción e incentivos, le recomiendo que consulte nuestra guía de UX para cupones y promociones .

Diseñe una ruta de compra separada para las tarjetas de regalo

La ruta de compra de las tarjetas de regalo puede diferir mucho del recorrido estándar del cliente, especialmente si ofrece vales de regalo digitales. Es por eso que debe diseñarse como un módulo separado de su sitio. La mayoría de las rutas de compra de tarjetas de regalo se reducirán a varios pasos cruciales que deben reflejarse en el diseño de su interfaz de usuario:

• Primero, encuentra la sección de tarjetas de regalo en tu tienda.
• Elegir el formato y la plantilla de la tarjeta regalo (recomendado).
• Selección del valor de la tarjeta.
• Configuración de la forma y fecha de entrega.
• Rellenando los datos del destinatario y el mensaje que se enviará con la tarjeta.
• Verificar.
  

Como puede notar, este proceso varía de la compra de productos estándar donde se agrega un producto al carrito y no es necesario proporcionar detalles adicionales. Es por eso que necesita desarrollar un diseño diferente para esta sección que difiera de su página de vista de producto estándar. Pero más sobre eso más adelante.

Esta publicación está escrita principalmente para tarjetas de regalo electrónicas. Si solo ofrece vales de regalo en las ubicaciones físicas, aquí hay una lista de las mejores prácticas de UX para tarjetas físicas:

• Hágalos llamativos : el diseño puede decidir si un cliente los notará y considerará una compra.
• Envuélvalos : coloque las tarjetas en sobres y proporcione un espacio para que los clientes escriban un mensaje personalizado o sus mejores deseos.
• Póngalos a la vista: colóquelos en todas partes y haga que sean imposibles de pasar por alto (por ejemplo, en el escritorio del cajero).
• Hágalos aptos para dispositivos móviles : asegure canjes móviles y permita a los clientes canjear tarjetas de regalo que se muestran en un dispositivo móvil. Por ejemplo, mediante el uso de códigos QR o códigos de barras que se pueden escanear y guardar en un dispositivo móvil.
  

Sin embargo, si pasó a lo digital, estas son algunas de las principales pautas para garantizar que su viaje con tarjeta de regalo esté diseñado adecuadamente desde las perspectivas de UX y UI.

Cree una página de destino separada que enumere todas las opciones de obsequio

Ahora que conoce la necesidad de invertir un poco más de tiempo en el diseño de su módulo de obsequios, queda claro que también necesitará una página de destino. La página de destino de su tarjeta de regalo debe explicar claramente las opciones de tarjetas de regalo disponibles. Debe mostrar diferentes diseños de tarjetas (si ofrece muchos) y presentar diferentes opciones de entrega de tarjetas (si proporciona correo electrónico e impresión). También se recomienda colocar allí algunas preguntas frecuentes o términos y condiciones para ofrecer información adicional a los compradores potenciales.

Ejemplo:

Zalando tiene una página de inicio dedicada para promocionar sus tarjetas de regalo. Desde esta vista, los compradores potenciales pueden ver todas las opciones de personalización posibles y elegir entre tarjetas estándar y cajas de regalo.

Winc, una empresa de comercio electrónico de vinos, incluyó una sección de preguntas frecuentes en la página de destino de su tarjeta de regalo con una copia inteligente.

Puede usar la página de destino no solo para mostrar su oferta, sino también para permitir que los clientes verifiquen el saldo actual de su tarjeta. Algunas empresas también utilizan este espacio para que los usuarios puedan recargar las tarjetas que ya poseen.

Proporcione una sección separada para que los clientes verifiquen el estado de la tarjeta de regalo

No importa si ofrece tarjetas de regalo como un incentivo o un producto adquirible, se recomienda proporcionar un espacio separado para que los usuarios verifiquen el estado de su tarjeta. Puede permitir a los clientes verificar la validez de la tarjeta, el saldo actual o incluso recargar la tarjeta o transferir créditos a otra tarjeta.

Ejemplo:

Shein tiene un pequeño widget en su sección de tarjetas de regalo que permite a los clientes verificar el saldo de su tarjeta de regalo, lo que convierte a este espacio en el lugar de referencia para cualquier cosa relacionada con las tarjetas de regalo.

Starbucks permite a los usuarios verificar el saldo, transferir el saldo, informar cualquier problema o recargar tarjetas en una sección separada de la página.

Promocionar tarjetas de regalo en múltiples espacios

Además de crear una página de inicio para sus tarjetas de regalo, debe hacer que esta parte de su tienda sea fácilmente accesible para cualquier cliente potencial. No verá muchos ingresos provenientes de los obsequios si los clientes no pueden encontrar tarjetas fácilmente en su sitio. La información sobre las tarjetas de regalo debe colocarse en la barra de navegación de la página y en el pie de página. Si las tarjetas de regalo son algo nuevo o está por comenzar una temporada de obsequios, puede considerar lanzar una campaña promocional especial con un descuento en las tarjetas de regalo para aumentar la conciencia del cliente.

Ejemplo:

The Home Depot, además de una barra de navegación, también tiene una barra superior con servicios adicionales. Decidieron utilizar este espacio para promocionar los cheques regalo. Sigue buenas prácticas de UX, ya que los clientes verán en todo momento esta oferta en la parte superior de la página.

También han incluido tarjetas de regalo en el pie de página.

Zalando informa sobre las tarjetas regalo tanto en la barra de navegación como en el pie de página. Sin embargo, en este caso, las tarjetas de regalo se incluyeron en la categoría Accesorios, lo que las hace más difíciles de encontrar que en The Home Depot.

Además de la navegación por el sitio web o la aplicación móvil, también puede agregar tarjetas de regalo al pie de página de sus correos electrónicos. Además, también puede incorporarlos en etapas específicas del recorrido del cliente. Por ejemplo, puede mencionar las tarjetas de regalo en el correo de agradecimiento posterior a la compra para alentar a los compradores a que le lleven a alguien una tarjeta de regalo para su tienda, ya que ya disfrutaron comprando con su marca. Otra idea sería agregar tarjetas a la sección de artículos recomendados cerca de la vista del carrito.

Hablando de correos electrónicos, también puede considerar enviar mensajes separados para promocionar tarjetas de regalo en ciertas épocas del año. Por ejemplo, diríjase a días festivos como Navidad o el Día de la Madre con mensajes de correo electrónico dedicados sobre las posibilidades de obsequio en su tienda.

Ejemplo :

Winc envió un correo electrónico por separado para recordar a los suscriptores sobre el Día de la Madre y promover las tarjetas de regalo.

Alloy Apparel lanzó una campaña de descuento en todas las tarjetas de regalo físicas el día antes de Navidad para dar a los clientes la oportunidad de comprar las tarjetas en el último minuto.

Diseñe el viaje de compra de la tarjeta de regalo

Elección del tipo de regalo

Ahora que sabemos cómo asegurarnos de que los clientes encuentren nuestra oferta, podemos diseñar la mejor ruta de compra posible. Por supuesto, su ruta de compra puede diferir de la que voy a cubrir a continuación.

Ejemplo:

PrettyLittleThing ofrece solo un tipo y formato de regalo. Es por eso que su recorrido como cliente comienza con la selección de plantillas de vales de regalo.

Comencemos seleccionando el tipo de tarjeta de regalo. Hay muchas opciones de obsequios disponibles, que van desde cupones digitales individuales hasta tarjetas corporativas y obsequios grupales. El diseño de esta fase variará enormemente según la gama de tarjetas de regalo que quieras ofrecer. Asegúrese de que, sin importar cuántas opciones haya, todas estén enumeradas de manera legible; se recomienda encarecidamente mantener plana la arquitectura de la información, a menos que desee enfatizar solo una opción de obsequio.

Ejemplo :

The Home Depot ofrece múltiples opciones de regalos. Las tarjetas individuales se promocionan en el banner superior sobre la cuadrícula de opciones de bonificación igualmente importantes, lo que hace que el diseño sea comprensible para el usuario y que todas las opciones sean visibles de un vistazo.

Zalando también ofrece más opciones de personalización, pero optó por un diseño vertical en el que los clientes deben desplazarse hacia abajo para ver todas las opciones disponibles. Como Zalando ofrece solo tarjetas individuales, no necesitan un diseño plano. En cambio, usan la página para cambiar el enfoque a diferentes plantillas y opciones. La opción extra (cajas de regalo) se ofrece en la parte inferior de la página, dejando claro que no es el producto principal.

Selección del formato de la tarjeta

Si ofrece vales de regalo digitales y físicos, el siguiente paso en el proceso de compra debe ser la elección entre estas dos opciones. Tenga en cuenta que este y los siguientes pasos deben presentarse en una sola página. Dirigir a los usuarios a nuevas páginas para completar el proceso de compra probablemente dañará la experiencia y hará que abandonen.

La selección entre los métodos de entrega debe ser clara. Puede intentar usar colores o iconos contrastantes para subrayar la diferencia entre ambas opciones. También se recomienda utilizar una copia clara: el contraste entre "Enviar por correo electrónico" y "Enviar por correo postal" debe ser lo suficientemente transparente. También puede ofrecer la opción de tener un diseño imprimible (un PDF adjunto al correo electrónico) además del formato completamente digital si la persona dotada lo recibe por correo electrónico pero quiere llevarlo a la tienda impreso. También puedes incorporar un código QR de regalo en el email para que se pueda escanear rápidamente en el TPV.

Ejemplo:

Victoria's Secret comienza su recorrido como cliente con la elección entre métodos de entrega. La interfaz de usuario otorga la misma importancia a ambas opciones. Sin embargo, recomendaría CTA más contrastantes: "Enviar por correo" y "Enviar por correo electrónico" pueden ser confusos, especialmente para los hablantes no nativos de inglés.

Elegir fecha de entrega (opcional)

Para impulsar la UX de sus vales de regalo, puede agregar un poco más de personalización a sus tarjetas digitales al permitir que los usuarios elijan cuándo se debe enviar la tarjeta con precisión. Tiene sentido desde la perspectiva de la usabilidad, ya que las tarjetas generalmente se envían como obsequio; apesta enviar un regalo de cumpleaños cinco días antes de la gran fecha, ¿verdad?

Ejemplo:

PrettyLittleThing hace necesario que el usuario establezca la fecha y hora de entrega deseada. Utilizaron una lista desplegable simple. Recomendaría usar un selector de fecha de calendario en su lugar, que brinda a los usuarios una mejor vista de la fecha que han seleccionado (por ejemplo, el día de la semana).

Elegir el monto de la tarjeta de regalo

En el siguiente paso, debe permitir que los usuarios seleccionen el monto de la tarjeta de regalo. La combinación de valores sugeridos y en los que se puede hacer clic y campos de entrada personalizados funciona mejor. De esta manera, le da a los usuarios una pista sobre cuál debe ser el valor del regalo y facilita la selección, y al mismo tiempo ofrece un campo para personalizar si los clientes desean comprar un valor de tarjeta no estándar.

Ejemplo:

Saatchi Art, un mercado de arte en línea, utiliza valores sugeridos y un campo de entrada personalizado para no imponer ningún límite. Si el usuario excede el valor máximo de la tarjeta de regalo, recibirá un mensaje de error informándole sobre los detalles del error en la parte superior de la página.

Zalando impone límites en el valor de la tarjeta regalo situando los posibles valores entre 50 y 100 GBP. Este enfoque puede tener sentido desde un punto de vista económico. Sin embargo, limita drásticamente la flexibilidad de sus cupones y puede hacer que los usuarios abandonen su sitio si desean obtener una tarjeta de regalo más cara.

Tiffany & Co. no ofrece valores de tarjeta personalizados. En su lugar, proporcionan valores de tarjeta predefinidos. Lo que vale la pena señalar es que el valor predeterminado de la tarjeta es de $ 500, aunque hay valores más bajos disponibles. De esta manera, Tiffany & Co. logra dirigir a los clientes a enfocarse en tarjetas de mayor valor y hacerlas más deseables y percibidas como el precio estándar.

Proporcionar la información de los destinatarios

Este es un paso crucial del proceso de diseño, especialmente en el contexto de los vales digitales. Debe cubrir al menos dos campos de entrada aquí: la dirección de correo electrónico del destinatario y el mensaje de la tarjeta de regalo que debe llevar el correo electrónico. Algunas empresas también ofrecen opciones de personalización de la línea de asunto para que la entrega de la tarjeta sea aún más personalizada. La clave es solicitar solo la información necesaria (nombre del destinatario y dirección de correo electrónico). No incluya demasiados campos adicionales.

Otra cosa es el mensaje de la tarjeta: es mejor proporcionar un mensaje preescrito para que sea más fácil para los clientes enviar las tarjetas más rápido. Sin embargo, debe permitir que los usuarios cambien o personalicen los mensajes si no les gusta el texto preescrito. Además, haga que el campo de mensaje sea opcional.

Ejemplo :

Starbucks ofrece una interfaz de usuario simple para la información del destinatario y del remitente.

Amazon les da a los usuarios un mensaje preescrito simple para darles una idea de cómo se vería el mensaje.

Personalización del código de la tarjeta de regalo

Si las tarjetas de regalo son una parte importante de su negocio, puede pensar en mejorar aún más su potencial de personalización. El software de su tarjeta de regalo debería permitirle personalizar el código de la tarjeta de regalo para que coincida con el nombre del destinatario o incluir la ocasión especial a la que está conectada la tarjeta (p. ej., FELIZ CUMPLEAÑOS7593). Este simple truco hará que la tarjeta sea más memorable. El patrón único también facilitará la aplicación del código de la tarjeta en la caja debido a la exclusión de caracteres confusos o la longitud adecuada. Vaya aquí para obtener más detalles sobre cómo mejorar la experiencia de validación de código.

Selección de plantillas de vales de regalo

Como las tarjetas de regalo generalmente se envían como obsequio, es mejor hacerlas visualmente agradables y relacionadas con la ocasión. Por ejemplo, imagine recibir una tarjeta de cumpleaños completamente gris y sin deseos de cumpleaños. Ese no sería el mejor regalo, ¿verdad? Es por eso que se recomienda ofrecer al menos varias plantillas de vales de regalo.

Ejemplo:

Amazon ofrece muchas plantillas de tarjetas y los usuarios pueden comprar según la ocasión, lo que simplifica la ruta de compra de la tarjeta. Su motor de tarjetas de regalo ofrece regalos para muchas ocasiones. Además, con múltiples y diversificados diseños, hace que una tarjeta prepago parezca un regalo a medida.

Subir una foto para personalizar las tarjetas

Una ganancia rápida adicional de UX sería permitir a los usuarios cargar sus fotos para personalizar la tarjeta. Tenga en cuenta, sin embargo, que agregar esta función requiere que establezca términos de uso para las fotografías para protegerse de violar los derechos de propiedad intelectual de terceros.

Ejemplo:

Zalando permite a los usuarios crear sus propios diseños de tarjetas. Sin embargo, para asegurarse de que todo se resuelva en el aspecto legal, Zalando requiere que los usuarios cumplan con sus términos de uso.

Proceso de pago

Cuando los usuarios completen toda la información necesaria, continúe con el paso de pago, diseñado como su pago estándar. Asegúrese de que los usuarios puedan corregir rápidamente la información que proporcionaron o realizar cambios en la tarjeta sin eliminar toda la cesta y comenzar desde cero cada vez que realicen un cambio. También se recomienda ajustar los detalles de la tarjeta en esta vista. Puede usar un texto expandible oculto de forma predeterminada y presentado cuando los usuarios hacen clic en un icono designado o se desplazan sobre la tarjeta.

Ejemplo :

PrettyLittleThing es un ejemplo de una experiencia de usuario de pago de tarjeta de regalo incorrecta. Una vez que los usuarios agregan la tarjeta a la cesta, no existe una forma simple de actualizar los detalles de la tarjeta, como la información del destinatario o el valor del cupón. La única forma es retirar la tarjeta del carrito y comenzar de nuevo todo el proceso.

Winc permite a los usuarios actualizar el valor de la tarjeta mientras aún están en la vista de la cesta.

Envíe tarjetas a los destinatarios a través de múltiples canales

Hay múltiples opciones para compartir tarjetas con los destinatarios. Éstos son algunos de ellos:

• Enviar por mensaje de correo electrónico.
• Envíelo al comprador como un PDF imprimible que se puede compartir físicamente con el destinatario.
• Entrega tarjetas físicas por correo al comprador o destinatario.
• Enviar a través de las redes sociales, por ejemplo, Messenger, Whatsapp.
  

En lo que respecta al diseño de la interfaz de usuario, nos centraremos en las tarjetas digitales enviadas por mensaje de correo electrónico al destinatario. Si es la primera vez que los destinatarios escuchan sobre su marca, puede implementar varias señales de confianza en su correo electrónico. Aquí hay algunos consejos sobre cómo no terminar en spam:

• Una identidad clara del remitente es un marcador de confianza importante : puede considerar incluir el nombre del remitente en la línea de asunto del correo electrónico con la tarjeta de regalo adjunta para aumentar la confianza. Por ejemplo, usa la línea de asunto "¡Katie acaba de enviarte un regalo!"
• Aproveche la personalización : si tiene el nombre del destinatario, debe agregarlo a su correo electrónico para mejorar la experiencia de usuario y hacer que el mensaje sea más confiable.
• No exagere el valor de la tarjeta de regalo en la línea de asunto : intente abstenerse de usar frases como "vale", "código", "oferta" o el valor numérico de la tarjeta en la línea de asunto. El proveedor de correo electrónico del destinatario puede tratar su mensaje como spam o colocarlo en la pestaña Promoción del buzón.
  

Cree un diseño de correo electrónico efectivo

Cuando se trata del contenido del correo electrónico, debe cubrir varios puntos:

• Incluye el valor de la tarjeta.
• Incluya un enlace a términos y condiciones específicos o información adicional sobre las limitaciones del canje de tarjetas (si las hay).
• Código de tarjeta de regalo que es fácil de copiar a un portapapeles, preferiblemente con un solo clic.
• Un CTA que lleva al destinatario a tu tienda.
  

Recuerda que los usuarios pueden leer tu correo tanto en dispositivos de escritorio como móviles. Para asegurarse de que sus tarjetas de regalo sean aptas para dispositivos móviles, puede incluir enlaces profundos en la CTA para asegurarse de que los usuarios vayan directamente a su aplicación de comercio electrónico con el código de regalo ya agregado a su billetera digital. Si decide solo el formato de correo electrónico, asegúrese de incluir un código de barras o un código QR que se pueda ampliar fácilmente con una alta tasa de contraste para asegurarse de que el dispositivo de escaneo en el POS pueda canjearlo.

Ejemplo:

Watsi, una organización benéfica de atención médica, marca todas las casillas de verificación cuando se trata de un diseño de correo electrónico de tarjeta de regalo adecuado.

Amazon trata las tarjetas de regalo como crédito de la tienda que se puede conservar en la cuenta. En su mensaje de correo electrónico, incluyeron un enlace profundo que lleva a los usuarios directamente al sitio web o la aplicación de Amazon (según el dispositivo) que aplica automáticamente los créditos a la cuenta del destinatario.

Canjear tarjetas de regalo

Como sugiere Kim Salazar, la utilidad de los cupones y cheques regalo es directamente proporcional a su facilidad de uso en la tienda online.

Debe evitar imponer límites al canje de cupones de regalo, como el monto mínimo del pedido. Otra buena práctica general de UX es recordar que los destinatarios de las tarjetas de regalo serán más sensibles a la información sobre la entrega y el costo del producto. Dicho cliente configura el contenido del carrito con mayor atención de lo habitual. Esto se debe al temor de que se pierda la diferencia entre el valor nominal de la tarjeta y el monto del pedido. Esta es la razón por la que también debe analizar el viaje del usuario en su conjunto e introducir correcciones para brindar la mejor experiencia de usuario posible.

{{CLIENTE}}

{{CLIENTE FINAL}}

Permitir reembolsos parciales

Puede tratar las tarjetas de regalo como un método de pago, no como un cupón de promoción. Esta opción es genial si usas tarjetas de regalo recargables, como en el caso de Starbucks. Luego, el saldo de la tarjeta se calcula dinámicamente y los créditos se utilizan como método de pago. Similar a una tarjeta de crédito o débito. Si opta por esta solución, debe asegurarse de que las tarjetas de regalo no tengan una fecha de caducidad (o una muy larga). Esto puede hacer que sus tarjetas de regalo sean muy atractivas, pero al mismo tiempo exige una infraestructura de alta calidad para mantener la tarjeta canjeable para siempre.

Ejemplo:

Comprar con una tarjeta regalo de Zalando es fácil, pero empezar puede suponer un reto para el usuario. Para usar la tarjeta de regalo según lo previsto, el receptor debe configurar una cuenta y buscar la pestaña "Tus cupones" y colocar el código de la tarjeta de regalo en el campo de texto designado para canjearlo. Después del canje, el efectivo cargado en la tarjeta se trata como créditos de Zalando y se puede utilizar como método de compra.

El problema con este enfoque es que los usuarios pueden no saber que necesitan configurar una cuenta para canjear la tarjeta y ver su saldo. El canje de la tarjeta también es posible en la caja colocando el código de la tarjeta de regalo en el campo del cupón. A continuación, el importe del vale se aplica al importe total de la cesta de la compra. Recomendaría dejar claras ambas posibilidades para el destinatario de la tarjeta.

Diseñe el campo de entrada de la tarjeta de regalo

Los destinatarios de las tarjetas de regalo quieren usar sus regalos lo antes posible. Para cumplir con esta necesidad, debe proporcionar un campo de entrada de cupón al principio del proceso de compra, preferiblemente en el carrito antes de pagar. Este enfoque permite a los clientes verificar si la tarjeta es válida antes de ingresar información personal.

Un enfoque aún mejor es ofrecer la posibilidad de canjear un vale de regalo en la etapa más temprana posible del proceso de compra, mucho antes que durante la finalización y el pago del pedido.

Ejemplo:

Winc ofrece un diseño de interfaz de usuario sencillo y permite a los usuarios canjear un vale de regalo al comienzo de su viaje, lo que limita efectivamente cualquier estrés o inconveniente relacionado con la imposibilidad de encontrar el campo de canje.

Birchbox, una marca de productos de belleza por suscripción, también permite a los usuarios canjear el vale de regalo de inmediato. La información sobre el canje rápido de la tarjeta se encuentra en el pie de página.

Además, la ubicación de la entrada del cupón debe ser la parte central del proceso de pago y mostrarse correctamente en el sitio web o en la estructura de la aplicación. Asegúrese de que sea lo suficientemente largo para que contenga el código de cupón completo.

Otra buena práctica relacionada con los códigos de regalo es distinguir claramente entre los campos de pago y de cupón, ya que su proximidad y similitud pueden ser una fuente de frustración para los compradores potenciales.

Las pautas coinciden con las mejores prácticas para la interfaz de usuario de cupones. Si desea aprender a diseñar campos de entrada de cupones, léalo.

Ejemplo:

Birchbox es un excelente ejemplo de un cuadro de entrada de vales. El nombre de la caja, "Promociones y códigos de regalo", deja muy claro el propósito de la caja. Muchos sitios de comercio electrónico utilizan "Códigos promocionales" como nombre de esta sección, lo que puede confundir a los propietarios de tarjetas de regalo, ya que las tarjetas no se consideran promociones. También ofrecen un enlace para abrir un cuadro de código de cupón en la vista de pago para aquellos que se lo perdieron en la vista del carrito de compras. Es una excelente manera de mantener la opción de agregar un código de cupón en ambos pasos.

Crear mensajes de éxito y error

Muestra un mensaje de éxito y el total del pedido modificado para confirmar que el código del cupón de regalo se aplicó correctamente. Coloque el mensaje cerca del campo del cupón para asegurarse de que los usuarios lo vean y lo asocien con el código ingresado. Hacer que ese mensaje se muestre en la parte superior o inferior de la página puede resultar confuso. Sin embargo, el mensaje de éxito no debe ser la única confirmación que reciba el usuario. Refleje el total del pedido modificado tanto en el carrito de compras como en la vista de pago.

Por la misma lógica, también debe mostrar un mensaje de error relevante que indique el tipo de problema con la tarjeta de regalo. No muestre el mismo mensaje de error en todos los casos, ya que no indicará al usuario qué es lo que está mal y cómo puede solucionar el problema. Aquí hay unos ejemplos:

• "El código de la tarjeta de regalo es incorrecto. Vuelva a intentarlo".
• "El código de la tarjeta de regalo ha caducado".
• "Usted no es el titular de la tarjeta de regalo (si asigna vales de regalo a clientes individuales)".
• "Su pedido no cumple con las condiciones de la tarjeta de regalo (si asigna límites a los canjes de tarjetas)".
  

Ejemplo:

SummerSalt muestra un mensaje de error si el código ingresado no es válido o si no se cumplen las condiciones de la promoción. Animan a los clientes a verificar dos veces su código.

Diseñar notificaciones de caducidad de tarjetas de regalo

Si sus tarjetas tienen una fecha de vencimiento, debe planificar un poco más con anticipación y configurar notificaciones automáticas para solicitar a los usuarios que usen el saldo de su tarjeta antes de que caduque. Aquí, debe seguir las mejores prácticas de UX relacionadas con el marketing por correo electrónico, es decir, hacer que la imagen sea llamativa, mantener la copia inteligente, agregar un CTA que contraste bien y abstenerse de usar palabras que puedan marcarse como spam ("descuento" ”,trato”,”venta”).

Resumen

Espero que esta lista de mejores prácticas lo ayude a comenzar a diseñar su sitio web y dispositivo móvil para tarjetas de regalo o mejorar su diseño de interfaz de usuario actual. Si está buscando consejos generales sobre cómo crear una campaña de tarjetas de regalo, asegúrese de consultar esta guía.

{{CTA}}

¿Listo para llevar sus tarjetas de regalo al siguiente nivel?

Empezar

{{ENDCTA}}