• Aplicaciones de la comunicación para vídeos interactivos

    En la documentación técnica y de usuario de Descartes en su versión compatible con HTML5, en el artículo https://descartesjs.org/documentacion/?p=2709, se describe cómo se realiza una comunicación bidireccional entre una escena y una página HTML embebida en dicha escena. En general, la escena envía a través de comandos del tipo E.set(‘variable’, valor) un valor hacia un elemento del código HTML, el cual se actualiza; por otra parte, en el HTML embebido hay otras variables cuyos valores se envían a la escena.

    Aprovechando esta comunicación, hemos diseñado otros modelos de vídeos interactivos, que complementan el modelo desarrollado y descrito ampliamente en el apartado https://descartesjs.org/documentacion/?p=2381. A diferencia del modelo anteriormente documentado, los nuevos modelos utilizan vídeos que se reproducen en una página HTML, que luego se embebe en la escena, con la ventaja adicional de incluir vídeos, también embebidos, de YouTube.

    Es importante recordar que el objetivo del vídeo interactivo es permitir al usuario interactuar con la escena, en la cual el objeto principal es el vídeo. La interacción se realiza a través de preguntas o de la selección de opciones presentadas como botones o puntos gráficos dibujados sobre el vídeo. Esta interacción se logra si sólo se habilitan algunos controles de vídeo, que no permitan al usuario interferir en su reproducción como normalmente lo puede hacer. La comunicación bidireccional escena – HTML posibilita una gran variedad de alternativas o modelos de vídeos interactivos.

    En el siguiente vídeo puedes observar dos tipos de  interacciones,  la típica de YouTube (clic en una parte del vídeo, para este ejemplo en el botón «más información») y, al final, la interacción que más nos interesa en las aplicaciones de Descartes:

    En este documento presentamos algunas de estas alternativas. Se hará una descripción técnica de los comandos JavaScript relacionados con la reproducción del vídeo y, por otra parte, se explicará cómo modificar la escena para incorporar otros vídeos y las interacciones correspondientes.

    Se presentan modelos que incluyen enlaces a vídeos de YouTube que, obviamente, requieren conexión a Internet, si bien es posible usar cualquier vídeo entre la gran abundancia que presenta este popular repositorio, recomendamos diseñar nuestros propios vídeos y luego subirlos a YouTube, un ejemplo de ello es el último modelo.

    A continuación se dispone de los enlaces a diferentes artículos donde se desarrollan diversos modelos.

    Vídeos interactivos en Youtube

    Vídeo interactivo con preguntas de respuesta escrita

    Vídeo interactivo con selección de fragmentos de vídeo

    Vídeo interactivo con preguntas de selección múltiple

    Vídeo interactivo con enlace a otros vídeos

    Vídeo interactivo con enlace a otras escenas de Descartes

    Vídeo interactivo y escena interactiva simultánea

    Vídeos interactivos en local

  • Vídeo interactivo con preguntas de respuesta escrita. Vídeo interactivo YouTube (primer modelo)

    Primer modelo.  Vídeo interactivo con preguntas de respuesta escrita

     En este modelo se presenta un vídeo de YouTube, que se detendrá luego de transcurrido un tiempo determinado (para este ejemplo, 50 segundos), una vez se pare el vídeo, se hará una pregunta. Dada la respuesta, aparecerá un botón para reanudar el vídeo. La comunicación de Descartes con el vídeo, se hace a través de varias acciones, entre ellas la reproducción, la pausa, el cambio de volumen y el retroceso.

    Haz clic sobre el vídeo:

    (Puedes descargar esta escena desde este enlace)

    A continuación presentamos la documentación que explica cómo se modifica la escena, además de algunos aspectos técnicos presentes tanto en la escena como en el archivo HTML con el que se comunica.

    En otras entradas relacionadas, encontrarás los demás modelos

  • Vídeo interactivo con selección de fragmentos de vídeo. Vídeo interactivo YouTube (segundo modelo)

    Vídeo interactivo con selección de fragmentos de vídeo

    Este modelo permite seleccionar fragmentos de vídeo a través de un tiempo inicial y uno final. Para ello, el que desee cambiar el vídeo, debe reproducirlo y tomar nota de los puntos de corte inicial y final. En nuestro ejemplo, hemos seleccionado ocho fragmentos de vídeo que se activan por medio de controles tipo botón.


    (Puedes descargar esta escena desde este enlace)

    En el siguiente documento tenemos una descripción de cómo se puede modificar esta escena:

  • Vídeo interactivo con preguntas de selección múltiple. Vídeo interactivo YouTube (tercer modelo)

    Vídeo interactivo con preguntas de selección múltiple

    Este modelo es similar al primero, hemos cambiado el tipo y el número de preguntas.


    (Puedes descargar esta escena desde este enlace)

    En el siguiente documento tenemos una descripción de cómo se puede modificar esta escena:

  • Vídeo interactivo con enlaces a otros vídeos. Vídeo interactivo YouTube (cuarto modelo)

    Vídeo interactivo con enlaces a otros vídeos

    Este modelo es similar al segundo, su diferencia la dan los enlaces a nuevos vídeos, mientras que en el segundo se direccionaba al mismo vídeo en un punto temporal diferente. Este modelo no se presentó en la sección en local, en tanto que demandaría la inclusión de varios vídeos con la consecuencia en peso que ello implica.

    (Puedes descargar esta escena desde este enlace)

    En el siguiente documento tenemos una descripción de cómo se puede modificar esta escena: