Descripción general
NueForm te permite construir formularios interactivos y atractivos que presentan una pregunta a la vez. Esta guía cubre todo, desde crear tu primer formulario hasta configurar ajustes avanzados como modos de cuestionario y envío incremental.
Crear un nuevo formulario
Para crear un nuevo formulario:
- Navega a Mis formularios desde el panel de control.
- Haz clic en el botón Nuevo formulario.
- Elige entre un NueForm (formulario estándar) o un Fuse (actividad colaborativa en tiempo real).
- Dale a tu formulario un título y una descripción opcional.
- Comienza a agregar preguntas desde la paleta de tipos de preguntas.
Cada formulario recibe automáticamente un slug único para su URL pública. Puedes personalizar este slug en cualquier momento desde la configuración del formulario.
Configuración del formulario
Configuración básica
| Ajuste | Descripción | Predeterminado |
|---|---|---|
| Title | El título del formulario, mostrado en el panel de control y opcionalmente en la pantalla de bienvenida. | Obligatorio |
| Description | Una descripción opcional para referencia interna. | Vacío |
| Slug | La ruta de URL para tu formulario publicado (por ejemplo, nueform.io/f/mi-encuesta). Debe ser único. | Auto-generado |
| Show Progress Bar | Muestra una barra de progreso indicando cuánto ha avanzado el encuestado. | Habilitado |
| Limit One Response | Restringe cada visitante a un solo envío usando identificación de visitantes basada en navegador. | Deshabilitado |
| Incremental Submission | Guarda respuestas parciales a medida que el encuestado avanza, para que los datos se capturen incluso si abandona el formulario. | Deshabilitado |
Pantalla de bienvenida
La pantalla de bienvenida es lo primero que ven los encuestados cuando abren tu formulario. Configúrala con:
| Campo | Descripción | Predeterminado |
|---|---|---|
| Welcome Title | El encabezado mostrado en la pantalla de bienvenida. Déjalo vacío para omitir la pantalla de bienvenida. | Vacío (sin pantalla de bienvenida) |
| Welcome Description | Texto de apoyo debajo del título. Soporta formato de texto enriquecido. | Vacío |
| Welcome Button Text | La etiqueta del botón que inicia el formulario. | "Start" |
Si dejas el título de bienvenida vacío, los encuestados saltarán directamente a la primera pregunta. Esto es útil para formularios incrustados o encuestas rápidas.
Pantalla de agradecimiento
La pantalla de agradecimiento aparece después de que un encuestado envía el formulario.
| Campo | Descripción | Predeterminado |
|---|---|---|
| Thank You Title | El encabezado mostrado después del envío. | "Thank you!" |
| Thank You Description | Texto de apoyo debajo del título. Soporta formato de texto enriquecido y sustitución de variables. | Vacío |
Puedes usar la sintaxis {variableName} en la descripción de agradecimiento para mostrar contenido personalizado basado en las respuestas del encuestado. Consulta la guía de Variables para más detalles.
Modos de formulario
NueForm soporta cuatro modos de formulario distintos, cada uno diseñado para un propósito diferente. El modo se establece a nivel de formulario y afecta cómo se puntúan las respuestas y cómo se comportan las pantallas finales.
Modo estándar
El modo predeterminado para encuestas, formularios de contacto, recopilación de comentarios y cualquier formulario que no requiera puntuación.
- Sin puntuación ni calificación.
- Las respuestas se recopilan y muestran tal cual.
- Las pantallas finales son puramente informativas.
Modo cuestionario de conocimiento
Diseñado para cuestionarios, pruebas y evaluaciones donde hay respuestas correctas e incorrectas.
- Cada pregunta puntuable (selección múltiple, desplegable, selección con imagen, sí/no, legal, escala de opinión, valoración) puede tener respuestas correctas definidas.
- Se otorga una puntuación por respuesta correcta (predeterminado: 1 punto) por cada respuesta correcta.
- Se puede mostrar retroalimentación del cuestionario después de cada pregunta con mensajes personalizables.
- Se calculan y almacenan la puntuación final, el número de respuestas correctas y el total de preguntas puntuables.
Configuración del cuestionario:
| Ajuste | Descripción | Predeterminado |
|---|---|---|
| Show Correct Answers | Muestra retroalimentación inmediata después de cada pregunta indicando al encuestado si acertó o no. | Habilitado |
| Correct Feedback Text | Mensaje personalizado cuando el encuestado responde correctamente. Máximo 100 caracteres. | "Correct!" |
| Incorrect Feedback Text | Mensaje personalizado cuando el encuestado responde incorrectamente. Máximo 100 caracteres. | "Incorrect!" |
Configuración de puntuación (por pregunta):
- Correct Answers (
correctAnswers): Un array de IDs de opciones que constituyen la respuesta correcta. Para preguntas de respuesta única, contiene un ID. Para preguntas de selección múltiple, se deben seleccionar todos los IDs correctos. - Correct Answer Score (
correctAnswerScore): Puntos otorgados por una respuesta correcta. Predeterminado: 1.
Modo calificación de leads
Diseñado para puntuación de leads, evaluaciones de personalidad y formularios donde diferentes respuestas tienen diferentes valores de puntos.
- Cada opción en una pregunta puntuable tiene un valor de puntos asignado (
choiceScores). - Los puntos se acumulan a medida que el encuestado avanza.
- Se pueden configurar múltiples pantallas finales con rangos de puntuación, y el encuestado es dirigido a la pantalla final apropiada según su puntuación total.
Configuración de puntuación (por pregunta):
- Choice Scores (
choiceScores): Un mapeo de ID de opción a valor de puntos. Por ejemplo:{ "choice_1": 10, "choice_2": 5, "choice_3": 0 }.
Configuración de pantalla final:
- Cada pregunta
end_screenpuede tener una propiedadscoreRangecon valoresminymax. - Después del envío, el sistema empareja la puntuación total con la pantalla final apropiada.
Modo cuestionario de coincidencia
Diseñado para cuestionarios de personalidad, formularios estilo "¿Qué personaje eres?" y evaluaciones basadas en resultados.
- Cada opción se mapea a uno o más resultados de pantalla final (
choiceOutcomes). - A medida que el encuestado responde, los conteos se acumulan para cada resultado.
- Se muestra la pantalla final con el conteo más alto.
Configuración de puntuación (por pregunta):
- Choice Outcomes (
choiceOutcomes): Un mapeo de ID de opción a un array de IDs de preguntas de pantalla final. Por ejemplo:{ "choice_1": ["end_screen_a", "end_screen_b"], "choice_2": ["end_screen_c"] }.
En todos los modos de cuestionario, solo los tipos de preguntas puntuables participan en la puntuación: Selección múltiple, Desplegable, Selección con imagen, Sí/No, Legal, Escala de opinión y Valoración.
Preguntas de pantalla final
En los modos de cuestionario (conocimiento, calificación de leads, coincidencia), puedes agregar múltiples preguntas end_screen a tu formulario. Estas actúan como finales condicionales:
- Cuestionario de conocimiento: La pantalla final se selecciona según la puntuación del encuestado.
- Calificación de leads: Cada pantalla final tiene un
scoreRange(mín/máx), y el rango coincidente determina qué pantalla se muestra. - Cuestionario de coincidencia: Cada pantalla final acumula conteos de los resultados de las opciones, y la que tiene el conteo más alto gana.
Las preguntas de pantalla final se colocan en la lista de preguntas pero no se muestran durante el flujo del formulario. Solo aparecen al final, reemplazando la pantalla de agradecimiento predeterminada.
Agregar preguntas
Las preguntas se agregan desde la Paleta de tipos de preguntas en el lado izquierdo del constructor de formularios. Las preguntas se organizan en categorías:
- Texto: Texto corto, Texto largo, Correo electrónico, Teléfono, Número, Sitio web
- Selección: Selección múltiple, Desplegable, Selección con imagen, Sí/No
- Valoración: Valoración, Escala de opinión, Net Promoter Score
- Fecha: Fecha
- Multimedia: Subida de archivos, Dibujo, Grabación de video/audio, Firma
- Diseño: Declaración, Pantalla de bienvenida, Pantalla final, Resumen, Guardar respuestas, Grupo de preguntas, Página multi-pregunta, Markdown
- Avanzado: Legal/Términos, Clasificación, Matriz, Pago, Información de contacto, Dirección
Consulta la sección de Tipos de preguntas para documentación detallada de cada tipo.
Propiedades de preguntas
Cada pregunta comparte un conjunto de propiedades comunes:
| Propiedad | Descripción |
|---|---|
| Title | El texto de la pregunta mostrado al encuestado. Soporta texto enriquecido (negrita, cursiva, subrayado, enlaces) y sustitución {variable}. |
| Description | Texto de ayuda opcional mostrado debajo del título. Soporta texto enriquecido y sustitución de variables. |
| Required | Si el encuestado debe responder esta pregunta antes de continuar. |
| Hidden | Si la pregunta está oculta del encuestado (útil para lógica interna). |
| Custom Class Name | Un nombre de clase CSS opcional aplicado al contenedor de la pregunta para estilos personalizados. |
| Hide Question Number | Elimina el prefijo del número de pregunta (por ejemplo, "1 ->") de la visualización. |
| Transition | La animación usada al transicionar a esta pregunta. Opciones: Deslizamiento vertical (predeterminado), Deslizamiento horizontal, Deslizamiento diagonal, Rebote elástico, Zoom a través, Rotación de entrada. |
| Answer Variable | Almacena la respuesta del encuestado como una variable nombrada para uso en sustitución {variable} en preguntas posteriores. |
Adjuntos multimedia
Cada pregunta soporta adjuntos multimedia opcionales. Puedes agregar imágenes, videos, iconos o códigos QR a cualquier pregunta.
Tipos de multimedia:
| Tipo | Descripción |
|---|---|
| Image | Sube una imagen o proporciona una URL externa. Soporta ajustes de brillo, contraste, saturación, rotación de tono y desenfoque. |
| Video | Incrusta un video de YouTube o Vimeo con opciones de reproducción automática, silencio, bucle y controles. |
| Icon | Elige entre miles de react-icons con color personalizable. |
| QR Code | Genera un código QR desde una plantilla de URL que soporta sustitución {variable}. |
Opciones de diseño (Escritorio):
| Diseño | Descripción |
|---|---|
stack | El multimedia aparece encima del contenido de la pregunta (predeterminado). |
split-left | Multimedia a la izquierda, pregunta a la derecha, en diseño lado a lado. |
split-right | Multimedia a la derecha, pregunta a la izquierda. |
float-left | El multimedia flota a la izquierda del texto de la pregunta. |
float-right | El multimedia flota a la derecha del texto de la pregunta. |
background | El multimedia aparece como fondo detrás de la pregunta. |
fullscreen-fit | El multimedia llena la pantalla manteniendo la relación de aspecto. |
fullscreen-cover | El multimedia cubre toda la pantalla, recortando según sea necesario. |
Opciones de diseño (Móvil):
| Diseño | Descripción |
|---|---|
stack | El multimedia aparece encima de la pregunta (predeterminado). |
hidden | El multimedia se oculta en dispositivos móviles. |
background | El multimedia aparece como fondo. |
fullscreen-fit | El multimedia llena la pantalla manteniendo la relación de aspecto. |
fullscreen-cover | El multimedia cubre toda la pantalla. |
Ajustes de imagen:
| Ajuste | Rango | Predeterminado |
|---|---|---|
| Brightness | -100 a 100 | 0 |
| Contrast | 0 a 200 | 100 |
| Saturation | 0 a 200 | 100 |
| Hue Rotate | 0 a 360 grados | 0 |
| Blur | 0 a 20 px | 0 |
Punto focal: Establece un punto focal (coordenadas normalizadas 0-1) para controlar qué parte de la imagen permanece visible al recortarse.
Presentaciones
Puedes adjuntar múltiples elementos multimedia a una sola pregunta para crear una presentación de diapositivas. La configuración de presentaciones incluye:
| Ajuste | Descripción | Predeterminado |
|---|---|---|
| Duration | Segundos por diapositiva. | 5 |
| Transition | Animación entre diapositivas: crossfade, slide, zoom, flip, ken-burns, blur-fade. | crossfade |
| Autoplay | Avanzar diapositivas automáticamente. | Habilitado |
| Show Indicators | Mostrar indicadores de puntos debajo de la presentación. | Habilitado |
| Show Arrows | Mostrar flechas anterior/siguiente. | Deshabilitado |
| Pause on Hover | Pausar la reproducción automática cuando el usuario pasa el cursor sobre la presentación. | Habilitado |
Orden de las preguntas
Las preguntas se muestran a los encuestados en el orden en que aparecen en el constructor. Puedes reordenar las preguntas arrastrándolas en el panel de navegación de preguntas en el lado izquierdo del constructor.
Guardar y publicar
Los formularios se guardan automáticamente a medida que realizas cambios. Para hacer un formulario disponible para los encuestados, debes publicarlo. Consulta la guía de Publicación para detalles sobre el flujo de publicación.