Una herramienta para la Creación de Contenidos Multimedia combinando Audiovisuales e Hipertexto

Publicado originalmente en: Yera, R., Fernández-Aedo, R., Carballo-Ramos, E., & Carballo-Cruz, E. (2015). Una herramienta para la Creación de Contenidos Multimedia combinando Audiovisuales e Hipertexto. Revista de Informática Educativa y Medios Audiovisuales 12 (20), 5-13. Universidad de Buenos Aires, Argentina. Una herramienta para la Creación de Contenidos Multimedia combinando Audiovisuales e Hipertexto Raciel Yera Toledo, Raúl Fernández Aedo, Elme Carballo Ramos, Edianny Carballo Cruz Departamento de Gestión de la Información y el Conocimiento. Universidad de Ciego de Ávila. Carretera a Morón Km 9 ½. Ciego de Ávila. Cuba. [email protected], [email protected], [email protected], [email protected] Resumen: El desarrollo de herramientas para la elaboración de contenidos educativos ha sido un tema de amplio interés en los últimos años, con el auge de las nuevas tecnologías de la informática y las comunicaciones puestas en función del proceso de enseñanza aprendizaje. En el presente trabajo se presenta una nueva herramienta de autor para la generación de un nuevo tipo de contenido que combina el material audiovisual con el hipertexto. Con esta aplicación, es posible generar contenidos que a los efectos del usuario final, permite reproducir simultáneamente el video y a la vez el hipertexto, el que se va mostrando u ocultando en dependencia de los requerimientos especificados. Palabras clave: audiovisual, hipertexto, integración Abstract: The development of tools for the educational contents construction has been an interesting research area in the last years, regarding the expansion associated to the new informatics and communications technologies as a support to the teaching-learning processes. In this direction, in the current paper we present a new authoring tool to generate a novel class of content that combines audiovisual materials with hypertext. This application allows to generate contents that produce in the final user, an effect similar to the simultaneous playing of video and hypertext. In this case the hypertext is showed or hided according to the specified requirements. Keywords: video, hypertext, integration 1. INTRODUCCIÓN El desarrollo de herramientas para la elaboración de contenidos educativos ha sido un tema de amplio interés en los últimos años, con el auge de las nuevas tecnologías de la informática y las comunicaciones puestas en función del proceso de enseñanza aprendizaje (Kaskalis, Tzidamis, & Margaritis, 2007). Con el desarrollo de internet, existe una tendencia a que la mayoría de los contenidos a desarrollar estén basados en tecnologías de la web, o al menos tengan soporte parcial para este tipo de tecnologías (Smith, 2012). En los últimos años, más que una tendencia esto se ha convertido en una exigencia, puesto que la mayor parte de la información y conocimiento que se genera se está ubicando en la World Wide Web (www), y en adición, estas tecnologías facilitan la aplicación de técnicas que van desde la indización hasta el análisis semántico; técnicas que para otro tipo de objetos que no son basados en texto, tienen aplicación restringida (dos Santos, Braga, & Muchaluat-Saade, 2013). A raíz de esto, muchas herramientas de autor, que es el nombre que técnicamente reciben este tipo de aplicaciones, han sido desarrolladas para desarrollar contenidos www, y son ampliamente usadas a todos los niveles educativos, desde los más elementales hasta el nivel universitario. Entre estas herramientas puede citarse el Exelearning , que es una aplicación que permite la creación de objetos de aprendizaje, en formatos como IMS y SCORM, centrados en la impartición de contenidos y además en la evaluación de los mismos. Por otra parte, ToolBox proporciona un paquete de aplicaciones para la generación de contenidos que van desde contenido basados en estándares Web, hasta contenido puramente multimedia. A su vez, herramientas tradicionalmente usadas en otros escenarios, como Adobe Dreamweaver, Adobe Flash, Director, Mediator, Multimedia Builder, Premiere, etc, también han sido utilizadas como herramientas de autor. A nivel global, y de manera particular en Cuba, en los últimos años el Ministerio de Educación le ha dado prioridad a la confección de medios audiovisuales con propósitos didácticos, y con este fin ha creado una red de Laboratorios de Tecnología Educativa que contiene los medios tecnológicos y las aplicaciones necesarias. Las aplicaciones multimedia, sin embargo, tienen una vinculación limitada con las tecnologías asociadas a internet. En la práctica, un medio audiovisual desarrollado con propósitos didácticos está representado por un archivo con formato AVI o MPEG, que no permite asociar ni extraer ninguna información al mismo, que pueda servir de utilidad para el proceso de enseñanza aprendizaje, ni para otros propósitos Considerando esto, pensando en fines prácticos su integración con las tecnologías web es limitada. En este trabajo se propone un nuevo formato de material audiovisual que permite vincular contenido web, específicamente hipertexto, a un material audiovisual; todo esto con propósitos didácticos. Este formato se basa en que, partiendo de que es posible embeber un audiovisual (formatos .AVI, .MPEG, etc.) dentro de una página web, y que a su vez el hipertexto constituye el principal componente de las mismas; es por tanto viable concebir un nuevo formato en el que, en una página web, paralelamente a la reproducción del video embebido en la misma, se muestre hipertexto de manera sincrónica con vistas a complementar el material en reproducción. En la sección 2 del presente trabajo, se describe con mayor precisión este formato, así como detalles de implementación utilizados en la concepción del mismo. En la sección 3 se muestra el desarrollo de una herramienta de autor que permite generar contenido basado en el formato explicado. Por otro lado, la sección 4 muestra una revisión de los antecedentes de la presente propuesta, evidenciando su novedad dentro del desarrollo de contenidos multimedia. Finalmente, la sección 5 muestra las conclusiones del trabajo, y las perspectivas futuras de este. 2. ENFOQUE PARA COMBINAR AUDIO/VIDEO CON HIPERTEXTO La construcción de materiales interactivos de tipo multimedia es mucho más compleja que la construcción de aplicaciones audiovisuales o puramente basadas en texto. Varios trabajos como (Bulterman & Hardman, 2005) han considerado que la interacción de objetos media tienen que necesariamente ser descritas como un conjunto de relaciones espacio temporales que toman en cuenta interacciones síncronas y asíncronas. Estos autores específicamente describen a su vez un conjunto de herramientas de autor de tipo multimedia que están agrupadas dentro de cuatro paradigmas fundamentales: el estructurado, el basado en línea de tiempo, el basado en grafos, y el scripting. Por otro lado, otros trabajos como (Deltour & Roisin, 2006), proponen el desarrollo de herramientas de autor basadas en plantillas con funcionalidad limitada, con vistas a hacer el empleo de estas herramientas, asequible a todos los usuarios. Con este propósito, en este artículo proponen un modelo de documento, denominado LimSee3, y dedicado a la creación de herramientas de autor integrando homogéneamente las estructuras lógicas, temporales, y espaciales. El presente trabajo también presenta un nuevo modelo de documento, aunque a diferencia de (Deltour & Roisin, 2006), en este caso el objetivo fundamental es el de combinar video e hipertexto de manera que el hipertexto se presente de manera sincrónica con respecto a la reproducción del video. El nuevo tipo de contenido que se defiende en este caso asume la división de una página web tradicional en tres partes fundamentales, como se muestra en la figura 1. La parte 1 sería la dedicada a la localización del audiovisual en sí; la parte 2 estaría dedicada al hipertexto (texto con formato, imágenes, etc) que se reproduciría de manera simultánea al audiovisual complementando el mismo, y la parte 3 estaría compuesta por la barra de control de la reproducción, que permitiría controlar al unísono lo que simultáneamente se muestra tanto en la parte 1 como en la parte 2. Figura 1. Distribución de los componentes del material en la página web Asumimos que a cada posible texto diferente que podría aparecer en la parte 2, era posible asignarle un tiempo de aparición y un tiempo en que desaparezca de la pantalla, puesto que es sustituido por una nueva vista. Por tanto, para lograr el comportamiento deseado, una vez que se tenga el código HTML de cada una de las “escenas”, así como su tiempo de inicio y tiempo de fin, es posible concebir una rutina JavaScript que en cada segundo chequee si en ese instante de tiempo coincide con algún tiempo de inicio o de fin de alguna escena. Si coincide con algún tiempo de inicio, pues en ese momento se pasaría a mostrar en la parte 2 el contenido asociado a esa escena; y en el caso de coincidir con un tiempo de fin, pues se procedería a limpiar la parte 2. El control del tiempo se propone realizarlo a través de un objeto Timer con el que cuenta el navegador, y que es accesible también desde JavaScript. La figura 2 muestra el aspecto del material con un ejemplo real. Figura 2. Ejemplo de material que se ajusta al formato propuesto 3. DESARROLLO DE LA HERRAMIENTA DE AUTOR Una vez definido este nuevo formato, se procedió a construir una herramienta de autor que permitiera al usuario asociarle a un video escenas con un tiempo de inicio y fin, así como contenido editado en formato HTML. Una vez empaquetado todo esto, la herramienta generaría un archivo HTML que constituye un material semejante al que se muestra en la figura 2. El software, denominado Multimedia Web Editor (MMWEditor), fue desarrollado utilizando Java, y específicamente aprovechando las potencialidades de Swing 2.0 para la creación de aplicaciones visuales. Una vez abierta la aplicación, el aspecto de la misma es el que se muestra en la figura 3. Esta está conformada por una barra de menú cuyas opciones van cambiando en dependencia del tipo de documento que vaya creando el usuario, una barra de herramientas para el acceso rápido a funcionalidades básicas, así como un área de trabajo. Para crear un nuevo archivo, basta con acceder a la opción Archivo de la barra de menú, y elegir la opción Nuevo, tal y como se muestra en la figura 4. Tras seleccionar la opción, aparece un cuadro de diálogo de tipo Guardar pidiendo el lugar donde se guardará el archivo, este lugar tiene que ser la carpeta definida, en la que ya se debe encontrar copiado el archivo de video o sonido. Al darle el nombre del archivo, es importante especificarle la extensión .html. (Figura 5) Tras presionar el botón Guardar, aparecerá la ventana “Nuevo audiovisual”, que es la principal de la aplicación. A su vez, en la barra de título aparecerá el nombre del archivo .html que se definió, y que se comenzará a editar. La ventana Nuevo audiovisual (Figura 6) está conformada por tres partes: el área para la selección del archivo de audio o video a procesar, el listado de escenas del producto final, así como la previsualización de la escena actual. A su vez, con la aparición de ventana, también aumenta el número de opciones disponibles tanto en la barra de menú como en la barra de herramientas. El primer paso en la creación de la multimedia web debe ser la asignación del archivo media sobre el cual se trabajará. En caso de que se disponga un video o un audio ya predefinido y construido (se puede obtener de aplicaciones como los “loquendo” o similares), se selecciona el botón de adjuntar media (resaltado en la figura 6), tras lo cual se brindará la opción de adjuntar el archivo (Figura 7). El principal concepto tomado en cuenta por el software que se presenta, es el de escena. A los efectos de la aplicación, una escena es un contenido a mostrar, en un instante de tiempo dado; por lo que tiene un momento de inicio y un momento de terminación. El objetivo principal de la aplicación que se presenta, es facilitar la elaboración de un archivo .html que realice presentación de escenas de manera sincrónica, con un archivo de audio o de video. Para insertar una escena, debe habérsele ya asociado al producto a desarrollar, un archivo de audio o de video. Una vez realizada esta operación, para insertar una escena se deberá acceder al menú Audiovisual, seleccionándose la opción Nueva escena. (Figura 8). Al realizar esta operación, se mostrará la ventana Nueva escena (Figura 9) la que está conformada por: casillas editables del tiempo de inicio y de fin de la escena en cuestión, área de sólo lectura donde se mostrará el contenido que se vaya conformando para mostrar en la escena, mini-reproductor donde se ejecutará el archivo de apoyo de audio y video, y botones para tomar automáticamente el instante de ejecución del mini-reproductor y asignarlo automáticamente al tiempo de inicio o de final de la escena, en dependencia de lo que se desee. Por tanto, para asignar los tiempos de inicio y de fin de la escena en cuestión, se seleccionarán los botones Tomar tiempo para inicio y Tomar tiempo para fin respectivamente, tomando los tiempos actuales de reproducción del material en el mini-reproductor. Para llenar el contenido a la escena, se utilizarán las opciones presentes en el menú Escena, accesible una vez que se trabaje en la ventana Nueva Escena (Figura 10). De la misma manera en que se incorpora texto a la escena, es posible incorporar imágenes. Para esto, se ha de seleccionar la opción Nueva Imagen, mostrada en la Figura 10 como parte del menú Escena. Tras esta operación, aparecerá el diálogo de la Figura 11, donde se podrá especificar la ruta de la imagen a adicionar Una vez especificada la ruta en una caja de diálogo de tipo Abrir…, aparecerá la interfaz de la Figura 12, donde se podrá cambiar el tamaño a la imagen, ydetallar si se desea realizar la inserción de manera centrado; para finalmente en el botón Aceptar, asociar la imagen a la escena actual. Tras terminar de incorporar el contenido deseado en la escena (Figura 13), se hará clic en el botón Guardar para insertar la escena creada dentro del producto que se desarrolla. Al realizar esto, la escena creada aparecerá en el ¨Listado de escenas¨ del audiovisual creado, y al hacer clic sobre dicha escena, su contenido aparecerá en el área ¨Escena actual¨. (Figura 14) El área “Escena actual” además es editable, por tanto permitirá hacer cambios directos en ella del texto y las imágenes mostradas, así como su eliminación. Presenta además la funcionalidad de arrastrar y soltar, permitiendo cambiar la precedencia u orden del contenido que se presenta. Tras realizar estos cambios, aparecerán disponibles a un costado del área escena actual, dos botones que permitirán salvar las nuevas modificaciones, o deshacer los cambios recién realizados (Figura 15). En el caso que se deseen realizar cambios más profundos, como modificaciones en los tiempos de inicio y de fin, así como la inserción de nuevo contenido con formato distinto o nuevas imágenes, tras seleccionar la escena a modificar en el “Listado de Escenas”, se accederá a la opción Modificar escena actual, en el menú Audiovisual (Figura 16) En ocasiones se necesitan conformar dos escenas con semejante contenido. Como apoyo a estas situaciones, se presenta la funcionalidad Duplicar escena. (Figura 17) Con este fin, inicialmente se seleccionaría la escena a duplicar en el “Listado de escenas”, y luego tras presionar la opción de duplicar, se adicionaría una nueva escena idéntica a la seleccionada. Al igual que con Duplicar escena, existe una funcionalidad semejante para Eliminar escenas. En este caso la aplicación pide confirmación de eliminación, antes de eliminar de manera irreversible. (Figura 18) Figura 3. Interfaz inicial de la aplicación Figura 4. Creación de nuevo material Figura 5. Creación de nuevo material (2) Figura 6. Interfaz Nuevo audiovisual Figura 7. Interfaz Adjuntar media Figura 8. Opción de creación de nueva escena Figura 9. Ventana de creación de nueva escena Figura 10. Opciones para asociar contenido a la escena Figura 11. Interfaz Nueva imagen Figura 12. Edición de propiedades de la imagen Figura 13. Escena concluida Figura 14. Interfaz nuevo audiovisual con la escena añadida Figura 15. Edición de la escena actual Figura 16. Opción Modificación de la escena actual Figura 17. Opción Modificación de la escena actual Figura 18. Opción Eliminación de la escena actual 4. TRABAJOS RELACIONADOS Con vistas a establecer con claridad la novedad de la presente propuesta, resulta necesario realizar una revisión de los trabajos previos más relevantes en el área de las herramientas de autor para creación de contenidos multimedia, y específicamente aquellos trabajos relacionados con las tecnologías web. Bulterman y Hardman han planteado la existencia de cuatro paradigmas fundamentales dentro de los que se agrupan las herramientas de autor de contenido multimedia (Bulterman & Hardman, 1995): • Autoría basada en grafos, las que describen el flujo de control de una presentación • Autoría basada en una línea de tiempo, las que describen el flujo de datos de una presentación basándose en un eje de tiempo común • Autoría basada en programación, las que usan una especificación basada en texto para describir las posiciones de los objetos individuales • Autoría basada en estructura, que agrupa objetos basándose en el contenido de la presentación. Por otro lado, en (Bulterman, 1995) por primera vez se propone un formato de documento para combinar de forma sincronizada el video con otro tipo de medias como las imágenes y el texto, empleando con este fin estructuras jerárquicas. A diferencia de la propuesta que presenta las secciones 2 y 3 del presente trabajo, el formato presentado por Bulterman se basa en una arquitectura cliente-servidor, implicando que sea compleja la concepción de una herramienta de autor para la producción de documentos basados en el mismo. En (Garofalakis, 2003) se ya se hace referencia a las posibilidades de emplear el lenguaje HTML con vistas a crear contenidos con características multimedia. Específicamente, en este trabajo los autores crean una plataforma de fácil empleo por parte de usuarios no expertos en la informática, para la producción de series de materiales interactivas con contenido y estructura similares; y donde los archivos de salida se basan en el formato HTML. Con anterioridad a esta fecha, ya (Barbará, 1997) había presentado algunas alternativas para combinar el formato de audio con el lenguaje HTML con vistas a crear sistemas de información que incorporen lo mejor de cada una de las dos tecnologías. Específicamente, el autor se enfoca en la tarea de proporcionar un nuevo formato que permita añadir “vínculos” de audio de forma no intrusiva a archivos de audio, y en proporcionar una serie de interfaces que permitan al usuario navegar por una web de documentos de audio, basándose en el formato propuesto. Más recientemente, en (Dutta, Janakiraman, & Schwerdtfeger, 2008) se muestra un marco de trabajo compuesto por un método y un sistema para presentar a un usuario final texto asociado a un formato multimedia. Esta propuesta se centra en la presentación simultánea de contenido multimedia con texto asociado, basándose en una arquitectura cliente/servidor de manera similar al trabajo de (Bulterman, 1995) y en contraposición con nuestra propuesta. A diferencia de (Bulterman, 1995), Dutta, Janakiraman y Schwerdtfeger presentan el texto utilizando lenguajes de etiqueta tales como HTML (Raggett, Le Hors, & Jacobs, 1999) y SMIL (Hoschka, 1998). El empleo de estos para la composición del texto hace posible que este pueda ser procesado por motores de búsqueda y otras herramientas similares de procesamiento de información, en contraste con las propuestas anteriores. En correspondencia con esto, la presente propuesta se ha desarrollado tomando como base el lenguaje HTML por constituir este un estándar ampliamente adoptado por la mayoría de los navegadores web, por encima de otros lenguajes de etiquetas. 5. CONCLUSIONES En el trabajo se justificó la necesidad de un nuevo tipo de material audiovisual que integrara de forma eficaz el audiovisual con las tecnologías web, y que permitiera generar contenidos con fines didácticos. Basados en esa necesidad, se presentó un nuevo tipo de documento que se centra en mostrar contenido hipertexto de manera sincronizada con un audiovisual, permitiendo que el contenido se reproduzca como un todo a los efectos del usuario final. Además se hizo referencia a consideraciones técnicas utilizadas en la implementación de dicho formato. En adición, se mostraron las características fundamentales de una herramienta de autor concebida para la generación de contenidos con las particularidades mencionadas. Finalmente, se realizó una revisión de trabajos previos que tienen puntos en común con la presente propuesta, mostrándose el lugar que ocupa la misma dentro de su correspondiente área del conocimiento. Como trabajos futuros se considerará indagar en las nuevas versiones de estándares web que han venido surgiendo, específicamente HTML 5, con vistas a verificar si es posible alcanzar las mismas funcionalidades ya logradas de una forma más eficiente. En adición, se considerará el desarrollo de una plataforma tipo Learning Management System (LMS) (Rice, 2011) (Fernández Aedo & Yera Toledo, 2014; Mariño, 2009) que facilite la gestión de los materiales desarrollados con la herramienta propuesta. Finalmente, la construcción de esta plataforma posibilitaría la aplicación de técnicas de personalización tales como los sistemas de recomendación, de probado éxito en escenarios de elearning (Yera Toledo & Caballero Mota, 2014), y que se centran centradas en proporcionar un mejor acceso a la información a los usuarios finales. 6. REFERENCIAS BIBLIOGRÁFICAS Barbará, D. (1997). The AudioWeb. Paper presented at the Proceedings of the sixth international conference on Information and knowledge management. Bulterman, D. C. (1995). Embedded video in hypermedia documents: supporting integration and adaptive control. ACM Transactions on Information Systems (TOIS), 13(4), 440-470. Bulterman, D. C., & Hardman, L. (1995). Multimedia authoring tools: State of the art and research challenges Computer Science Today (pp. 575-591): Springer. Bulterman, D. C., & Hardman, L. (2005). Structured multimedia authoring. ACM Transactions on Multimedia Computing, Communications, and Applications (TOMCCAP), 1(1), 89-109. Deltour, R., & Roisin, C. (2006). The limsee3 multimedia authoring model. Paper presented at the Proceedings of the 2006 ACM symposium on Document engineering. dos Santos, J., Braga, C., & Muchaluat-Saade, D. C. (2013). An Executable Semantics for a Multimedia Authoring Language Formal Methods: Foundations and Applications (pp. 67-82): Springer. Dutta, R., Janakiraman, J., & Schwerdtfeger, R. S. (2008). Displaying text of video in browsers on a frame by frame basis: Google Patents. Fernández Aedo, R., & Yera Toledo, R. (2014). Análisis del uso de un repositorio docente digital en la Universidad “Máximo Gómez Báez” de Ciego de Ávila, Cuba. 3C TIC, 3(1). Garofalakis, J., Markellou, P., Moumtzidis, J. (2003). A User Friendly Platform for the Automatic Production of HTML Multimedia Title Series. Paper presented at the 9th PanHellenic Conference on Informatics. Hoschka, P. (1998). Synchronized multimedia integration language (SMIL) 1.0 specification. http://www. w3. org/TR/RECsmil/. Kaskalis, T. H., Tzidamis, T. D., & Margaritis, K. (2007). Multimedia authoring tools: the quest for an educational package. Educational Technology & Society, 10(3), 135-162. Mariño, S. I. (2009). Prototipo de entorno virtual de contenidos básicos informáticos con la incorporación de producciones de alumnos de grado. Revista de Informática Educativa y Medios Audiovisuales, 6(11), 16-33. Raggett, D., Le Hors, A., & Jacobs, I. (1999). HTML 4.01 Specification. W3C recommendation, 24. Rice, W. (2011). Moodle 2.0 E-Learning Course Development: Packt Publishing Ltd. Smith, J. R. (2012). Rich media, poor media. MultiMedia, IEEE, 19(3), 2-3. Yera Toledo, R., & Caballero Mota, Y. (2014). An eLearning Collaborative Filtering Approach to Suggest Problems to Solve in Programming Online Judges. International Journal of Distance Education Technologies (IJDET), 12(2), 51-65.