...
| UI Steps |
|---|
| UI Step |
|---|
Elección de plantillaTras haber pulsado sobre "+ CREAR NUEVO H5P", se nos abre la ventana de selección de plantilla. Elegimos la plantilla "Arrastrar y soltar (Drag and Drop)". 
|
| UI Step |
|---|
EditorAhora debería aparecer el editor de arrastrar y soltar. El editor debería verse así: 
|
| UI Step |
|---|
Configuración
En configuración podemos añadir una imagen de fondo y especificar las dimensiones (en px) del área de juego. Para seguir al siguiente paso, pulsamos sobre "Tarea" |
| UI Step |
|---|
TareaEn esta pestaña configuramos las zonas de colocación[1] (zona en la ventana de la tarea donde podemos arrastrar los elementos), así como los textos[2] e imágenes[3] que se pueden arrastrar. 
| UI Expand |
|---|
| En primer lugar, pulsamos sobre este icono para agregar y editar la primera zona de colocación. Para añadir más zonas de colocación, pulsaremos este mismo icono.
Tras pulsar el icono, se nos muestra una ventana como la siguiente: | Column |
|---|
|
| Column |
|---|
Configuraciones: - Etiqueta: nombre de la zona de colocación.
- Mostrar etiqueta
- Opacidad del Fondo: del 0 al 100, siendo 0 transparente y 100 opaco.
- Esta zona de colocación solo puede contener un elemento: solo existe una respuesta correcta para esta zona.
- Habilitar alineación automática: al activar esta casilla, se alinearán automáticamente todos los elementos colocados en esta zona.
|
| Column |
|---|
|
| Column |
|---|
La ventana "Pistas y retroalimentación", nos brinda tres herramientas opcionales: 1. Texto de pista: en esta casilla, escribimos una pista para el usuario que aparecerá antes de que el usuario compruebe sus respuestas. 2. Mensaje mostrado en coincidencia correcta: El mensaje aparecerá debajo de la tarea en "revisar" si el elemento colocado es el correcto.
3. Mensaje mostrado en coincidencia incorrecta: El mensaje aparecerá debajo de la tarea en "comprobar" si el elemento colocado es incorrecto. |
|
|
| ui-expand |
|---|
| Para agregar un texto, pulsamos sobre el icono  Image Added
Tras pulsar el icono, se nos muestra una ventana como la siguiente: | Column |
|---|
 Image Added
|
| Column |
|---|
Configuraciones: - Texto: texto que se puede arrastrar a las zonas de colocación.
- Seleccionar zonas de colocación: marcamos las casillas de las zonas en las que queremos que sea posible situar el texto.
- Opacidad del Fondo: del 0 al 100, siendo 0 transparente y 100 opaco.
- Número infinito de instancias de elementos: Clonar este elemento para que pueda ser arrastrado a múltiples zonas de colocación.
|
|
| ui-step |
|---|
Configuración del comportamiento| Column |
|---|
|
|
| UI Step |
|---|
Retroalimentación globalLumi nos da la opción de mostrar un mensaje de retroalimentación al finalizar la tarea. Podemos personalizar el mensaje en base a la puntuación que ha obtenido el alumno. Ejemplo: 0-20% Mala puntuación, 21-91% Puntuación Media, 91-100% ¡Puntuación Estupenda! 
|
| UI Step |
|---|
ExportaciónTras haber completado la tarea en el editor, procederemos a exportarla en HTML, pulsando sobre [Archivo>Exportar] situado en la esquina superior izquierda de la pantalla.
Se nos mostrará la siguiente ventana: 
Dejamos todos los valores por defecto, simplemente pulsamos "EXPORTAR AHORA". |
|
...
