VirtualNet 2.0 Mobile

Virtualnet 2.0 es un sistema el cual provee a los usuarios de la herramientas para su aprendizaje a través de Internet, haciendo uso para tal fin de un navegador web, usado en un equipo de escritorio.

Actualmente el auge de los dispositivos móviles, ha impulsado que el acceso de los usuarios a la red, se realice haciendo uso de éstos equipos, ya que están siempre al lado de ellos.

Virtualnet 2.0, ha querido hacer uso de esta premisa del uso móvil por parte de los usuarios y aplicar el concepto de educación virtual a través de la movilidad, conocida como MLearning, y poner a disposición de los usuarios una aplicación web, personalizada especialmente para el uso móvil, denominda Webapp

Para tal fin se ha hecho uso del framework conocido como jquery Mobile, el cual provee el soporte para varias plataforma móviles.

En VirtualNet 2.0 mobile, el usuario podrá realizar acciones de consultas, se está trabajando para integrar elementos tales como Chat, y otros que apoyen la interactividad del uso respecto a la aplicación.

Acciones de consulta posibles a través de VirtualNet 2.0 Mobile

1. Listado de asignaturas.

iPhone/iPod Touch

Android

iPad

2. Listado de participantes.

3. Hoja de calificaciones.

4. Boletines.

5. Notificaciones.

6. Correo electrónico.

7. Contenido Móvil.

En este espacio, se mostrará aquellos contenidos que el docente específique que serán para la versión móvil, es decir, no todos los contenidos disponibles del sistema serán visibles en la versión web, sino tan sólo aquellos que el docente indique que lo serán.

La aplicación ha sido probada con los navegadores nativos de cada sistema operativo móvil.

• IOS (iPhone/iPod Touch - iPad)
• Android.
• Blackberry
• Windows Phone.

Además del uso de otros navegadores como Opera y Google Chrome, tanto para IOS como para Android.

El aprendizaje de uso de este sistema por parte de los usuarios, ayudará a mejorar la aplicación y de eta manera crear en un futuro aplicaciones nativas que aprovechen al máximo las capacidades que ofrecen los llamados Smartphones

Wysiwyg - Asociar Presentación

El sistema VirtualNet 2.0, ha sido dotado del sistema de Presentaciones, el cual permite a los usuarios realizar exposiciones virtuales.

Presentaciones cuenta con la capacidad de ser compartido a través de un enlace directo, código de embebido o a través de redes sociales (Facebook y Twitter).

Para compartir una presentación en VirtualNet 2.0 en diferentes contenidos, como foros y tareas, se requiere que los usuarios copien el código de embebido provisto por la aplicación, para evitar este paso, se ha desarrollado un botón en el editor html del sistema (Ckeditor), desde el cual se podrá seleccionar una o varias presentaciones para compartir.

Anteriormente se había desarrollado un botón personalizado (Wysiwyg - Grabación de Vídeo), el cual dota al editor de la capacidad de grabación de vídeo, bajo el mismo esquema se ha desarrollado esta opción.

Compartir presentaciones por medio del editor, provee al usuario de dos opciones:

1. Seleccionar presentaciones realizadas en el curso en que se encuentre.
2. Compartir presentaciones, a través del uso de la URL de la misma.

Tan sólo se podrán compartir aquellas presentaciones que tengan asociadas grabaciones de los expositores.

A continuación, se relaciona una serie de capturas que muestran el proceso.

Opciones Asociar Presentación en el editor html

Seleccionar presentaciones realizadas por el usuario en un curso

Compartir presentación con la url de la misma

Está nueva opción colabora en el proceso de compartir presentaciones, de una forma mucho más fácil y amena, sin la necesidad de realizar el proceso manual.

Presentaciones

VirtualNet 2.0 es un sistema en el cual se tiene la capacidad de incrustar diferentes elementos de la web, como vídeo de Youtube, Vimeo, presentaciones elaboradas prezi, entre otros elementos, esto gracias al editor con el que cuenta.

Prezi es una gran herramienta que permite realizar ponencias de forma interactiva, bajo la premisa que las presentaciones son una fuerte herramienta en la cual los usuarios expresan sus ideas.

