See all apps

High Quality Open Source Web Conferencing

Submitted on April 03, 2013

What problem are you intending to solve?

Every student with a browser should have access to high-quality education. We intend to make that possible with BigBlueButton.

What is the technological approach, or development roadmap?

We want to create a high-quality web conferencing system using HTML5 for the interface and WebRTC for the real-time communications.

We already have an open source web conferencing system to build upon: BigBlueButton, which we have been working on for over four years. The BigBlueButton platform provides a real-time sharing of slides, chat, voice integration with phone switches (FreeSWITCH), desktop sharing, recording and playback of sessions, and an API for 3rd party integration. We have supported integrations with many popular open source systems, including Moodle, Sakai, Joomla, Drupal, and Wordpress.

However, the BigBlueButton client uses Flash running within the browser.

With the advent of HTML5 browsers and real-time communications framework for the web (WebRTC), we intend to add support for a native HTML5 client that uses WebRTC for two-way communication, thus providing a greater accessibility to on-line learning, and scaling BigBlueButton larger (hundreds) of simultaneous users.

We’ve broken this project into three phases, each phase builds on the previous.

Phase 1: Create a HTML5 client that can join and view a live on-line session (view slides, view users, two-way chat, and receive audio/video from teacher)

Phase 2: Enhance the HTML5 client to support two-way audio and video using WebRTC.

Phase 3: Enhance the HTML5 client to include all of BigBlueButton’s presentation features.

  • Update #1: January 31, 2013 *

Since the last submission we shifted our efforts to integrating WebRTC into BigBlueButton. With WebRTC we should achieve higher quality audio and video, which further enhances BigBlueButton for the use cases of one-to-one tutoring and small group collaboration.

(1) We held a two-day BigBlueButton Summit and HackFest in Ottawa, Ontario, Canada, were a group of the BigBlueButton developers came together and did code sprints on the HTML5 client link (posted Dec 6, 2012) (2) We continued to revise the user interface on the HTML5 client link (posted Dec 28, 2012) (3) We held a live test of the HTML5 prototype with Dearborn Michigan Public Schools link (posted Jan 15, 2013)

The HTML5 client will use socket.io to communicate with a node.js server for real-time updates of events. The HTML5 client will receive a stream of audio and video from a WebM streaming server. You can see two videos showing our progress on implementing Phase 1: video #1 (posted Oct 2, 2012) video #2 (posted Oct 25, 2012).

We foresee a challenge with Phase 2: WebRTC is designed for P2P applications. However, to enable recording of the audio and video in a BigBlueButton session, we need the WebRTC streams to connect to a central server.

  • Update #2: April 3, 2013 *

We've started prototyping Phase 2: Enhance the HTML5 client to support two-way audio and video using WebRTC.

For comparison, the audio latency in the current BigBlueButton Flash client is 1 to 2 seconds. With a 2 second delay, there is a tendancy for one person to speak over another. Integration of WebRTC will provide a higher-quality audio and lower latency audio than Flash. This improvement in audio will directly benefit two of our primary educational use cases: (1) virtual office hours and student coaching (one-on-one), and (2) small group collaboration (many-to-many).<br/>

We explored integrating WebRTC in two approaches: (a) integrating WebRTC peer-to-peer into BigBlueButton HTML5 client and (b) integrating WebRTC Audio connecting to the BigBlueButton Server link (posted April 3, 2013).

We successfully prototyped both (a) and (b) and demonstrated the results at the Kansas City Gig Fest (March 24, 2013). For (b), we achieved an audio latency was less than one second, which makes BigBlueButton much more attractive to one-on-one and small group collaboration.

Looking ahead, we need to figure out how to leverage WebRTC video, which will require adding a multipoint control unit (MCU) server that can bridge video from both WebRTC and Flash. We need both the audio and video to go through the BigBlueButton server so we can record and playback the sessions for students. We also need to merge in this work for HTML5 + WebRTC into the core of BigBlueButton so it's available to everyone, which is planned for after the release of 0.81.

How will end users interact with it, and how will they benefit?

