10+ Los mejores ejemplos de formularios de varios pasos y por qué funcionan
Actualización 2023: Hemos añadido más ejemplos de formularios multipaso, eliminado otros antiguos y actualizado algunos enlaces.
El poder de los formularios multipaso no es ningún secreto: un buen formulario multipaso puede aumentar su tasa de conversión en más de un 100% de buenas a primeras.
Y según Klientboost, una agencia líder en optimización de la tasa de conversión (CRO), es uno de los experimentos de CRO de mayor impacto que puede realizar ahora mismo.
Además, los formularios de varios pasos le permiten hacer más preguntas sin que los usuarios se aburran, lo que le permite recopilar clientes potenciales más detallados y cualificados.
Pero, ¿cómo saber qué aspecto tiene un buen formulario de varios pasos?
Hemos pasado años construyendo y estudiando estos formularios, y hemos reunido nuestros 10 mejores ejemplos favoritos de formularios multipaso de todo Internet.
No hay duda: estos formularios multipaso convierten como locos.
Tabla de contenidos
11 – “¿Publicar un empleo?”, por Khoros
Este formulario de Khoros apenas roza la lista, pero queríamos destacar algunos elementos de UX que nos han gustado:
Lo que nos gustó:
- Hay una clara sensación de progresión entre los pasos
- Los pasos se alargan a medida que avanza el formulario (a medida que se impone la falacia del coste hundido)
Lo que probaríamos:
- Pedir el correo electrónico en el primer paso es una amenaza bastante alta y podría desanimar a algunos visitantes. En su lugar, intentaríamos poner la dirección de correo electrónico en último lugar y volver a dirigirnos a los visitantes que no completen el primer paso.
- El formulario transmite poco valor: “¿Está listo para una demostración?” es un titular poco convincente.
Además de ser un buen ejemplo de un formulario de varios pasos, también es un buen ejemplo de incorporación basada en el producto.
10 – “¿Quieres más tráfico SEO?”, por Neil Patel
No es de extrañar que Neil Patel haya entrado en la lista: lleva años siendo una potencia del marketing y nunca desaprovecha ni un solo visitante u oportunidad de conversión.
Neil y su equipo nos dan una gran razón para empezar a rellenar el formulario de varios pasos: un plan de acción SEO de 7 semanas, entregado directamente a nuestra bandeja de entrada.
La primera información que se nos pide es nuestro sitio web, una “pregunta” agradable y sin fricciones, ya que será necesaria para proporcionar el informe gratuito.
Fíjese cómo el formulario pregunta a menudo por los beneficios que esperamos recibir, y la recogida de información siempre está justificada:
Lo que nos gustó:
- Diseño muy limpio
- Gran justificación de la recogida de datos
- Las preguntas tranquilizan al usuario y proporcionan información útil sobre el presupuesto y la cualificación.
Lo que probaríamos:
- Pedir un número de teléfono es un poco descarado, ¡pero seguro que lo han probado!
¿Quieres crear un formulario como éste? Growform te lo pone fácil – prueba gratis prueba gratuita de 14 días .
9 – “A 2 pasos”, por TeamGantt
En lugar de sentirse como un formulario de registro independiente, este formulario se siente como parte del producto. El fondo borroso deja claro que sólo hay una cosa que se interpone entre tú y tu nuevo y reluciente gráfico de Gannt, y tienes que hacerlo ya.
Los redactores también sabían lo que hacían: cada dato que se cede tiene una finalidad y un beneficio claros; por ejemplo, al añadir una contraseña, “Proteja su cuenta con una contraseña y obtenga planificación”:
Lo que nos gustó:
- Buena validación en línea. No habrá un aluvión de mensajes de error al final del formulario.
- Microcopy sólido y orientado a los beneficios
- Diseño limpio, sencillo y cuidado
Lo que probaríamos:
- Los usuarios que se registran en su producto están bastante motivados. TeamGantt probablemente podría haberse librado de pedir más información entre los pasos 1 y 2.
8 – Presupuesto de seguro fácil de Lemonade.com
Estamos divididos sobre las formas conversacionales. Mal ejecutados, pueden parecer condescendientes, fuera de lugar y… tan 2017.
Pero si se hacen bien, pueden convertir su sitio web en una experiencia y hacer que una marca le hable literalmente, como un ejército de vendedores adorables y accesibles.
Si todo esto le parece una tontería, eche un vistazo a este ejemplo: La forma conversacional multipaso de Lemonade:
Lo que nos gustó:
- Un enfoque fresco y conversacional que encaja con la marca.
- Un recordatorio bueno y claro del beneficio que recibe el usuario (“Te conseguiré un precio increíble en minutos”).
- Buen uso de campos de formulario no estándar, como el autocompletado de direcciones de Google.
- Por último, las preguntas de alto riesgo (dirección de correo electrónico, fecha de nacimiento, casillas de verificación de las condiciones del servicio).
Lo que probaríamos:
- Añade una mejor sensación de progreso a medida que completas los pasos: no queda claro si quedan 4 pasos o 40.
7 – La elegante incorporación de Thread.com
El equipo de Thread hace que darse de alta en su servicio sea sencillo, atractivo y divertido. Y la interfaz de usuario de este formulario está especialmente cuidada, con botones y campos nítidos y claros.
Nunca se nos pide demasiada información, y las cifras se solicitan como intervalos y no como cifras exactas.
Cuando Thread quiere saber el color de nuestros ojos, nos pide que pulsemos la representación visual del color, en lugar de hacernos leer una larga lista:
Lo que nos ha gustado
- Se nos explica exactamente por qué es importante cada dato
- Rellenar el formulario tiene un claro resultado (léase: beneficio): ¡un nuevo armario!
- Gran uso de componentes a medida (selectores de color)
Qué probaríamos
- No hay una gran sensación de progreso, por lo que el formulario empieza a parecer un poco “interminable” – prueba con una barra de progreso o indicadores.
- La validación debe señalar exactamente dónde ha omitido un usuario un campo, en lugar de hacerle adivinar.
6 – Oferta especial de Hello Fresh
El formulario de Hello Fresh es una lección de redacción y diseño de formularios. Articulan claramente la propuesta de valor en el paso 1, para que los usuarios no tengan ninguna duda de lo que hace el servicio.
Los cálculos en el propio formulario muestran al usuario exactamente cuánto está ahorrando, lo que anima a hacer cestas más grandes:
Lo que nos ha gustado
- Se trata de un formulario complejo bien entregado: el usuario podría seleccionar entre 12 combinaciones de “número de personas” y “recetas por semana”, pero aquí no hay agobio.
- En el texto H1 no se escatiman esfuerzos: seguro que el equipo de Hello Fresh ha probado descuentos y sabe lo que funciona.
Qué probaríamos
- Estaríamos tentados de probar algunas representaciones visuales de las cajas: “recetas por semana” podría prestarse muy bien a una ilustración que mostrara las diferencias entre las casillas.
- En los móviles (probablemente más del 50% de su tráfico), no hay representación gráfica de lo que es un recetario, lo que podría llevar a una falta de claridad y a una disminución de las tasas de conversión.
5 – “Empecemos a contratar”, de Toptal
Esta forma existe desde hace unos años y, de hecho, es una de las primeras que nos inspiró. Aparece como una superposición en la “intención de salida” como un último intento desesperado de conseguir que los usuarios se comprometan.
Es clara, accesible y tiene una excelente barra de progreso para tranquilizar al usuario y hacerle saber que se acerca al final. Los logotipos de clientes en escala de grises añaden credibilidad a la marca sin distraer demasiado:
Lo que nos ha gustado
- Un formulario sencillo y eficaz con transiciones agradables y un diseño sólido.
Qué probaríamos
- No siempre está claro por qué Toptal nos pide información sobre cada paso.
- El sarcástico texto de “cerrar” (“No, gracias – No voy a contratar”) nos recuerda a esas molestas ventanas emergentes:“¡No, odio ahorrar dinero!“. Aún no hemos visto ningún estudio que demuestre que mejoran la tasa de conversión, así que una simple “X” en la esquina superior derecha sería suficiente.
4 – Creador de términos y condiciones de Termly
Una de las grandes ventajas de los formularios multipaso es que permiten reducir una solicitud de información abrumadora y casi inmanejable a algo casi inmanejable. alegre.
No hay nada más árido e inmanejable que hacer preguntas legales para generar una política de términos y condiciones, y Termly hizo un gran trabajo.
Es agradable presentar un formulario tan complejo, ya que sabemos que la mayoría de los formularios serán mucho más fáciles y sencillos de construir que éste.
Lo que nos ha gustado
- Jerarquía de información clara.
- Resultados claros (el usuario puede ver una vista previa de su documento a medida que avanza).
- Interfaz de usuario agradable, sencilla y coherente.
Qué probaríamos
- Añada validación al formulario para asegurarse de que los usuarios rellenan cada paso a medida que avanzan. Obligar a los usuarios a hacerlo todo al final aumenta las posibilidades de distracción.
- Es de esperar que los elementos de la izquierda de la página se conviertan en una “lista de comprobación” a medida que el usuario avanza por el formulario.
Qué probaríamos
- No hay posibilidad de volver atrás, lo que molestará a un pequeño porcentaje de usuarios.
- “Ya casi” como CTA es divertido y transmite una sensación de progreso, pero no consigue transmitir lo que hace el botón. Lo cambiaríamos por un botón coherente y añadiríamos una barra de progreso.
3 – “Encontrar al profesional perfecto”, por Bark
El sector de la construcción no se caracteriza por la belleza de sus formas, y quizá por eso la forma escalonada de Bark resulta tan refrescante. Bark ha tomado un sector plagado de sitios web sin capacidad de respuesta y difíciles de usar y ha creado algo hermoso.
Este formulario a medida hace un gran uso del autocompletado, la búsqueda de códigos postales y mucho más. Incluso el efecto de relajación de la barra de progreso es una delicia.
Lo que nos ha gustado
- Interfaz muy limpia
- Clara sensación de progreso
- Prácticamente sin distracciones
- Aquí están pasando muchas cosas: es casi seguro que este formulario se carga desde un backend que proporciona la pregunta adecuada para hacer a continuación… ¡Inteligente!
Qué probaríamos
- Estaría bien ver un mejor uso de la iconografía y las imágenes, pero ya vemos por qué no se han incluido.
- Es difícil sugerir algo más: ¡es casi la perfección de la forma multipaso!
2 – KlientBoost: “¿Con qué necesitas ayuda?”
Klientboost fue uno de los primeros defensores de la forma multipaso, por lo que no es de extrañar que aparezcan en esta lista.
En este formulario, la redacción inteligente se combina con un bonito diseño: es un ejemplo impresionante, uno de los mejores formularios multipaso que hemos visto:
Lo que nos gustó:
- Titulares y textos claros y orientados a los beneficios. El formulario pregunta a los usuarios cómo puede ayudarles, y no al revés. Sigue el principio de quid pro quo.
- Uso inteligente de la tecnología para rellenar previamente la información siempre que sea posible.
- Ofrece a los usuarios una “salida” si prefieren llamar. Si conocemos Klientboost, estas llamadas también serán rastreadas.
Lo que probaríamos:
- Apostaríamos a que unos cuantos visitantes escriben su nombre en la dirección de correo electrónico, sólo para verlo invalidado. Considere la posibilidad de utilizar una casilla de nombre + apellido, o de pedir sólo el nombre.
1 – “Construye tu Boxt”, de Boxt
Si alguna vez ha intentado pedir un calentador de agua de repuesto, sabrá lo frustrante que puede ser. Puedes pasarte horas reuniendo presupuestos de instaladores y persiguiéndoles para conseguir fechas de entrega. Boxt cambió todo eso, haciendo que pedir una caldera nueva fuera superfácil con su formulario de varios pasos.
Nos encanta cómo este formulario proporciona la información “justa” a primera vista para parecer sencillo e intuitivo, a la vez que ofrece siempre más información a un clic, un toque o al pasar el ratón por encima.
Está claro que el equipo ha estudiado a fondo cada parte del proceso, eliminando fricciones y dudas en la medida de lo posible y añadiendo claridad. Boxt va a contracorriente mostrando un precio “en la pared” en su forma, en lugar de un precio que aumentará más adelante.
Un saludo a Zone Digital, que, según tenemos entendido, ha creado este formulario.
Lo que nos ha gustado
- Se trata del mejor formulario multipaso de su clase. Es clara y fácil de navegar, hace preguntas sensatas y pertinentes y muestra muy bien el progreso del usuario.
- Perfectamente adaptable: se ve igual de bien en la tableta o el móvil
- Se trataba de un esfuerzo integral: Boxt podría haber creado un fantástico formulario de varios pasos, pero seguir teniendo precios misteriosos o ninguna reseña. Han trabajado sistemáticamente en cada parte de su propuesta de valor para ofrecer una experiencia de grado A.
Qué probaríamos
- En lugar de pedir al usuario que introduzca la “primera parte” de su código postal, considere la posibilidad de obtener el código postal completo y dividirlo para él.
- ¡Ya está!
¿Necesita su propio formulario de varios pasos?
Si estos formularios te han servido de inspiración, quizá te preguntes cómo puedes crear tu propio formulario multipaso.
Tradicionalmente, los formularios de varios pasos son muy difíciles de crear: si se tienen en cuenta las reglas de validación, las integraciones y el mantenimiento, pueden costar miles de dólares en desarrollo personalizado.
Por suerte, Growform facilita la creación de formularios multipaso, sin necesidad de desarrolladores:
La herramienta se creó desde cero para ayudarle a crear formularios multipaso de alto rendimiento, e incluso incluye una prueba gratuita de 14 días.