SALA DE SESIONES VIRTUALES PARA LA ESPOL Juan Carlos Véliz Garcia1, Pedro Eduardo Morales2, Ing. Fabricio Echeverria3 Facultad de Ingenieria en Electricidad y Computación (FIEC) Escuela Superior Politécnica del Litoral Campus “Gustavo Galindo Velasco”,- Km. 30,5 Vía Perimetral Apartado 09-01-5863, Guayaquil - Ecuador jveliz@fiec.espol.edu.ec1, pmorales@fiec.espol.edu.ec2, pechever@espol.edu.ec3 Resumen En el presente artículo se resume como se ha elaborado un portal web de sala de sesiones virtuales que contiene un canal de transmisión de videoconferencias en vivo que permitirá extender la comunicación de la información impartida en los principales eventos o conferencias de la ESPOL a través del Internet. Se hace uso del concepto de Web 2.0 en el proyecto dado que en tales conferencias se permitirá la interacción en la comunicación entre los visitantes al portal, previamente registrados y los conferencistas a través de un chat y mediante un blog se podrán dejar sus respectivos comentarios. Así mismo, el portal contiene un repositorio de videos de índole académico que permitirá visualizar y escuchar la información contenida, a los visitantes del portal. Para la implementación de este proyecto se han utilizado los servicios de la plataforma de transmisión de videos de USTREAM, de librerías y funciones de desarrollo web del lenguaje PHP, funciones de código embebido web, el formato de intercambio de datos en JSON, repositorio de datos en MySql y como servidor web se ha empleado el uso de Apache Tomcat. Palabras Claves: Web 2.0, Plataforma de Transmisión de Videos, Funciones de Código Embebido. Abstract This paper resumes how to development a web site of virtual meeting room that contains a channel for transmitting live video conferences that will extend the disclosure provided in the main events and conferences in the ESPOL over the Internet. It uses the concept of Web 2.0 in the project since at such conferences will be permitted in the communication interaction among visitors to the site, previously recorded and speakers via a chat with a blog can leave their comments. Likewise, the web site contains a repository of academic videos that lets you watch and listen to the information, visitors to the portal. To implement this project we have used the services of the streaming video platform of Ustream, libraries and functions of PHP web development, web embedded code functions, the format of data exchange in JSON, a data repository in MySQL and how it has used web server using Apache Tomcat. Keyboards: Web 2.0, Video Transmission Platform, Embebed Code Functions. 1. Introducción La utilización de portales de transmisión en vivo de canales por parte de algunas universidades ha permitido extender la comunicación divulgada en tales eventos a un mayor número de personas localizadas en cualquier parte del mundo. A través del uso de esta tecnología es posible la comunicación e intercambio de criterios a través de entradas en los blogs o chats respectivos con personas de diversas culturas y de distinta formación académica, lo que ha permitido enriquecer inmensamente la educación. Esto permitirá conocer los comentarios de los visitantes con el objetivo de mejorar en caso de ser necesario el contenido de los eventos, y a su vez crear nuevos lazos de cooperación académica a través del uso del blog. Se ha escogido como plataforma de transmisión de videos a USTREAM debido a características como nivel de simplicidad para poder crear y administrar un canal de eventos y a su vez poder integrarlo y permitir visualizar dicha transmisión en el portal web para la ESPOL. 2. Web 2.0 en el Proyecto Antes de hablar de Web 2.0 es importante primero conocer el concepto de dicha terminología. Se denomina Web 2.0 a la transición que se ha dado a las aplicaciones tradicionales hacia aplicaciones que funcionan a través de los sitios web enfocados al usuario final. Se trata de aplicaciones que generen colaboración y de servicios que reemplacen las aplicaciones de escritorio1. En el actual proyecto se hace uso de la colaboración de los usuarios a través de herramientas colaborativas como un chat y blog que estarán integrados en los diferentes eventos para conocer sus respectivos comentarios acerca de lo transmitido. Lo que en sí se pretende a través del uso de este tipo de aplicaciones es que los usuarios compartan sus opiniones, sugerencias y no se comporten ante la aplicación como un simple espectador. Estos tipos de portales orientados a Web 2.0 han ayudado significativamente a las comunidades educativas dado que existe una interacción entre los visitantes al portal. En este proyecto, para la administración del portal se hace uso de las características que ofrece el servidor de Video Streaming como la integrabilidad a través de la utilización del código embebido para poder incrustar objetos tales como: visor de canales, chat, y blog en el portal. Otras de las características empleadas es la utilización de su API para poder realizar consultas a su base de videos. La necesidad de realizar este proyecto recalca en el hecho que en muchas ocasiones las personas no pueden asistir a una conferencia por diversos motivos, y se quedan con el deseo de poder ver dicha conferencia. Con el avance de herramientas tecnológicas como el “Video Streaming”, las universidades se han volcado a la opción de poder integrar videos o canales de conferencia a través de sus portales web para poder mostrar su contenido a una mayor cantidad de público. Este proyecto servirá para involucrar y extender aun más las conferencias impartidas en la universidad a un público que se encuentre localizado desde cualquier lugar y que tenga acceso a Internet. Se espera que a través de los blogs o del chat, el visitante pueda interactuar con los conferencistas o con el resto de los usuarios, permitiendo generar una red participativa de usuarios tal como lo sugiere el libro Wikinomics con respecto a su apartado “la era de la participación”, y en el cual se hace énfasis de cómo empresas con sitios web que utilizan herramientas de colaboración masiva han visto mejorar sus productos a través de las recomendaciones o comentarios de los visitantes al portal. Actualmente existen universidades en el país que realizan transmisiones en vivo de sus principales eventos o clases a través de sus portales web como la Universidad Tecnológica Particular de Loja (UTPL). A nivel internacional, la Universidad de Monterrey (UDEM) y el Instituto Tecnológico de Massachusetts (MIT) mediante sus respectivos portales web ofrecen una videoteca de sus principales eventos para luego ser reproducidos a la comunidad internacional. 3. Servidor de Video Streaming USTREAM USTREAM es un servidor de transmisión de videos en vivo que nos provee de una API (Interfaz de Programación de Aplicaciones) para realizar requerimientos de consultas a los videos y eventos o shows almacenados en su repositorio de datos. USTREAM utiliza el “video streaming”, que es una tecnología de transmisión de datos que no requiere la descarga previa en el ordenador del usuario, sino que dicho servidor en nuestro caso USTREAM entrega los datos en forma continua y sincronizada en tiempo real, lo cual nos facilita la transmisión de archivos de Video a través del Internet2. El uso de esta plataforma tecnológica nos permite realizar lo siguiente:  Espacio de almacenamiento de videos.  Acceder a su base de datos de videos para realizar búsquedas de videos basados en diferentes campos a través de su API de Consultas.  Realizar transmisiones de video a varios usuarios  Visualizar y buscar transmisiones de otros usuarios  Integración de los eventos divulgados en el canal con sitios web de redes sociales como Facebook y Twitter.  Interacción en tiempo real entre los usuarios registrados a través de un chat integrado al evento transmitido. Para poder realizar los requerimientos de consultas a su base de datos, es necesario obtener un “developer key” provisto por USTREAM, el cual es totalmente gratuito. Las consultas a la base de datos de USTREAM se pueden realizar de dos maneras:  Implementando el paquete de librerías de USTREAM  Utilizando funciones de la API de consultas de USTREAM via HttpRequest mediante los métodos Get o Post. Los formatos de salida en los requerimientos a la API de USTREAM pueden ser a través de: XML, HTML, JSON, PHP. La data retornada muestra la siguiente estructura3: Tabla 1. Formato de los datos retornados API OUTPUT FIELD Tipo de Dato Definición Results Array Contiene la data solicitada en la consulta al Servidor de USTREAM. Msg String | null Contiene información acerca del procesamiento del requerimiento realizado al servidor de USTREAM. Error String | null Contiene un mensaje de error en caso de ser necesario. ProcessTime Float Retorna el tiempo de procesamiento de la petición. 3.1. Código Embebido Generalmente llamado “script”, el código embebido4 es una secuencia de código que permite ver y compartir un objeto en una página web. Dicho objeto puede ser una imagen, video, panel de chat, entre otros. USTREAM nos provee de código embebido para poder insertar dicha codificación en nuestros sitios web. El código embebido es de gran utilidad para poder integrar funcionalidades tales como eventos o shows, videos, Chat, blogging con Twitter y materiales relacionados en el portal web “Sala de Sesiones Virtuales”. Dicho código embebido es utilizado en el portal web luego que el sistema realiza las búsquedas en el Servidor de Video Streaming USTREAM, dado que en la operación de consulta se retorna el código embebido como uno de los elemento de respuesta en el archivo de formato JSON. 4. Diseño de la Solución Considerando que en la ESPOL no existe un servidor propietario de video streaming que nos provea de transmisión de videos y a su vez de almacenador, se tuvo que incurrir en la necesidad de analizar los servicios de otros sitios que ofrecen la misma funcionalidad a la cual nosotros estamos recurriendo. Se decidió utilizar Ustream como proveedor de servicio de streaming de videos para la ESPOL debido a las siguientes razones que requerimos para el desarrollo de este proyecto:  Realizar transmisiones de video a varios usuarios.  Facilidad para poder incrustar código embebido en el portal.  Administración de la transmisión en vivo para mejorar el nivel de imagen y la calidad de audio.  Espacio de almacenamiento de videos.  Acceso a su base de datos de videos para realizar búsquedas de videos basados en diferentes campos a través de su API de Consultas.  Integración de los eventos divulgados en el canal con sitios web de redes sociales como Facebook y Twitter.  Interacción en tiempo real entre los usuarios registrados a través de un chat integrado al evento transmitido.  Gratuidad de uso de sus servicios. Como lenguaje de desarrollo para el diseño del sitio web se decidió trabajar con PHP debido a su sencillez en la programación y a su alto índice de popularidad entre los desarrolladores para crear sitios web dinámicos. Como repositorio de los datos ingresados en el portal se está trabajando con el motor de base de datos MySql y como servidor web se utilizan los servicios de Apache Web Server. A través de una cuenta en USTREAM, se podrán crear eventos en los respectivos canales en el portal web de USTREAM.TV. Cada vez que se crea un evento en dicho portal, se va generando un código embebido el cual será incrustado en el portal web de “SALA DE SESIONES VIRTUALES” por medio del administrador del sistema. El administrador del sistema será la persona encarga de ingresar dicha data generada. 4.1. Procesando una consulta Las peticiones al servidor de Ustream cuando se realice algún tipo de búsqueda se ejecutarán vía HttpRequest utilizando su API Request, para lo cual internamente a través de una programación realizada en el sistema se procederá a armar un URL en base al formato establecido de su API. Figura 1. Petición de una Solicitud Tabla 2. Pasos para realizar una petición 1 A través de un Web Browser se realizar una petición via HttpRequest de Consulta al Servidor de Streaming de Ustream mediante métodos Get o Post. 2 El Servidor de Streaming de Ustream recepta y procesa la solicitud. 3 El Servidor de Streaming de Ustream envía un HttpResponse en el formato de salida especificado en la consulta () 4 La aplicación cliente procesa el tipo de response obtenido (XML, JSON, HTML, PHP) y muestra la respuesta en formato HTML. 5. Crear un Show en USTREAM Esta sección es sumamente importante dado que se describirán los pasos necesarios para poder crear un evento o show en USTREAM utilizando el portal web de dicho servidor de Video Streaming. Cabe mencionar que estas acciones deberán ser realizadas por el administrador del portal y dichos pasos son esenciales para poder generar una transmisión de cualquier evento: 1. Tener configurado una web cam o micrófono al equipo desde el cual se realizará la transmisión. 2. Ingrese esta dirección url: “http://www.ustream.tv” en un web browser con características multimedia (Internet Explorer v5.0 o superior, Mozilla Firefox, Google Chrome, Zafari, entre otros) y de click en el link “Log In”. 3. El administrador del canal de la ESPOL en USTREAM deberá autenticarse ingresando el nombre de usuario y contraseña. 4. Una vez autenticado, para poder realizar una transmisión de algún evento se deberá dar click en la pestaña “Your Shows”. 5. Inmediatamente aparecerán un listado de todos los eventos creados, en el caso de no existir eventos se solicitará ingresar el nombre del evento y dar click en el botón “Save My Show” para poder almacenarlo en la base de datos del Servidor de USTREAM. En nuestro caso se creó un evento “Conferencia sobre el Web Conference para la Espol”. 6. Luego de guardar los cambios, aparecerá un formulario en el cual se deberá ingresar información con respecto al evento como lo son: Descripción, Imagen y Categoría del evento. 7. De dicho formulario para poder reflejar los eventos del canal “ESPOL” en nuestro portal web de “Sala de Sesiones Virtuales” se deberá copiar el siguiente código embebido de tipo “action script” generado en el paso anterior en la opción de Administración del portal. Figura 2. Código Embebido creado por USTREAM 8. En la opción de administración del portal de “Sala de Sesiones Virtuales para la ESPOL”, una vez autenticado se deberá dar click en el link “Show” e ingresar el código embebido en cada uno de los campos requeridos del formulario. En los campos “Nombre” y “Usuario” se tendrán que ingresar los nombres del evento y del canal. Mientras que en los campos “Video Code”, “Chat Code” y “Twitter Code” se deberá ingresar el código embebido de tipo action script localizado en los campos “Lived Embed”, “Chat Embed” y “Social Stream Embed” respectivamente nuestro canal “ESPOL” creado en el servidor de video streaming USTREAM. Figura 3. Inserción del Código Embebido del Visor del Evento 9. Luego de ingresar toda la información solicitada, se deberá dar click en el botón “Agregar” para poder almacenar dicha información en la base de datos, con lo cual se agregará inmediatamente a la lista de canales en el portal web. 10. Para poder realizar la transmisión de un evento desde el Canal de Transmisión en el portal de USTREAM se tendrá que dar click en la opción “Broadcast Now”. 11. Se abrirá una ventana en la cual se solicitará dar acceso a la cámara web y al micrófono. Para ello se tendrá que dar click sobre el botón “Permitir”. 12. Finalmente para poder iniciar la transmisión se deberá dar click sobre el botón “Start Broadcast”. Figura 4. Iniciar la transmisión. 6. Administrando una transmisión Una vez que se está realizando la transmisión de algún video en vivo, USTREAM nos provee de las siguientes funcionalidades básicas:  Grabación del video que se está transmitiendo.  Herramientas de moderación de usuarios registrados.- Esta opción permitirá en caso de ser necesario, restringir los comentarios de algún participante en el chat Room.  Administrador de resolución de video y sonido.- Permitir mejorar la calidad tanto del audio como la del video que se está transmitiendo a través las opciones “Quality Video” y “Quality Audio”. Figura 5. Panel de Administración del evento transmitido 7. Mostrar un Video Almacenado En esta sección se describen los pasos necesarios para mostrar un video grabado en el portal web de “Sala de Sesiones Virtuales para la ESPOL”: 1. Dentro del canal de la ESPOL en el portal web de USTREAM se deberá click sobre la pestaña “Your Videos”, para poder mostrar el listado de todos los videos grabados. 2. Dar click sobre el video al cual se desea mostrar en el portal web “Sala de Sesiones Virtuales” con el objetivo de poder copiar su “código embebido”. 3. Ingresar al portal web “Sala de Sesiones Virtuales” como administrador para poder agregar un video a través de la pestaña “Videos” y a continuación con la opción “Agregar Video”. 4. Aparecerá un formulario en el cual se deberá la información solicitada, dentro de las cuales consta el campo “video Code”. En dicho campo se deberá pegar el código embebido copiado y dar click sobre el botón “Agregar”. Este paso es necesario, para poder embeber el video en el portal. Figura 6. Agregar Video al Portal 5. Inmediatamente aparecerá el video embebido con la información ingresada en el formulario del paso anterior. Figura 7. Video Insertado en el Portal 8. Diseño de la interfaz del Portal En la página inicial existe un listado de eventos que se encuentran en transmisión o se han encontrado en transmisión y para poder visualizarlo se deberá dar click en la imagen “VER” Figura 8. Página Inicial del Portal de Video Conferencias de la ESPOL Inmediatamente se abrirá una página que mostrará la transmisión en vivo en caso que se esté transmitiendo dicho evento y sus respectivos anexos como: Chat (Ingresar cuenta de usuario de Ustream), Blogging con Twitter (Ingresar cuenta de usuario en Twitter) y Materiales de Referencias como archivos en PDF o Diapositivas. Figura 9. Ilustración en Vivo del Canal El portal contiene una opción para realizar búsquedas de cualquier tipo de canal que almacene algún evento bajo el parámetro especificado. Por ejemplo: En caso de solicitar búsquedas sobre “Conferencias Web 2.0”, dicha consulta se realizará al Servidor de USTREAM vía HTTP REQUEST; construyendo un URL de búsqueda especificando el tipo de subject: “Channel” y el valor de búsqueda. El tipo de respuesta en formato JSON, nos permitirá recorrer el resultado de dicho texto en forma sencilla y mostrar los resultados en formato HTML. Figura 10. Búsqueda realizada en el portal 9. Conclusiones Tener un canal de transmisión de eventos permitirá extender y compartir la comunicación divulgada por parte de los conferencistas de sus eventos a un mayor número de usuarios localizados en cualquier parte del mundo. A través de la interacción con dichos usuarios se podrá obtener y realizar un análisis de los comentarios e inquietudes de los visitantes al canal, permitiendo generar participación y desarrollo social al contenido de lo difundido en el evento. La fácil integración del código embebido ha podido permitir integrar funcionalidades de herramientas web 2.0 como la visualización de un canal, un chat y un sistema de microblogging en este caso “Twitter” en nuestro portal web. El consumir servicios de terceros en nuestro caso “USTREAM” nos ha permitido a través de su API realizar consultas a su base de videos para luego cargar dinámicamente sus resultados en el portal. 10. Recomendaciones Cuando se esté transmitiendo algún evento, se recomienda activar la opción de grabación de dicho evento para posteriormente incrustar su código embebido en la opción de agregar videos almacenados en el portal web “Sala de Sesiones Virtuales para la ESPOL”. Cuando no se esté transmitiendo algún evento, se recomienda presentar algún video grabado. Tener una conexión de internet de alta velocidad para poder apreciar de mejor manera los canales del portal, con el fin de evitar descargar lentas al visualizar un evento. Se recomienda a los administradores del portal web que se administren y planifiquen bien los horarios de los eventos que se están transmitiendo para evitar cruce de eventos en el canal. 11. Agradecimiento Para el desarrollo de este proyecto, agradecemos el aporte constante en las revisiones realizadas por el Director del Seminario “Desarrollo de Aplicaciones Basadas en el Web 2.0”, Ing. Fabricio Echeverría. 12. Referencias 1. [Web 2.0], Maestros del Web: Christian Van der Henst,” ¿Qué es la Web 2.0?”¨, http://www.maestrosdelweb.com/editorial/web2/, fecha de consulta 24/10/2009. 2. [Streaming], Desarrollo Web: Miguel Angel Alvarez, “Que es Streaming”, http://www.desarrolloweb.com/articulos/482.php , fecha de consulta 08/08/2009. [Streaming], Hooping.Net, “Video Streaming”, http://www.desarrolloweb.com/articulos/482.php y http://www.hooping.net/video-streaming.aspx, fecha de consulta 08/08/2009. 3. [Ustream API], Ustream,”Data API Documentation”, http://developer.ustream.tv/data_api/docs#searchEngi ne, fecha de consulta 11/10/2009. 4. [Código Embebido], Diccionario Informático ALEGSA,“Definición de Embeber”, http://www.alegsa.com.ar/Dic/embeber.php, fecha de consulta 13/10/2009.