Diseño y contenidoCómo generar piezas de Email Marketing estratégicamente

Santiago Tribiani

Diseñador UI/UX en Lander. Licenciado en Diseño y Comunicación Audiovisual. Profesor de la cátedra Diseño Web y desarrollo de Interfaces en la Universidad CAECE. He trabajado construyendo campañas de Email Marketing específicas para una amplia variedad de clientes. Soy es un apasionado por entender los distintos tipos de usuarios y sus entornos, esto no solo me permite construir sentido sino también ser creativo, innovador y estratégico a la hora de pensar una pieza de comunicación. Soy un amante de los desafíos y la exploración. También diseño software para diferentes sistemas y plataformas, desde aplicaciones web hasta escritorio y mobile.

UX/UI Designer en Landerapp

Sobre mí Qué hago

02

Introducción al diseño de emails

01

02 Herramientas y Jerarquías

03 Tipos de Campaña

05 Lenguajes Visual

04 Estrategia en el flow

06 Responsive Design

Introducción

01

Introducción05

Diseñar emails no es diseñar websites

Introducción06

Se trata de ir al punto y aprovechar la única y breve oportunidad que tenemos.

Herramientas y jerarquías

02

Herramientas y jerarquías07

• Asunto y pre-encabezado. • Encabezado y Pie. • Destacados. • Llamados a la acción. • Contenidos. • Estructuras.

Herramientas y jerarquías

• Es nuestro primer contacto con el usuario. • Es nuestra chance de generar interés y resaltar entre un

mundo de asuntos distintos. • Es nuestra única oportunidad de lograr que el usuario

tome contacto con nuestra comunicación: el email.

Asunto y pre-encabezado

08

Herramientas y jerarquías09

Herramientas y jerarquías

• Header • Footer • CTA • Contenidos • Estructuras • Jerarquías

Elementos del email

10

Fácil de leer

Jerarquía de contenido

Promotion, 3 days to go. 25% off

Tipos de Campaña

03

Tipos de campaña16

Newsletters

Fidelizar clientes, posicionar la marca y

generar tráfico.

Promocionales Generar Conversiones

(clicks, recomendaciones, ventas, etc).

Estacionales Fidelizar y adquirir

clientes, posicionar la marca y aumentar las

ventas.

Informativas Posicionar la marca,

comunicar una noticia y mantener el contacto.

Estrategia en el flow

04

COMPRAR

Estrategia en el flow18

Asunto Diseño y contenidoObjetivo

Lenguajes visuales

05

Lenguajes visuales

Lenguajes visuales

Lenguajes visuales

Lenguajes visuales

Responsive design

06

Responsive design25

¿Qué es Responsive?

Responsive design26

Desarrollo. Responsive Web Design es una colección de técnicas que permiten que un sitio web sea flexible y se adapte al tamaño de la pantalla desde la que se

está viendo.

Responsive design27

Diseño. El diseño responsive no es una técnica para reorganizar una estructura

sino un concepto.

menor tamaño

distracción

ansiedad

prisa

falta de foco

Dispositivo móvil vs Dispositivo estático

mayor tamaño

concentración

tranquilidad

paciencia

en foco

Responsive design29

• Es la habilidad de ajustar una estructura a las distintas resoluciones.

• Es la posibilidad de trasladar experiencias a través de cualquier dispositivo.

• Es una nueva forma de pensar el Diseño Web: Flexibilidad.

Diseñar para resoluciones y no para dispositivos

¿Cómo hacerlo?

@mediaqueries

¿Qúe son los @mediaqueries?

Son sentencias condicionales de CSS que nos permiten elegir a través de parámetros

específicos cuándo aplicar una propiedad.

Resumen• Consideren toda la experiencia. • Sean transparentes. • Sean obvios, mejoran las conversiones. • Consideren el “Above the fold”. • Digan menos, pueden decir más después. • Hagan la pieza fácil de escanear. • Usen aires alrededor de las acciones. • Hagan su diseño a prueba de imágenes. • Piensen y diseñen los atributos Alt. • Responsive, solo si es necesario.

¿Preguntas?

¡Gracias por venir!Tengan un buen día

Santiago Tribiani UX Designer en Lander

@SantiTribiani

santiagotribiani

santiagotribiani@gmail.com