Átomo Social: Formulario
Átomo Social: Formulario
Los formularios son conjuntos de campos que permiten recabar información con un mayor detalle de los participantes en un curso. El átomo Formulario de Bloom es una extensión del átomo Texto Libre, pero a diferencia del anterior, el Formulario permite estructurar y validar los campos de información que el usuario completa.
Con este formulario podrás sustituir herramientas externas para captura de información como Google Forms o Typeform y así tener todos tus recursos educativos en un mismo lugar, con la ventaja adicional de capturar las respuestas de tus usuarios en tiempo real y tenerlas accesibles desde el mismo formulario y para su descarga en CSV.
En este tutorial podrás aprender cómo personalizar este átomo social e integrarlo a una molécula de aprendizaje para tus cursos en línea en Yeira.
Partes de un Formulario Bloom
Las opciones disponibles en un formulario Bloom son:
- Campo de texto corto
- Campo de texto largo
- Etiquetas
- Selector de opciones (Dropdown)
- Opción múltiple (Radio Buttons)
- Selector de fecha (Date Picker)
- Switch Sí/No
- Rating
- Selección múltiple (Checkboxes)
En el Markup de Bloom, un formulario se define de la siguiente manera:
- Note:
id: F1
canUpdate: false
submitted:
- subtitle: Gracias por completar el formulario
form:
- label: Nombre del Campo
- type: text
- help: Ayuda del Campo
Donde - Note: ` es el **átomo** y el `id: F1 es el identificador único para el registro de datos en el sistema de Learning Analytics de Bloom.
id por cada átomo `- Note: ` creado para lograr un registro de datos correcto.submitted: es un atributo que nos permite desplegar un contenido adicional de cualquier tipo una vez que el formulario se envía.
Para activar las funciones de formulario es necesario agregar el atributo form: , dentro del cual podemos agregar una lista de campos de acuerdo a las descripciones que a continuación se muestran.
Campos y Atributos:
Los formularios se construyen con campos, que a su vez cuentan con ciertos atributos comunes y algunos **atributos específicos. **
Entre los atributos comunes se tienen las etiquetas o descripciones de cada campo en el atributo label:, las cuales también se utilizan como referencias para recuperar la información capturada en el módulo de Learning Analytics, y un campo con un mensaje de ayuda para el llenado del campo, a través del atributo help:.
El atributo canUpdate: cuando tiene el valor true permite al estudiante o usuario regresar a modificar los datos del formulario. En caso contrario los datos enviados pueden consultarse pero no modificarse.
La mayoría de los tipos de campos cuentan con la posibilidad de obligar su respuesta mediante el atributo required:. En este caso se mostrará al lado de la etiqueta del campo un símbolo *
Los tipos de campos disponibles en un formulario son los siguientes:
- Texto corto
- Texto largo
- Casilla de Verificación
- Selectores
- Listas de Opciones
- Palabras Clave
- Fecha y Hora
- Rate
- Switch
- Markup
A continuación veamos cada uno de los campos disponibles y sus atributos.
Texto corto
El campo de texto corto permite agregar una entrada en una sola línea de texto. Veamos el siguiente ejemplo:
El markup para definir este campo es el siguiente:
- Note:
id: F1
form:
- label: Dirección
type: input
required: true
maxlength: 20
help: Agrega tu dirección, incluyendo el código postal.
En este tipo de campo es posible limitar el número de caracteres de entrada de un campo de texto con el atributo maxlength. También se puede agregar el atributo required: true para indicar que este campo debe ser llenado de manera obligatoria.
Texto largo
El campo de texto largo permite agregar una entrada en varias línea de texto. Veamos el siguiente ejemplo:
El markup para definir este campo es el siguiente:
- Note:
id: F1
form:
- label: Descripción
type: textarea
required: true
maxlength: 20
help: Agrega una descripción con más detalle
En este tipo de campo es posible limitar el número de caracteres de entrada de un campo de texto con el atributo maxlength. También se puede agregar el atributo required: true para indicar que este campo debe ser llenado de manera obligatoria.
Casilla de Verificación
El campo de casilla de verificación permite añadir una casilla simple para marcar un valor (cierto / falso).
El markup para definir este campo es el siguiente:
- Note:
id: F1
form:
- label: ¿Has participado en un curso en línea anteriormente?
type: checkbox
En este tipo de campo se puede agregar el atributo required: true para indicar que este campo debe ser llenado de manera obligatoria.
Selectores
El campo de Selectores permite añadir un grupo de opciones mutuamente excluyentes (radio buttons).
El markup para definir este campo es el siguiente:
- Note:
id: F1
form:
- label: Escolaridad
type: radio
options:
- Preparatoria
- Licenciatura
- Maestría
- Doctorado
required: true
help: Indica tu grado máximo de estudios concluídos
En este tipo de campo se puede agregar el atributo required: true para indicar que este campo debe ser llenado de manera obligatoria.
Listas de Opciones
El campo de Listas de Opciones permite añadir menú desplegable con varias opciones a seleccionar. La ventaja respecto al tipo de campo previo, Selectores, es que tiene una vista más compacta.
El markup para definir este campo es el siguiente:
- Note:
id: F1
form:
- label: Escolaridad
type: select
options:
- preparatoria
- licenciatura
- maestría
- doctorado
required: true
help: Indica tu grado máximo de estudios concluídos
En este tipo de campo se puede agregar el atributo required: true para indicar que este campo debe ser llenado de manera obligatoria.
Palabras Clave
El campo de Palabras Clave permite incluir textos clave breves en la forma de etiquetas. El usuario puede decidir libremente cada concepto a agregar.
El markup para definir este campo es el siguiente:
- Note:
id: F1
form:
- label: Temas de interés
type: tags
max: 5
required: true
help: Agrega uno o varios temas de tu interés
En este tipo de campo se puede agregar el atributo required: true para indicar que este campo debe ser llenado de manera obligatoria. El atributo max permite limitar el número de palabras clave que pueden agregarse. Además se puede agregar el atributo required: true para indicar que este campo debe ser llenado de manera obligatoria.
Fecha y Hora
El campo de Fecha y Hora permite agregar valores en el tiempo en tres formatos, Fecha, Hora y Fecha + Hora.
El markup para definir este campo es el siguiente:
- Note:
id: F1
form:
- label: Fecha de graduación
type: date
required: true
help: Indica la fecha en que concluiste tus estudios.
Los tres tipos posibles de este campo son date, time, y datetime, que corresponden a Fecha, Hora y Fecha + Hora.
En este tipo de campo se puede agregar el atributo required: true para indicar que este campo debe ser llenado de manera obligatoria.
Rate
El campo de Rate permite capturar una opinión mediante estrellas, desde un valor de 1 hasta un valor determinado.
El markup para definir este campo es el siguiente:
- Note:
id: F1
form:
- label: ¿Qué te ha parecido este curso
type: rate
max: 5
required: true
help: Compártenos tu valoración sobre el curso
En este tipo de campo se puede agregar el atributo required: true para indicar que este campo debe ser llenado de manera obligatoria. Además es posible definir el número máximo de estrellas de este campo con el atributo max
Switch
El campo de switch permite añadir un interruptor simple para marcar un valor (cierto / falso), agregando etiquetas diferentes dependiendo del estado del campo.
El markup para definir este campo es el siguiente:
- Note:
id: F1
form:
- label: ¿Has participado en un curso en línea anteriormente?
type: switch
true: Si
false: No
required: true
help: Indica si has participado con anterioridad en un curso en línea
En este tipo de campo se puede agregar el atributo required: true para indicar que este campo debe ser llenado de manera obligatoria.
Markup
Este campo es un mecanismo para insertar en cualquier parte del formulario otros contenidos de Bloom, ya sea átomos individuales con materiales diversos o explicaciones para ayudar en el llenado de los campos.
El markup para definir este campo es el siguiente:
- Note:
id: F1
form:
- type: markup
content:
- subtitle pt-3 has-text-left: Condiciones generales
- has-text-left: Estas son nuestras condiciones generales de uso de contenido.
Este campo no cuenta con un atributo label:, y utiliza el atributo content: para insertar el contenido que se requiera.
Despliegue de Datos
Una vez que se recaba la información de todos los participantes dentro del formulario, es posible consultar en dos niveles, el primero a nivel del Datastore de todo el contenido. En este caso toda la información recabada aparece en un único campo condensado.
El segundo nivel de consulta se puede acceder en el botón de acceso a datos del formulario, ubicado al lado del botón de enviar. En este nivel de consulta se muestra un desglose de todos los campos, además de que se cuenta con opciones para el filtrado y ordenado de todos los campos, y la descarga de la información en formato CSV.
Además los usuarios pueden consultar la información que enviaron en el formulario cuando regresan al contenido, y dependiendo del campo canUpdate:, modificar la misma.
Actualizado el: 02/08/2022
¡Gracias!