Idioma: Español
Fecha: Subida: 2021-07-08T00:00:00+02:00
Duración: 4m 41s
Lugar: Espinardo - ATICA - Estudio ODA
Lugar: Videotutoriales
Visitas: 2.122 visitas

Cómo crear contenido interactivo H5P: Imagen con puntos de información

Docencia Digital: Contenidos Interactivos con H5P y LUMI

Descripción

Cómo crear contenido interactivo H5P: Imagen con puntos de información.
Acceso a LUMI. Crear nuevo H5P. Buscar y seleccionar contenido hotspots de imagen.
Completar y configurar los campos. Metadatos.
Configuración comportamiento.
Indicar instrucciones actividad.
Insertar imagen y seleccionar zona interactiva.
Guardar.
Vista previa.
Exportar HTML para poder subir a la herramienta Recursos del Aula Virtual y/o enlazarlos desde la herramienta Contenidos del Aula Virtual.

Transcripción (generada automáticamente)

Si queremos crear un contenido interactivo para nuestros estudiantes, por ejemplo, pero una imagen con diferentes puntos de información para que según vayan pasando y pulsando sobre ella les vaya dando información sobre esas partes de la imagen lo podemos hacer con el elemento, con la ayuda de lo que tenemos aquí abierto. Programa la aplicación de escritorio un elemento de H, cinco b, que si buscamos a un punto de acceso, se llama hot, pot de imagen. Para ello, si no tenemos instalar instalada la instalaremos como hemos ya está instalada, pulsa haremos aquí en el detalle para poder verla, y aquí como siempre nos va a brindar el formulario que recordar que todos los apartados tienen una actriz y vamos a poner aquí por ejemplo puntos de acceso puntos de información añadiremos como no una imagen, la cual vamos a añadir nuestra imagen para ir poniéndole los diferentes puntos de acceso. Como hoy tenemos la opción también de editar la imagen, si necesitamos recortarla o hacer por ejemplo un recorte a la imagen que queremos, o rotar la imagen, en este caso no vamos a editar nada y además un texto alternativo significativo. Por si alguna persona no ve la imagen que sepa lo que se encuentra en esa imagen y los iconos nos dice si son un icono predeterminado que nos ponga la imagen subida. En nuestro caso vamos a decir que se que la imagen subida que sea el icono. Además podemos añadir. Si queremos el icono en pequeñito para que sea ese icono que aparezca en nuestra imagen, que aparezca; ahí cuando aparezca el icono aparezca la imagen y luego el punto caliente, que llama el los puntos calientes, los puntos de información te debo de indicarle. La posición de ese punto que queremos en cada caso, por ejemplo, si impulsamos aquí vale impulsando en un teléfono móvil y desde aquí dice cubrir toda la imagen de fondo, es decir, cuando pulsa el punto, que todas las demás información para centrarlo en esa imagen, aquí le podamos poner un encabezado, si lo queremos, es opcional, que es un móvil, y el contenido emergente que le vamos a indicar puede ser un texto, un vídeo o una imagen. Por ejemplo, vamos a poner un texto, el cual vamos a decir es un móvil en el texto. Pondríamos la explicación de esa información que queremos darle al usuario una vez que ya lo tenemos, como ve, nos brinda la opción de decir. Sí quiero añadir otro punto caliente, por lo tanto, sabemos añadir otro punto caliente y a la imagen, por ejemplo, le podemos dar aquí al siguiente. El siguiente le con él en la posición de por donde queremos en el centro, si queremos o no cubrir toda la imagen cuando seleccione en este caso, el portátil y desde aquí le podemos dar información. Vale el elemento? Lo mismo puede ser una imagen, un vídeo que le podemos dar información sobre ello. En este caso estamos dando información en forma textual. Es un portal de la información que queremos darlo, darle al usuario toda la explicación es ahora mismo, de momento lo dejamos así, pero podemos darle la información que necesite y podemos seguir añadiendo punto caliente, o ya no tenemos. Lo podemos probar y guardar, recordar, no olvidar, guardarlo. Decimos guardar cómo vamos a dar un nombre. Usaremos el guardar si vamos a la vista, vemos que tienen ahí el punto caliente que aparece ahí, que la información cuando el usuario pizza de toda la información que le va a brindar y se aparece ese puntito obesa y que va apareciendo en cada caso para que el usuario según va viendo la imagen le vamos dando información y pulsando hay en ese punto se abrirá la información de su portátil, etc, etc. Todo lo que hayamos comentado de esta manera podemos hacer una imagen interactiva con información de cada punto, de esa imagen que queremos, que el usuario vaya conociendo. Cada uno de esos elementos.

Intervienen

Ana Miquel Meseguer
Servicio de Infraestructuras TICs - ÁTICA

Organizadores

Ana Miquel Meseguer
Servicio de Infraestructuras TICs - ÁTICA

Propietarios

UMtv (Universidad de Murcia)

Publicadores

Ana Miquel Meseguer

Comentarios

Nuevo comentario

Serie: Contenidos interactivos con H5P y LUMI (+información)

Docencia Digital

Descripción

Cómo crear contenidos Interactivos con H5P con la ayuda de la aplicación de escritorio LUMI.
Descargar ejemplos de contenidos interactivos desde https://h5p.org
Tipos de contenidos interactivos H5P. Presentación del curso, vídeo interactivo, visita virtual 360º, etc...

Relaccionados