Átomo Expositivo: Imagen

Este átomo de Bloom permite insertar una imagen en combinación con cualquier otro átomo. En este tutorial podrás aprender cómo utilizarlo para integrarlo a una molécula de aprendizaje.

Personalización del Átomo:

Las partículas son los atributos del átomo, es decir, las configuraciones disponibles que se pueden personalizar dependiendo del ejercicio que desees realizar. En este caso, la Imagen solo requiere indicar el nombre del átomo en el Markup y enseguida el
nombre del archivo de la imagen como se muestra a continuación:

- Image: image8.png

También es posible utilizando directamente la url del archivo de imagen:

- Image: https://yeira.academy/platforms/yeiraacademy/html/2/442f26be49b9ae3046d0e2ad53672d8c/0_Sesion/assets/image8.png

Los archivos de imagen soportados son: jpeg, gif, png, apng, svg, bmp, bmp ico, png ico

Cómo integrar el átomo de Imagen a otro átomo Bloom

El átomo de Imagen es normalmente un elemento gráfico de apoyo para contenidos evaluativos, sociales o expositivos, por lo que se integra a la estructura de un contenido más complejo, veamos el siguiente ejemplo con un Tablero Social:



En el Markup se escribe de la siguiente manera:

- page:
  - Image: image8.png
  - title: ¿Quién es el Learner Persona?
  - subtitle: Redacta tu respuesta y pulsa enter para enviar.
  - Board:
      id: Board-01
      placeholder: Escribe aquí tu respuesta

Donde - page: es la página que contiene los átomos, por lo que es necesario incluirlo al principio del Markup.

Pasos para añadir o modificar una imagen en un paquete Bloom

En el paquete de contenidos Bloom, ubica la carpeta assets. Si no existe crea una con el mismo nombre assets (cuida que este escrito todo en minúsculas)
Dentro de la carpeta assets, añade o reemplaza la imagen que deseas agregar a tu contenido Bloom
Dentro del archivo page.yaml utiliza solo el nombre del archivo de la imagen (ej: image8.png)
Selecciona todos los archivos y comprime en archivo ZIP el contenido.
Súbelo a tu curso en tu sitio Yeira como recurso tipo HTML y ¡es todo!











Asegúrate que la imagen sea del tamaño final que deseas se muestre. El átomo Image es responsivo, por lo que se adecuará a la resolución en pantalla, pero crecerá solo hasta el tamaño original de la imagen.
Cuida el indentado del Markup para visualizar correctamente la conformación del contenido.

¿Quieres aprender paso a paso? Inscríbete al curso gratuito "Introducción a Bloom" de Yeira Academy

¿Necesitas ayuda? Contacta al Soporte de Yeira en: soporte@yeira.training

¿Aún no tienes cuenta en Yeira? Crea una gratis ahora aquí.

Actualizado el: 09/08/2021