Diseñar formularios parece de lo más sencillo. Pero, hacerlo de manera óptima no está al alcance de todos. Saber los principales tricks (especialmente para móvil) marca claramente la diferencia.

1. 1
BCN MAD SCL MDE LIM MEXBOG MIA SFOBUE SAN
Optimizando formularios al servicio
del Lead
Gerard Adell & Hugo Fernández

2. 2
Os vamos a contar cómo hacer que los formularios
consigan el lead que buscamos.
Hola!

3. 3
· Delicado
· Conciso
· Breve pero intenso
· Lograr lo que se propone
Un formulario debe...

4. 4
O al menos se parece
Un formulario es como
ligar

5. 5
Cada click es un beso
Hay que preguntar,
conocerse y terminar de
una forma bonita

6. 6
Acompaña a tu usuario,
invítale a entrar...
Debes hacer que se sienta cómodo y confiado

7. 7
Hay que ser educado
y elegante
Preséntate, escucha y pregunta sólo lo necesario

8. 8
Pero también debes seducir
y controlar los tiempos
Tu manejas la situación

9. 9
Has de apuntar y dar en
el blanco
Márcate un único propósito

10. 10
Al final tiene que haber
una recompensa
o al menos debe parecerlo

11. 11
Respetando estas premisas
la victoria está casi asegurada
Aunque hay que luchar duro

12. 12
Ejemplo A
Hey, me das tu número de teléfono?
Te puedo acompañar a casa?
Quieres que te bese?
Podemos tener hijos o al menos intentarlo?
Un mal ejemplo

13. 13

14. 14
Ejemplo B
Hola me llamo Marc, aunque mis amigos me llaman “el
sensible” y me preguntaba cuál podría ser el nombre de un
ángel tan precioso como tu?
Este es el camino :)

15. 15

16. 16
3 claves
antes de empezar todo
formulario

17. 17
Objetivo
Define muy claramente qué quieres conseguir.

18. 18
Target
Tu producto no es para todo el mundo
Déjalo claro en el formulario

19. 19
Contexto
Piensa dónde está ubicado el formulario y
la importancia que tiene en cada página

20. 20
Algunos consejos para conseguir nuestros
objetivos
Concretemos

21. 21
Conduce tu contenido hacia el formulario
En vez de esconderlo y mostrarlo en otra página.
Linowski Interaction Design
https://goodui.org/

22. 22
Dirígete claramente a tu target
En vez de hablar de todos los usuarios
Linowski Interaction Design
https://goodui.org/

23. 23
Incentiva al usuario a rellenar el formulario
Trata de dar un regalo en lugar de cerrar una venta de inmediato.
Linowski Interaction Design
https://goodui.org/

24. 24
Deja hablar a tus usuarios.
En vez de hablar de ti mismo
Linowski Interaction Design
https://goodui.org/

25. 25
Recomienda claramente una opción
En vez de hablar ofrecer todas las opciones al mismo nivel
Linowski Interaction Design
https://goodui.org/

26. 26
Muestra los beneficios de realizar la acción en el
CTAEn vez de sólo explicar claramente la acción que se realiza
Linowski Interaction Design
https://goodui.org/

27. 27
ya en el
formulario

28. 28
Andrew Coyle
www.uxdesign.cc
Agrupa en 1 columna
Leemos de izquierda a derecha y de arriba a abajo

29. 29
Andrew Coyle
www.uxdesign.cc
Alinea elementos
No dejes saltos o espacios entre la identificación del imput y el campo

30. 30
Andrew Coyle
www.uxdesign.cc
Separa cada grupo
Si utilizas las mismas distancias los imputs podrían confundirse

31. 31
Andrew Coyle
www.uxdesign.cc
La mayúscula es el diablo
Las letras capitales se leen mucho peor. Nuestro user tardará en identificar.

32. 32
Andrew Coyle
www.uxdesign.cc
Un drop down no siempre es lo mejor
Hay opciones más directas. Que ul user vea todas las opciones si es posible

33. 33
Andrew Coyle
www.uxdesign.cc
No escondas información necesaria
Que ayuda a la comprensión del propio formulario

34. 34
Andrew Coyle
www.uxdesign.cc
Ubica el estado en su lugar correcto
Los errores o estados completados deben estar ahí donde ocurre la acción

35. 35
Jerarquiza tus CTA’S
Da preferencia visual a lo que quieres que el user haga

36. 36
Andrew Coyle
www.uxdesign.cc
Un poco de Affordance
Los imputs tiene que asemejarse en tamaño y forma al contenido que van a soportar

37. 37
Andrew Coyle
www.uxdesign.cc
Las obligaciones no molan
No seas repetitivo

38. 38
Hacer un formulario suele ser una obligación,
pero podemos convertirlo en una experiencia
memorable o al menos, agradable
Experiencias

39. 39
www.typeform.com

40. 40

41. 41
Hemos aplicado algunas de estas directrices en
proyectos de los que nos sentimos orgullosos y
por eso os los queremos enseñar :)
En multiplica

42. 42

43. 43

44. 44

45. 45
¿Preguntas?

46. 46
Referencias
Para poder consultar en cualquier momento
y lugar :)

47. 47
Estructuras
https://www.ventureharbour.com/form-design-best-practices/
https://uxdesign.cc/design-better-forms-96fadca0f49c
Form & Leads
http://neilpatel.com/eEsts/blog/7-maneras-de-incrementar-tu-tasa-de-conversion-hasta-un-627-
desde-tu-formulario-de-contacto/
https://www.ventureharbour.com/high-converting-lead-generation-forms/
https://conversionxl.com/blog/lead-gen-form-optimization/
https://blog.hubspot.com/marketing/optimize-conversion-forms
https://goodui.org/
Herramientas
https://www.formisimo.com/
https://pixelter.com/blog/form-analytics/
https://www.typeform.com/