email marketing para móviles
TRANSCRIPT
![Page 1: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/1.jpg)
Email Marketing para Móviles CÓMO GENERAR CAMPAÑAS RESPONSIVAS QUE FUNCIONEN BIEN EN TODOS LOS DISPOSITIVOS
UX/UI Designer en Doppler
Agustina García Orsi
![Page 2: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/2.jpg)
¿Cuál es el objetivo de tu campaña?
Saber esto determinará en gran parte la elección de recursos gráficos para diseñar tu campaña o elegir un template pre-diseñado
![Page 3: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/3.jpg)
TIPOS DE CAMPAÑAS DE EMAILApuntadas a satisfacer necesidades específicas. Cada tipo de campaña tiene elementos que le son propios y que ayudan a reconocerla como tal.
NEWSLETTER• Fidelizar clientes
• Posicionar la marca
• Generar tráfico
PROMOCIONALES•Generar conversiones
(clicks, recomendaciones,
ventas, suscripciones, etc.)
ESTACIONALES• Fidelizar clientes
• Adquirir clientes
• Posicionar la marca
• Generar conversiones
INFORMATIVAS• Posicionar la marca
• Comunicar una noticia
• Mantener el contacto
![Page 4: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/4.jpg)
El diseño como factor diferenciador y
constructor de valor.
Nuestra imagen nos hace reconocibles ante nuestros clientes y permite construir lazos perdurables en el tiempo.
![Page 5: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/5.jpg)
![Page 6: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/6.jpg)
Nociones generales#Tips para cualquier campaña
![Page 7: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/7.jpg)
Cada cosa en su lugarUna vez que haya decidido mi objetivo puedo
comenzar a jerarquizar los módulos de información y
sobre todo a agruparlos con sentido.
![Page 8: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/8.jpg)
Jerarquías visualesEstablece un orden de lectura a través del uso de jerarquías visuales, destaca o esconde elementos a través del uso del tamaño, el color, la forma y la ubicación de los mismos.
![Page 9: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/9.jpg)
Ten en cuenta las limitaciones
…………………………………………
Recuerda: un diseño es brillante sólo si tus suscriptores pueden verlo.
▪ Más de la mitad de los clientes de correo bloquean las imágenes por defecto, por lo que es vital diseñar también sin imágenes en la mente.
▪ Utiliza las etiquetas «ALT». Estas son parte importante de tu pieza de email, ya que le explican al lector aquello que no puede ver.
▪ Utiliza texto HTML y fuentes standard. De esta manera puedes estar seguro que tu usuario verá el diseño de forma correcta.
![Page 10: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/10.jpg)
![Page 11: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/11.jpg)
¿Ya podemos comenzar a diseñar?
Sabemos que queremos mostrar primero,
que será el cierre pero…
¡No tan rápido! un email no es un impreso
![Page 12: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/12.jpg)
Dimensiones dinámicas, contextos dinámicos y tú sin bola de cristal
#Tip. Mantén tu diseño lo más simple, limpio y jerarquizado posible.
A diferencia de un impreso, un Email se reproduce tantas veces como el usuario lo abre:
• Clientes de correo con interfaces y limitaciones técnicas diferentes.
• Diversidad de dispositivos y contextos
• Resoluciones diferentes de pantalla
![Page 13: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/13.jpg)
Entendiendo el concepto de diseño fluido
#Tip. Cuantos menos elementos poseas, más sencilla será la tarea.
Antes de tomar decisiones respecto de cómo ubicar tus elementos debes comprender una regla muy sencilla: A medida que reduzcas el espacio horizontal, generarás ese espacio hacia abajo.
Ubica tus elementos sobre espacios modulares.
¿Por qué? De esta manera dejarán de comportarse como elementos individuales para moverse en grupo.
![Page 14: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/14.jpg)
¡Genial! Tenemos lo básico
¿Profundizamos?
![Page 15: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/15.jpg)
Mensaje claro y conciso:
A medida que la pantalla disminuye su tamaño, menos verá el usuario en un primer vistazo.
![Page 16: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/16.jpg)
Estructuras modulares y acotadas:
La simplicidad es la clave. Cuantos menos elementos deban re-acomodarse, más controlable será el resultado.
![Page 17: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/17.jpg)
Resolución mínima
Diseña siempre teniendo en cuenta el mínimo en que se verá tu pieza 320px. Sobre todo para la longitud de tus botones ;)
![Page 18: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/18.jpg)
¡No todos tienen dedos pequeños!
IOS Human Interface Guidelines de Apple recomienda una zona mínima de tapping de 44 × 44 puntos.
![Page 19: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/19.jpg)
Tamaños de fuente generosos
Asegúrate de que tu mensaje se pueda leer fácilmente. El tamaño mínimo sugerido para hacerlo cómodamente para el ojo humano es de 13px.
![Page 20: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/20.jpg)
Genera bloques identificables
Apóyate en el uso de espacios en blanco para separar mejor los bloques de información y así lograr una lectura más cómoda.
![Page 21: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/21.jpg)
Utiliza herramientas optimizadas
El universo html es basto, si no cuentas con los recursos para generar un html ¡no temas! Elige una herramienta que cuente con un editor que soporte plantillas 100% responsive.
![Page 22: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/22.jpg)
#tips extras =)
Optimiza para dispositivos retina. Simplemente exporta tus imágenes al
doble de tamaño.
Comprime tus imágenes. Ten en cuenta que la velocidad y calidad de conexión desde mobile nunca será la
misma que desde escritorio.
tinypng.com
Mantén la cabecera limpia. Esto evitará que tu bloque principal
quede debajo del scroll.
Números de teléfono tapeables. De esta manera tus usuarios podrán
llamarte fácilmente.
![Page 23: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/23.jpg)
¿Preguntas?
![Page 24: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/24.jpg)
#extra
![Page 25: Email marketing para móviles](https://reader031.vdocuments.net/reader031/viewer/2022021922/5a64becd7f8b9ac21c8b5473/html5/thumbnails/25.jpg)
UX/UI Designer en Doppler
Agustina García Orsi
¡GRACIAS!
@_missagus_