Aprende en la presentación realizada en el Email Summit 2014 sobre "Diseño y Contenido" cómo estructurar una pieza de Email, cuáles son los tipos de Campaña, las herramientas y jerarquías útiles, y cómo desarrollar una estrategia de diseño y contenido.

1. Diseño y contenido
Cómo generar piezas de Email Marketing estratégicamente

2. 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

3. 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

4. Introducción
01

5. Introducción
05
Diseñar emails no es diseñar websites

6. Introducción
06
Se trata de ir al punto y aprovechar la
única y breve oportunidad que tenemos.

7. Herramientas y jerarquías
02

8. Herramientas y jerarquías
07
• Asunto y pre-encabezado.
• Encabezado y Pie.
• Destacados.
• Llamados a la acción.
• Contenidos.
• Estructuras.

9. 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

10. Herramientas y jerarquías
09

11. Herramientas y jerarquías
• Header
• Footer
• CTA
• Contenidos
• Estructuras
• Jerarquías
Elementos del email
10

12. Fácil de leer

13. Jerarquía de contenido

15. Promotion, 3 days to go. 25% off

16. Tipos de Campaña
03

17. Tipos de campaña
16
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.

18. Estrategia en el flow
04

19. COMPRAR
Estrategia en el flow
18
Asunto Diseño y contenidoObjetivo

20. Lenguajes visuales
05

21. Lenguajes visuales

22. Lenguajes visuales

23. Lenguajes visuales

24. Lenguajes visuales

25. Responsive design
06

26. Responsive design
25
¿Qué es Responsive?

27. Responsive design
26
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.

28. Responsive design
27
Diseño. El diseño responsive no es una
técnica para reorganizar una estructura
sino un concepto.

29. 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

30. Responsive design
29
• 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.

34. Diseñar para resoluciones y no
para dispositivos

35. ¿Cómo hacerlo?

36. @mediaqueries

37. ¿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.

38. 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.

39. ¿Preguntas?

40. ¡Gracias por venir!
Tengan un buen día
Santiago Tribiani
UX Designer en Lander
@SantiTribiani
santiagotribiani
santiagotribiani@gmail.com