Bajo este esquema se ha realizado la aplicación de Presentaciones, presente en el sistema de VirtualNet 2.0, éstas le permite al expositor asociar un documento PowerPoint, y realizar una grabación como si de una exposición presencial se tratase.

El desarrollo se ha hecho haciendo uso de diferentes tecnologías, siendo como pieza clave el servicio RED5, el cual provee la capacidad de grabación/reproducción de vídeo y audio en tiempo real, haciendo uso del protocolo denominado RTMP.

Además del uso de Adobe Flash para el despliegue de la presentación y el manejo de elementos.

A continuación se muestra una Presentación, realizado en dicho sistema, que muestra el manejo básico, además de una serie de imágenes que ilustran el  funcionamiento básico.

Elemento Embebido - Presentaciones

Contenido General de un curso, con la nueva opción de presentaciones

Adjuntar nueva presentación.

Listado de presentaciones Existentes

Entorno de edición - Presentaciones

Configuración de Medios

Compartir Presentación

Entorno de Publicación

El sistema está en constante desarrollo, buscando agregar elementos de trabajo colaborativo, entre los diferentes usuarios que componen el sistema, para de esta forma crear presentaciones.

Actualización: 29/09/2013

En el presente documento, encontrarán un manual del sistema, realizado por el Licenciado Edgar González de la UMB Virtual.

Wysiwyg - Grabación de Vídeo

VirtualNet 2.0, cuenta con un editor HTML o WYSIWYG (What You See Is What You Get - "lo que ves es lo que obtienes"), el cual le permite a los usuarios del sistema agregar imágenes, enlaces a otras páginas y insertar contenidos de otros sitios.

La librería usada es la llamada Ckeditor, la cual da varias posibilidades, desde la de personalizar que opciones tendrá el editor en determinadas ocasiones o como es el presente caso, crear una opción propia, gracias a la posibilidad de hacer uso de la API con la que cuenta.

Se presentó la necesidad en la cual los usuarios tuvieran la opción de realizar grabaciones de si mismos, sin requerir el uso de un servicio de terceros, por lo que se optó en dotar al editor de está capacidad, en este caso se ha hecho uso del servicio RED5, el cual da la capacidad de realizar grabaciones en tiempo real, y además haciendo uso de las funciones provistas en Adobe Flash en el acceso a la webcam de un equipo.

El protocolo usado para la grabación y posterior ejecución de un vídeo, es conocido como RTMP, para fines de proceso de grabación, se ha desarrollado un player en Adobe Flash, el cual haciendo uso de RED5 y la webcam del usuario, genera un archivo en formato FLV, el cual es alojado un servidor especialmente configurado para el funcionamiento del servicio RED5.

Por último para la ejecución del vídeo, debido a que no es realizado a través de Streaming, sino en este caso a través del uso de RTMP, se ha hecho uso del reproductor jwplayer, el cual a través de una serie de parámetros, otorga la capacidad de ejecución de las grabaciones realizadas...

A continuación, se relacionan una serie de capturas que de muestran el proceso realizado:

Vista de la opción de grabar vídeo

 Solicitud de uso de la webcam del usuario por parte de la aplicación

 Grabación del vídeo

 Reproducción del vídeo, haciendo uso del Player jwplayer.

Está característica, permite que los usuarios puedan realizar intervenciones mucho más ricas, aparte de la inclusión de demás elementos.

Reportes - Códigos QR

VirtualNet 2.0, posee un sistema de generación de reportes de calificaciones de los usuarios que están o han tomado alguna asignatura, éstos son generados en formato PDF, lo cual  facilita en gran medida la visualización de los mismos en cualquier navegador web (en el caso de Google Chrome, se tiene nativa esta opción sin la necesidad de contar con un Plugin como es el Acrobat Reader) y su posterior descarga. almacenamiento e impresión.

