Shared virtual presentation board for e-Meeting in higher education on the WebELS platform
© Berena et al.; licensee Springer. 2013
Received: 11 January 2012
Accepted: 24 April 2013
Published: 26 April 2013
In this paper, the development of a shared virtual presentation board (VPB) for real-time e-Meeting on the Web-based e-Learning System (WebELS) platform is introduced. WebELS is a general-purpose e-Learning system to support flexibility and globalization of higher education in science and technology. In WebELS, the Meeting module consists of online presentation and video conference system, and the combination of both allows the creation of a so-called virtual room for e-Meeting applications where participants convene via the Internet. Online presentation features synchronized slide control between the presenter and the listeners for slide changing, scrolling, zooming, cursor positioning, and playback control for video embedded on the slide. It also features online annotation that allows the presenter to write using a pen function on the slide display panel. The system has video conferencing function that provides an audio-video communication among the meeting participants. This paper discusses briefly the video conference system, and focuses on online presentation based on slide-based synchronization and the development of VPB. VPB is a shared object that resides on the server that is updated every time the presenter client makes mouse events and is periodically accessed by client system in order that listener’s presentation viewer synchronized with that of the presenter.
Advancements of technology and the informatization of society are factors that paved the way for shifting the teaching methodologies in higher educational system from the traditional classroom-based method to the use of information and communications technology. In recent years, Internet-based teaching and learning technologies have been widely available enabling e-Learning to become a major form of educational methodology addressing time-limitation and location-limitation between teacher and students . e-Learning infrastructure can be easily carried out because of the advancement in internetworking technologies, multimedia information processing technologies, and software technologies at lower cost and higher quality in a global scale .
Unlike e-Learning in middle school and undergraduate programs where course management and automated student assessment are typical features, in higher education, particularly in the graduate school, the system should support self-learning, group meetings, and research presentations [3–6]. The characteristics of an e-Learning system for higher education based on information technology perspective can be best deduced from the three areas as follows:
Activities: A system must support online activities, such as group distance meetings, multi-point distribution of oral presentation in conferences, online collaboration with professors and other researchers in academe and industries, and other similar scenarios.
Tools and Materials: A system must have powerful authoring tool so that professors and students alike can create and edit their own presentation materials on their personal computers. Users should be able to utilize various contents in the form of PDF, PPT and other office documents on various operating systems, such as Windows, Mac OS and Linux.
Behavior: A system must support slide-based presentation and multimedia content, such as audio and video. Users should be able to make comment and annotation to the presentation material and must also be available during online meeting and discussion.
In carrying out the demands of higher education in view of information technology, an e-Meeting system is strongly requested rather than a typical learning management system (LMS) [7, 8]. An effective e-Meeting system requires primary features like online slide presentation, online annotation, chat messaging and video conferencing system. Although there are a lot of similar systems, but it is very rare to find an all-in-one system that really answer the need to support e-Meeting for higher education.
In this paper, we discuss the development of a shared virtual presentation board (VPB) for e-Meeting system on the Web-based e-Learning System (WebELS) platform. VPB is a master copy of the presenter’s presentation panel environment, stored onto the server and used to achieve slide presentation synchronization between the presenter and the listeners. Synchronization in our context refers to real-time mirroring of slide presentation events that include slide controls for slide changing, vertical and horizontal scrolling, panning, zooming, cursor positioning, annotation, and playback control for video embedded on the slide. The system has a video conferencing function that provides an audio-video communication among the meeting participants. An effective e-Meeting is made possible by combining the online slide presentation and video conference system to create a so-called virtual room, where meeting participants convene via the Internet.
Review of online presentation technologies
With the fast-paced development of Internet application technologies, various online presentation tools have become widely available. We describe some popular related technologies according to their core design, such as screen sharing, document sharing and slide synchronization. We also discuss the benefits and drawbacks for each in view of e-Meeting application for higher education.
Screen sharing technology
Screen sharing technology allows one to transmit the desktop static image of his computer to one or more remotely connected users in the network. Some screen sharing systems allow remote control which shares the ability to control the keyboard and mouse to other users. Some systems that use screen sharing are VNC , Skype , GoToMeeting , WebEx , TeamViewer , join.me , to name a few.
The advantage of screen sharing technique is that presenter can show various applications on his desktop and be seen by other participants. In view of e-Meeting however, presenter have to be careful that sensitive information is not displayed as it can be visible to other meeting participants. Another drawback of screen-sharing technology is the reduced graphic quality that small text cannot be easily read or small objects cannot be easily recognized. Screen sharing technique works well in broadband, but may not operate well in narrowband as it utilizes greater bandwidth for transmitting of encoded pixel data of screen image. Bandwidth demand gets very high if there is a lot of pixel change at a short time, such as when scrolling a window or showing animated presentation may take several seconds to completely display the image at remote site. Another major drawback of screen sharing is that it requires advanced network address translation (NAT), firewall and router configuration such as port forwarding in order for the connection to go through. Other systems are also limited to peer-to-peer connection, and does not support multi-user. Since it is not a web-based system, it is necessary to download and install the software before screen sharing can start up. Some screen sharing systems have an integrated support to Voice over Internet Protocol (VoIP) or teleconferencing (telephone) to realize an e-Meeting. But others do not have and users have to use other VoIP system.
Document sharing technology
Document sharing tools are sometimes referred to as online presentation tool because it is possible to share presentation files online. Some document sharing tools allow one to create a PowerPoint presentation online or upload an existing PowerPoint file onto the server. Other users can then view and edit the shared presentation, such as Google Docs  and SlideRocket , while others allow anyone to view only but does not allow editing, such as authorSTREAM  and SlideShare . Some systems support various file formats , but others only support PowerPoint [16–18]. Users sharing a document is not required to be online at a time, thus there is no real time interaction among the users. Document sharing does not employ integrated support for VoIP as the main purpose is to share documents.
Slide-based synchronization technology
Slide-based synchronization technology refers to mirroring of the presentation panel among the meeting participants, i.e., what the presenter see on his display panel will also be replicated on the listeners’ display panel. Some popular systems that use slide synchronization are V-Cube , Adobe Connect , BigBlueButton , among others. During online presentation, MS PowerPoint or PDF file is uploaded on-the-fly by the client presenter to the server. At the server, the uploaded file is converted to an image format before it can be viewed by the users. For instance, however, the file document to be uploaded is considerably large, conversion process may take a lot of time, and this may cause delay on the meeting proceedings. It is even more time consuming if the there are several file documents to be used in the meeting. Furthermore, these systems use streaming mechanism to deliver the slide presentation to each connected user. However, images loaded as slides becomes blurred, distorted, and have poor quality as compared to the original. This has been widely reported problem on Flash-based images, and hopefully solution will be on its way. On the brighter side, most web-based conferencing technologies today have built-in audio-video communication support.
WebELS platform overview
System design concepts
WebELS is designed to provide an advanced e-Learning platform for globalizing higher education in science and technology focusing on authoring and dissemination of multimedia contents, aiming to assist instructors to archive their learning materials on the web for on-demand learning and to support online meeting .
The design concepts of WebELS can be summarized in the following:
Supports asynchronous and synchronous e-Learning, i.e., on-demand self-learning and multi-location Internet-based meeting,
Powerful and easy-to-use content authoring function that supports various documents,
User-friendly interface for novice and non-IT users,
Supports multi-operating systems and multi-browser,
Must be available “anywhere and anytime” and must work even in strict firewall and proxy settings,
Should be available not only in advanced countries where broadband Internet is widely used but also in developing countries such as in Asia and Africa where narrowband Internet is normally used .
WebELS is a Java-based client–server system built with applets and JSP/servlets technology for client and server side programs, respectively. Java applets are used for content authoring and online slide presentation viewing, which requires the users' browser to have Java Runtime Environment (JRE) plug-in. For audio-video conference system, Red5 streaming server is used, and requires the users to have Adobe Flash Player plug-in installed on their computer. The main components required for the WebELS server system are the following: Linux Operating System, Apache HTTP Server, Apache Tomcat, Open JDK, MySQL, Red5 Media Server, FFmpeg, and Apache OpenOffice.
WebELS meeting module
Also in Figure 1, content authoring is done using the Java-based content Editor downloaded from the server. Content authoring using the Editor can achieve three operations, such as creating new content, editing content, and importing content from other servers. Existing file in various formats can be used, such as portable document format file (*.pdf), slide presentation file (*.ppt, *.pptx, *.odp), spreadsheet file (*.xls, *.xlsx, *.ods) and word processing file (*.doc, *.docx, *.odt). Files are converted to slide images either at the client or at the server. To create high-quality slides images, MS Office files are converted locally if there exists an MS Office application on the client system, then it is uploaded to the server. When there is none, files are uploaded to the server and are automatically converted into images by using OpenOffice and GhostScript. PDF and OpenOffice files are converted at the server by default. Video files (*.mpg, *.mov, *.avi) can also be embedded onto a special slide template which is possible to playback when viewing the content.
A virtual room is assigned to each created content and stored on the server. Each user accessing the same content will be able to join a meeting. In Figure 1, joining an e-Meeting requires the user to download the content and the presentation panel. The system stores the downloaded content onto the temporary folder, unzip the content package, and then load the slide images onto the presentation panel. The system prompts the user for username, and when done, displays the online presentation panel.
Online presentation has two user modes, namely (1) Presenter Mode, and (2) Listener Mode. In presenter mode, the user has over-all control of slide change, cursor position, zooming function and annotation function. Users in listener mode can only monitor who have joined the presentation, but does not have the rights to control the slides. The listener’s presentation panel serves as a passive listener where it displays what is on the presenter’s presentation panel.
The online presentation system implements the concept of a shared virtual presentation board. In this concept, a master copy of the presenter’s presentation panel environment is stored onto the server, and used to achieve slide presentation synchronization between the presenter and the listeners. VPB data is updated by the presenter by sending the information in its presentation panel every time there is a user slide event, such as mouse click, mouse drag or button press. Listener of the same content retrieves the VPB data by polling the server, and thus be able to replicate in their presentation panel similar to what is in the presenter’s presentation panel.
Synchronized online presentation
Online presentation panel
Online presentation features
Slide Synchronization. A technique for real-time mirroring of slide presentation between the presenter and listener. The presentation control panel is equipped with slide control buttons (first slide, next slide, previous slide, and last slide) that enables slide changing by the presenter, which is synchronized on the listeners’ presentation display panel.
Cursor-based Presentation. A heavy red crosshair cursor displayed as a pointer which guides the listener on which part of the slide is being presented. When the presenter moves the default cursor and clicks at a certain position on the presentation display panel, a heavy red crosshair cursor appears, and will also be displayed on the listeners’ presentation display panel. See Figure 4a.
Pen-based Presentation. A pen-like function during the presentation for writing annotation. Annotation on the presentation display panel is simply done like a freehand drawing. By pressing the left-hand mouse and holding it steadily, drag the thin crosshair cursor which in turn writes your desired object. Pen color and size can be selected. See Figure 4b.
Slide Zoom Function. Slide zooming function is necessary when text or object on the slide are not readable or visible during online presentation as in Figure 4c. It is also worth mentioning that cursor and annotation function is also possible even in zoomed-in presentation display panel. The annotated object after zooming out is scaled down equally the same as the slide.
Video Playback Function. Various video content formats (*.mov, *.avi, *.mpg) can be embedded onto the slides. Video playback functions such as start, stop and pause are also made to synchronize between the presenter and the listener.
Virtual presentation board concept
VPB data structure
The fields of the VPB static data structure are detailed in the following:
presenter_status – an integer data type that tells whether there is a presenter in the online presentation or not. This flag is used to implement one-presenter policy.
presentation_mode – an integer data type that tells the mode of presentation whether cursor-based or annotation-based.
slide_number – an integer data type that tells the current slide being used by the presenter.
cursor_xy – both an integer data type for the x value and y value of the cursor position relative to the display panel.
current_zoom – both a double data type for current zoom-in scale and current zoom-out scale of the display panel.
new_screen_zoom – both an integer data type that tells whether the display panel needs to be fixed or not after a zoom function.
frame_size_xy – both an integer data type that tells the frame size of the presenter panel, which is used in calculating the listener’s slide image to avoid mismatched display area.
scrollbar_xy – both an integer data type for x and y scrollbar value that control horizontal and vertical view positions, respectively.
video_mode – an integer data type that represents the mode for video functions whether start, pause, restart and stop.
video_time – an integer data type that specifies the time in milliseconds when video mode is either stop or set time.
The VPB dynamic data are stored onto the vector memory that implements a growing array of objects. The dynamic data structure fields are detailed in the following:
pen_color – three integer data types for RGB components of a color object.
pen_size – float data type used for defining line width with default cap and joint styles rendered with Java Graphics2D object.
start_mouseDragged_xy – both an integer data type for x and y values of cursor position relative to the display panel after the mouse is clicked, kept holding the left-button and dragged.
end_mouseDragged_xy – both an integer data type for x and y values of cursor position relative to the display panel after the mouse is released from mouse dragged event.
Audio-video communication support
WebELS Meeting is equipped with a video conferencing system that provides audio-video communication among the users in a shared virtual room. With this system, effective e-Meeting can take place because users can discuss in a face-to-face like environment alongside with the online synchronized slide presentation.
The video conference system adopted by WebELS uses Real Time Messaging Protocol (RTMP). RTMP is a protocol used for streaming audio, video and data over the Internet between Flash player on client side and streaming server. The Red5 streaming server uses port 443 (the default for HTTPS) as RTMP port, however it switches automatically to RTMP Tunneled (RTMPT) when the network communication cannot transverse through firewall due to security issues of certain network location. In RTMPT, RTMP data is encapsulated and exchanged via HTTP, and messages from the client, i.e., the Flash media player, are addressed to port 80 (the default for HTTP) on the server. The reason that we don’t use RTMPT from the beginning of the network connection is because the speed of communication via RTMPT is slower than RTMP, where we want to keep the quality of audio-video communication as high as possible.
Parameters for audio-video quality have been optimized in order for the system to adapt the users’ network environment without suffering from bad audio-video quality. These parameters include video resolution, video frame rate, video encoding quality, and audio sampling rate are used to provide three video quality settings such as low, medium and high, which can be selected in manual or automatic mode.
The system has administrator functions for keeping an orderly flow of the e-Meeting. Several administrator functions are mute user, mute all, set presenter, and block user. The system also has an automatic reconnection function that monitors the network connection status. When the network connection is lost, it waits for the new connection to establish, and login process automatically starts again by using the latest user environment and conference information .
Performance evaluation and discussion
Presentation image quality
As for the Flash-based online presentation systems, slide presentation file is also converted into series of slide images. During the meeting, when the presenter share the slide image, the URL link for that image is shared unto the server via a message stream, which in turn is shared to the connected clients. Clients get the image from the server using the URL link. Image quality in Flash is blurry that small text cannot be recognized anymore as shown in the inset in Figure 7c. The image sharing process is handled by a shared object class which offer real-time data and object sharing between multiple Flash application clients or remote server .
In presentation using screen sharing technology, image quality becomes degraded because it requires compression algorithms in order to transmit huge data in real-time. Sophisticated compression algorithms produce encoded image size around 100 kbytes for 800 × 600 true color screen image (i.e., 1.44 Mbytes in size) . With this data size and moderate frame rate, however, it is still required to use broadband Internet for better quality. Image rendering at the client side experience flickering resulting to distorted image when the presenter changes the slide or scrolls the window that takes several seconds to completely display the image as shown in Figure 7d.
Comparing all three technologies for image quality in online presentation, WebELS Meeting based on Java has the best image quality than in Flash-based online presentation and screen sharing technology. Flash-based images are blurry that small texts are difficult to recognized, while presentation based on the screen sharing have flickering effect resulting to distorted image when changing slide or scrolling window.
Online presentation data size
Online presentation data size and transmit frequency
Data size (bytes)
WebELS VPB Data for cursor-based presentation mode
34 ~ 54
Every slide control events
WebELS VPB Data for pen-based presentation mode
100 ~ 10,000
Every mouse drag release
Flash-based Slide Synchronization (using SharedObject class for fetching the image)
Every slide change
Flash-based Slide Synchronization (using SharedObject class for fetching annotation)
100 ~ 10,000
Every mouse drag release
Compressed Screen Share Image Size
Pre-set frame per second (fps)
Client network bandwidth requirement
Bandwidth utilization depends on the data size transmitted over a period of time between the client and the server. Based on the data in Table 1, WebELS VPB data for cursor-based presentation mode does not pose high bandwidth utilization since the data size is very small and slide control events are not that frequent. For VPB data in pen-based presentation mode, the more annotation is done, the larger the data sent every mouse release. As for the Flash-based online presentation, slide image is transferred from the server to the client every slide change. Though high quality images are typically around 1 Mbytes, slide change is not that frequent that would cause high bandwidth utilization. But in screen sharing technology, there is a requirement for broadband network to achieve better quality. Among the different online presentation technologies, VPB concept works well even in narrowband Internet environment, say a 56 kbps line. On the other hand, slide synchronization delay between the presenter and listener using VPB is minimal because of its optimized data size, and delay would depend mainly on the network distance, i.e., round-trip propagation and transmission delay. Slide synchronization delay of 1 or 2 seconds is negligible in online distance presentation.
Synchronized online slide presentation consumes server resources for every connected user, but not as much as the video conferencing system do. For each video user connected to Red5 streaming server, CPU, memory, and I/O resources are utilized. However, with the current development in computer hardware technology, these are not very critical. The performance bottleneck that limits the number of users the server would accommodate with higher quality of service (QoS) depends on the network channel capacity.
bw – bandwidth for one video stream
n – number of users
In order to increase the number of concurrent users in face-to-face meeting mode, a conservative video quality should be used, i.e., low-quality having a video stream bandwidth of around 72 kbps.
Content-based meeting system
This paper presented the online presentation based on a shared virtual presentation board (VPB) for e-Meeting on the WebELS platform. VPB is a data structure that defines several objects that represents the presentation panel of the presenter. In an e-Meeting, the presenter is the source of VPB data that is sent to the server, the server updates the master copy, the listener polls the server for the data periodically, and the retrieved data is used to set the presentation panel to achieve slide synchronization. Online presentation combined with video conference system creates a so-called virtual room for e-Meeting where participants convene via the Internet.
With VPB concept implemented on a content-based meeting system such as the WebELS Meeting, high-quality e-Meeting performance can be achieved. Meetings proceedings would not be interrupted by necessary on-the-fly uploading of content for presentation, since content must be pre-uploaded before a virtual meeting room is created. Because of this, the system is also suitable for distributing live presentation of the conference proceedings to remote viewers. Moreover, slide images are pre-downloaded on the users’ local computer, thus there is no blurry and distorted slide presentation images. Online presentation can be attained smoothly because slide synchronization delay is minimized due to minimal VPB data that is shared between users and the server. More online presentation features are showcased, such as slide synchronization, cursor synchronization, freehand annotation function, zooming function, and embedded video playback. Moreover, the system works well in narrowband Internet as well as in a cloud environment.
The authors would like to express sincere thanks to all persons who supported the WebELS project of NII, Japan, especially to Dr. Vuthichai Ampornarambeth, Dr. Zheng He and Dr. Pao Sriprasertsuk for contributions in designing and implementing the WebELS system. The project is funded by Science Research Foundation of Japan, The Telecommunications Advancement Foundation, Amada Foundation for Metal Work Technology, Japan Science and Technology Agency (JST) and The Graduate University of Advanced Study (SOKENDAI). We express sincere thanks to Genetec Co. for a collaborative development, and to the e-Learning Project of UNESCO Jakarta Office and the Sahara Solar Breeder (SSB) Project for collaborations using WebELS.
- Ueno H: Internet-Based Distance Learning for Lifelong Engineering Education - A Personal View and Issues. J Inf Syst Educ 2002, 1(1):45–52.Google Scholar
- Blinco K, Mason J, McLean N, Wilson S: Trends and Issues in E-Learning Infrastructure Development. A Whitepaper for alt-i-lab 2004. Prepared on behalf of DEST (Australia) and JISC-CETIS (UK). 2004. http://www.jisc.ac.uk/uploaded_documents/Altilab04-infrastructureV2.pdfGoogle Scholar
- Ampornarambeth V, Zhang T, Hadiana A, Shimamoto N, Ueno H Proceedings of the 5th IASTED International Conference on Web-based Education (WBE'06). In A Web-Based e-Learning Platform for Postgraduate Education. Anaheim, CA, USA: ACTA Press; 2006:388–393.Google Scholar
- Sriprasertsuk P, Berena AJ, Chunwijitra S, Ueno H: A Study on an Open Source for Distance Real-Time Learning Environment. IEICE Technical Report, KBSE 2009, 2009–57: 53–58.Google Scholar
- Ueno H, He Z, Yue J Proceedings of the 13th International Conference on Human-Computer Interaction, Part IV: Interacting in Various Application Domains. In WebELS: A Content-Centered E-Learning Platform for Postgraduate Education in Engineering. CA, USA: Springer-Verlag Berlin Heidelberg; 2009:246–255.Google Scholar
- Berena AJ, Sriprasertsuk P, He Z, Ueno H: An Open Source Integrated e-Learning/e-Communication Platform for Postgraduate Education and Corporate Cyber Meeting. IEICE Technical Report, ET 2009, 109(193):33–37.Google Scholar
- Moodle. 2011. http://moodle.org
- Joomla LMS. 2011. http://www.joomlalms.com
- RealVNC. 2011. http://www.realvnc.com
- Skype. 2011. http://skype.org
- GoToMeeting. 2011. http://www.gotomeeting.com
- WebEx. 2011. http://webex.com
- TeamViewer. 2012. http://www.teamviewer.com
- join.me. 2012. https://join.me
- Google Docs. 2011. http://docs.google.com
- SlideRocket. 2011. http://sliderocket.com
- AuthorStream. 2011. http://www.authorstream.com
- SlideShare. 2012. http://slideshare.com
- V-Cube. 2012. http://vcube.com
- Adobe Connect. 2012. http://adobe.com/products/adobeconnect.html
- BigBlueButton. 2012. http://www.bigbluebutton.org
- WebELS. 2012. http://webels.ex.nii.ac.jp
- He Z, Yue J, Ueno H, WebELS Proceedings of the International Conference on Computer Engineering and Technology. A Multimedia E-Learning Platform for Non-broadband Users 2009, 177–181.Google Scholar
- Chunwijitra S, Berena AJ, Okada H, Ueno H: Design of Suitable Meeting Management Model for WebELS Meeting to Meet the Business Situations. Systems and Applications, Luxembourg: Proceedings of the First International Conference on Advanced Collaborative Networks; 2011:62–67.Google Scholar
- ActionScript Documentation Reference for Adobe Flash Platform. 2012. http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/flash/net/SharedObject.html
- Lin T, Hao P: Compound Image Compression for Real-Time Computer Screen Image Transmission. IEEE Trans Image Process 2005, 14: 993–1005.MathSciNetView ArticleGoogle Scholar
This article is published under license to BioMed Central Ltd. This is an Open Access article distributed under the terms of the Creative Commons Attribution License (http://creativecommons.org/licenses/by/2.0), which permits unrestricted use, distribution, and reproduction in any medium, provided the original work is properly cited.