Tutorial: cómo personalizar las imágenes de los e-email para cada usuario

El añadido de contenidos dinámicos a los e-mail se hace más simple gracias a distintas herramientas que encontramos en la web, como veremos en este rápido tutorial Aprenderás a tomar cualquier imagen usada en una e-mail y a transformarla en una imagen personalizada dinámicamente. Cada destinatario verá aparecer su propio nombre, como en el siguiente ejemplo, creado con NiftyImages:

Tomamos como ejemplo este e-mail de felicitación de cumpleaños enviado por StitchFix. Sabemos que el cumpleaños supone una excelente oportunidad para crear una relación personal con cada destinatario, que estará contento de sentirse mimado y de recibir una oferta especial para la ocasión.

Si todavía no envías e-mail personalizados para el cumpleaños de tus clientes, es el momento de comenzar: los datos dicen que este tipo de mensaje obtiene un 179 % más de clics que los e-mail normales de promoción.

Partiremos de este mensaje y lo transformaremos en un e-mail dinámico y personalizado con el nombre propio de cada destinatario. Pongamos que me llamo Kelly: el aspecto final del e-mail que he recibido es el siguiente:

Para construir el mensaje personalizado, utilizaremos estas dos herramientas:

1. El intuitivo editor de arrastrar y soltar BEE, presente en la plataforma MailUp (gratuita para probarlo)
2. NiftyImages para crear la imagen personalizada. NiftyImages es una plataforma simple e intuitiva para personalizar las imágenes y crear temporizadores de cuenta atrás. La inscripción es gratuita.

Hemos resumido el tutorial en este vídeo (en inglés):

[post_video_embed url=»https://www.youtube.com/embed/gYooNhQX57c» height=»» width=»»]

Comenzamos por crear de nuevo el mensaje de StitchFix en el editor de la plataforma MailUp. Elige una plantilla de una sola columna y añade el encabezado, el bloque de la imagen y los bloques de texto que están debajo.

El paso siguiente es introducir los textos y ajustar el botón de CTA. Rellenamos de color turquesa, en HTML, el espacio en torno a la imagen, de modo que se parezca a la del e-mail original. Por el momento, dejamos vacío el marcador de posición de la imagen.

La estructura, llegados aquí, está prácticamente completa. Hecho eso, pasamos a NiftyImages para crear la imagen dinámica personalizada y la cargamos en el bloque de imágenes del editor BEE de MailUp.

Abre una cuenta gratuita NiftyImages, si todavía no lo has hecho.

2.1. Crea la imagen personalizada

En la primera pantalla, elige New Personalized Imag

Ahora puedes, entre otras cosas:

• Cargar una imagen de tu computadora
• Elegir una plantilla del archivo de NiftyImages

Estas son algunas de las posibilidades que ofrece la galería de plantillas en relación con los mensajes de cumpleaños:

Como ya tenemos nuestra imagen de felicitación de cumpleaños (la del e-mail de StitchFix), la subimos directamente: un clic en el botón [Upload Image] en el ángulo superior derecho y comienza a cargarse. En el paso siguiente, aparecerá la tecla personalizada predefinida Great deals for our customers .

Utilizando el menú a la izquierda, podemos ahora personalizar el texto y las características de la fuente (estilo y tamaño). Los actualizamos para reflejar el tema del cumpleaños:

Por el momento introducimos FIRSTNAME (nombre propio) como marcador de posición para el texto dinámico. En el paso siguiente veremos cómo modificarlo en función del ESP utilizado.

Hay que introducir entonces un texto predefinido, que aparecerá si no está disponible el nombre propio del destinatario.

¡Es el momento de controlar qué aspecto tiene el mensaje! Haz clic en el botón [Preview] en el ángulo superior derecho:

Este paso es ya un poco más técnico, pero es necesario. La imagen personalizada de feliz cumpleaños que hemos creado tiene una URL dinámica, que contiene el nombre propio del destinatario como parámetro al final. Este rasgo varía según el proveedor ESP utilizado y seleccionado en el menú desplegable: nosotros, obviamente, como plataforma de envío hemos definido MailUp.

Este paso es de extremada importancia: ¡si la sintaxis del tag con el nombre es errónea, la imagen personalizada no funcionará! Cada ESP tiene un sintaxis específica (en la que se prefieren, por ejemplo, los paréntesis a los corchetes). El menú desplegable de NiftyImages genera una URL específica para el ESP seleccionado.

Una vez generada la URL dinámica, cópiala y pégala en un bloc de notas. Es el momento de volver al editor de la plataforma MailUp: ¡casi hemos terminado!

Veamos un tutorial de NiftyImages que aclara como generar la URL dinámica:

[post_video_embed url=»https://www.youtube.com/embed/uwUxinJaklM» height=»» width=»»]

Después de volver al editor MailUp, haz clic en el marcador de posición de la imagen para visualizar el menú a la derecha. Activa la opción Imagen dinámica del menú Propiedades de contenido.

Pega la URL generada por NiftyImages: se debería visualizar la imagen de cumpleaños personalizada.

Es el momento de visualizar la vista previa del e-mail de StitchFix que hemos recreado con una imagen personalizada. Un efecto completamente distinto, ¿verdad?

¡Y ahí está! En pocos y sencillos pasos hemos creando un espléndido e-mail personalizado para desear un feliz cumpleaños a cada uno de nuestros destinatarios, automáticamente.