Debido a que estos documentos contienen información valiosa como es la relación de calificaciones obtenidas, es necesario poder corroborar la "autenticidad" de dicha información, para lo cual se ha implementado un sistema de asignación de códigos QR, a cada documento, con lo cual tan sólo con un equipo que cuente con este software podrá "escanear" dicho código y de está manera se mostrará una versión del mismo.

Esta acción se ha llevado a cabo gracias a la librería llamada PHP QR Code, la cual permite realizar este proceso de forma sencilla.

A continuación se relacionan una imágenes que evidencian el proceso realizado.

Documento PDF con su respectivo código QR que lo identifica

Verificación del documento por medio de un iPod Touch.

Este tipo de consultas es posible realizarlas desde dispositivos móviles basados en IOS, Android hasta en un equipo de escritorio, en este caso es posible utilizar una versión realizada en Adobe Air, llamada QRreader, que haciendo uso de la Webcam permite realizar la lectura de los códigos QR.

Los usos de QR son muy variados, en este caso se utiliza para realizar una verificación de un documento, el cual puede encontrase de forma impresa, y para evidenciar la validez del mismo.

Panel de Notificaciones

En VirtualNet 2.0, se generan una grana cantidad de eventos, es por esto que recientemente se creo la opción de Notificación de los mismos, proceso por el cual se le comunica al usuario de algún proceso, como por ejemplo una nueva intervención en un foro y un nuevo correo.

Estas notificaciones eran vistas en el momento, pero no se contaba con la posibilidad de ver un historial de las mismas, por lo que se ha generado un panel donde se muestran éstas y además el número de nuevas notificaciones que un usuario no ha visto.

Aprovechando el Favicon que contiene una página, se ha puesto en en esta ubicación el número de notificaciones pendientes por ver, ya que en muchas ocasiones lo usuarios no están en la misma ventana y/o pestaña, por lo cual tan sólo se podría saber de nuevas notificaciones están presentes en cada momento en la ventana y/o pestaña del sistema.

Con esta característica el usuario sabrá si tiene nuevas notificaciones, para lograr este objetivo se ha hecho uso de la librería Tinycon, la cual permite asociar un número al Favicon existente.

A continuación una serie de capturas que muestran el proceso.

Menú con la nueva opción de notificaciones, mostrando la cantidad pendiente de notificaciones por ver

FavIcon con el número de notificaciones pendientes

Panel de notificaciones, en las cuales se muestra el histórico de las mismas

Notificaciones en tiempo real

Notificaciones en Favicon y en el menú del curso.

El uso de la combinación del Favicon, junto con el número de notificaciones, está restringido sólo para los navegadores de última generación, para aquellos navegadores que no cuentan con soporte para está característica, se ha adicionado el número de notificaciones, acompañando al nombre de la pestaña o de la página (etiqueta <title>).

Las nuevas capacidades de los navegadores y las nuevas tecnologías que estos albergan, han posibilitado que elementos como el Favicon, tengan mayores usos, un ejemplo claro es el de notificaciones, otro por ejemplo la generación de un juego (Defender) en un espacio tan reducido como es éste.

Notificaciones de Eventos

VirtualNet 2.0, cuenta con herramientas de comunicación, como foros, chat's, tareas, evaluaciones y otras que están en desarrollo, por lo que es necesario tener un sistema de notificaciones para así informar de aquellas actividades que se han realizado en tiempo real.

Por lo que se ha creado un sistema de notificaciones las cuales le informan al docente y estudiosos d aquellas procesos que se hayan realizado en el momento tales como:

• Participación en un foro.
• Entrega de tareas.
• Calificación de tareas.
• Envío de correo electrónico.

Dependiendo del tipo de actividades, estas pueden ser masivas (para todos los usuarios que componen el a) o individuales (sólo para algunos usuarios).

Otro tipo de notificaciones en los cuales se está trabajando son las denominadas nativas, en este caso haciendo uso del navegador Google Chrome basado en webkit, que tiene esta característica.

La opción de notificaciones nativas se ha desarrollado en el momento para notificación de correos electrónicos así como mensajes en el chat.

A continuación se relacionan una serie de imagenes que ilustran el proceso...

Notificaciones de calificación de tarea y participación en un foro.