Consider a student joining a remote class. The student would log into the schools learning content management system (such as Moodle or Sakai), navigate to their course, and click a link to join the class. Their browser would launch the BigBlueButton HTML5 client. From within the client, student would see the teacher, hear the teacher, view the slides, and do two-way chat with other students. The student should be able to join from any desktop, tablet, or smart phone running an HTML5 compatible browser. Furthermore, with a WebRTC capable browser, students could broadcast and receive high-quality audio and video. Students would benefit from the ability to participate in a remote class, regardless of their location in the world. And because the class is recorded, they could review the material as often as needed. Universities, colleges, and high schools would save money over equivalent commercial products. The benefits accrue to gifted students as well. For example, in rural high schools that do not have the means to provide a gifted student the special classes, a central high school could offer advanced classes for those remote students to help accelerate learning with very little additional cost.

How will your app leverage the 1Gbps, sliceable and deeply programmable network?

Today, BigBlueButton uses Flash to broadcast videos using H.263 (sorenson codec) in 320x240. With 1Gbps bandwidth and WebRTC, the video broadcasted to remote users could be HD (720p or 1080p), enabling specialized modes of remote learning (such as medical procedures) that are currently only possible with extremely high-end (and expensive) systems. There is a trend today towards offering massively open online courses (MOOCs). With a 1Gbps network and BigBlueButton, a school could have hundreds (perhaps even thousands) of remote students attending a class on-line, each enjoying a high quality audio, video, and display of presentation. We want to offer a complete open source solution for MOOCS.

Further application information

Additional supporting information, materials and resources

Read about project updates - project blog

Take a look at the existing code - project repository

Will your work be beta-ready by the end of the Development Challenge?

All of our work is available via the BigBlueButton project. We'll be making components available as we implement. We expect to have a working beta of the HTML5 client + WebRTC by the end of the development challenge.

How much effort do you expect this work to take?

We have been working on implementing the HTML5 interface since June 2012. As of April 3, 2013 we now have a working prototype of the HTML5 client (built on a branch of BigBlueButton's code base). We are working on the HTML5 client in parallel to our current release track for BigBlueButton. Our plan is to finish the current release of BigBlueButton .81 (expected release in Q2 of 2013) and merge in the HTML5 + WebRTC work subsequent to that release. As the work on Phase 1 solififies, we'll be starting to prototype using WebRTC and the challenges for implementing or integrating a WebRTC server. (We need a server-based solution for recording the audio/video streams).

Do you need help?

We will need help from developers who are familiar with the WebRTC implementation. We need access to high-speed networks to test the scalability of the HTML5 client.

If you can help let them know in the comments below.

Fred Dixon

I am the project manager for BigBlueButton, an open source web conferencing system for distance education.

and team members

The team of BigBlueButton includes Richard Alam (Chief Architect), Fred Dixon (product manager), Marcos Calderon (server), Gustavo Salsar (Record and Playback), Felipe Cengano (client), and Tiago Jacobs (red5). In addition, we have a number of students working on the project: Justin Robinson and Chad Pikley (Seneca College), and Calvin Walton (Carleton University). Tyler Copeland is a graphic designer that will be working on the mock-ups for the HTML5 interface. We're working closely with Chris Kenniburg, webmaster at Dearborn Public Schools in Michigan, to refine and test the HTML5 interface. Dearborn Public Schools has been using BigBlueButton for over two years now and has provided financial support to the open source project for improving the integration with WordPress. Dearborn Public Schools uses BigBlueButton with Wordpress Multisite and Moodle. Many schools in the district are purchasing iPads for classroom use and the HTML5 interface would allow students to utilize BigBlueButton as a communication tool on these devices. Richard Alam and Marcos Calderon will work on modifying the BigBlueButton architecture to integrate all the on-line session events (join, leave, display slides, whiteboard shapes, mouse movements, pan/zoom, etc.) with the HTML5 client. Felipe, Calvin, Justin, and Chad will work on (a) implementing Tyler's UI for the HTML5 client. Calvin will work on creating a streaming server for broadcasting audio/video via WebM and (c) prototyping a WebRTC server. Fred and Gustavo will help test. To coordinate activity amongst the team, we'll be using BigBlueButton itself (specifically the Flash-based client until the HTML5-based client is far enough in its implementation to support two-way audio and video).

comments powered by Disqus