Ponencia en WordCamp Madrid 2019 de diseño basado en datos con WordPress. Técnicas, estrategias y herramientas para establecer un programa de optimización del diseño de un web desde la recogida de datos.

1. Data Driven Design
Con WordPress

2. @pablomoratinos

3. ¿Cuál es el objetivo
de tu web?

4. ¿que % de visitas
lo cumplen?

5. objetivos
logrados
usuarios
totales
× 100

6. 10 LEADS
200 VISITAS
× 100

7. CR 5%

8. ¿Cuál es tu tasa
de conversión?

9. Si no conoces tu CR…
¿cómo sabes si tu web
funciona?

10. UX: marco HEART
H
E
A
R
T
Happiness SATISFACCIÓN
Engagement INTERACCIÓN
Adoption CAPTACIÓN
Retention RETENCIÓN
Task Succes TAREAS
https://ai.google/research/pubs/pub36299

14. Data Driven Design
Diseño basado en datos

15. Data Driven Design
Diseño basado en datos
Analítica
Prototipo
Hipótesis
Test online

16. 1. Analítica

17. 1.a Análisis cuantitativo
1.b Análisis cualitativo

18. 1.a Análisis cuantitativo
clickstream
(Google Analytics, Adobe, Matomo…)

19. 1.a Análisis cuantitativo

20. 1.a Análisis cuantitativo

21. 1.a Análisis cuantitativo
• Resoluciones de los dispositivos más usados
• % rebote de las páginas más vistas.
• Tiempo necesario para lograr un objetivo
• Tasa de clics de tus CTAs
• Consecuciones de micro-objetivos
• Búsquedas internas…

22. 1.b Análisis cualitativo

23. 1.b Análisis cualitativo
entrevistas, tests, NPS…

24. 1.b Análisis cualitativo
https://3ymedia.net/nps-wordpress/
encuestas-NPS

25. 1.formularios 2.condiciones
4.exportación3.disparadores
https://3ymedia.net/nps-wordpress/
1.b Análisis cualitativo
encuestas-NPS

26. (antiguo Polldaddy)
1.b Análisis cualitativo
encuestas-NPS

27. • Dificultad al realizar una tarea
• Nivel de satisfacción
• Áreas de mejora
1.b Análisis cualitativo

28. Analítica
Prototipo
hipótesis

29. 2. Prototipo rápido

31. NinjaMock

32. Analítica
Prototipo
hipótesis
Test online

33. 3. Test online

34. Aporta la información necesaria
para un proceso iterativo
Despersonaliza
la toma de decisiones

36. Spotify Insights
Netflix Research

37. Test con usuarios

39. • Test de usuario guiados (con audio)
• Test de cabecera (5”)
• Test de los 3 clic…
Test con usuarios

40. A/B testing

44. Disclaimer:
El 90% de los test A/B
en 6.700 ecommerce
tuvo un efecto menor al
1,2% en el rendimiento

45. plus de este plugin
heatmaps y clickmaps

47. • El eyetracking es lo ideal pero es caro.
• El seguimiento de ratón tiene una
correlación del 88% con el ojo.
Heatmaps
fuente: Carnegie Mellon University

48. • El móvil mató a los heatmaps baratos.
•El ratón es el dedo pero arrastra, no
apunta.
Heatmaps

49. Heatmaps

50. A/B testing
Divi Leads Google Optimize

52. ¿Cuánto tiempo debe
durar un test A/B?

53. BOTÓN 1
BOTÓN 2
BOTÓN 3
Texto A
TEXTO B
Texto C

54. https://vwo.com/ab-split-test-duration/
Visual Website Optimizer

55. https://vwo.com/ab-split-test-duration/

56. https://vwo.com/ab-split-test-duration/

57. Analítica
Prototipo
hipótesis
Test online

58. ¡Y vuelta a
empezar!

59. Notas finales:

60. No te creas nada
que no venga avalado por datos

61. Equivócate rápido

62. Los datos no diseñan,
los diseñadores sí

63. @pablomoratinos

64. ¡Muchas gracias!
¿Preguntas?