Journal of Online Mathematics and Its Applications

Volume 6. October 2006. Article ID 1305

Interactive Web-Based Mathematics Communication

Marco Pollanen

Main Contents

  1. Introduction
  2. The enVision Platform
  3. Other Web Technologies to Display Mathematics
  4. Software Specifications
  5. Availability
  6. Learning Outcomes
  7. Resources

Ancillary Topics

1. Introduction

While the Internet offers phenomenal opportunities for communication, most of the available tools for personal interaction, such as e-mail, chatrooms, instant messaging, and bulletin boards, are "text-based." Many subjects, in particular the mathematical sciences, rely heavily on symbols, visual aids and other non-textual communication, with the result that for mathematics much of the interactive potential of the Internet has thus far not been realized.

For mathematicians communicating with colleagues over the Internet, this is a minor annoyance, as PDF files can be exchanged, and the vast majority of mathematicians can read raw TeX notation, for example \int_0^1 x^2 dx, embedded in e-mail. However, mathematical communication over the Internet with students using text, for example via e-mail, can be a slow and frustrating process. First-year students often have enough trouble with the proper use of parentheses in communicating mathematical concepts. In e-mail format, where expressions must be inline, they tend to write statements like x2+1, 1/2x and sin x + y, all of which are ambiguous. Included in integrands or fractions, and combined with Greek letters and subscripts, these expressions can become incomprehensible.

The problem becomes particularly acute for live interactive communication, where students must produce unambiguous equations and diagrams quickly. Over the past decade the Internet has changed the way mathematics is taught. Many introductory math courses are delivered completely online, and even more are available in hybrid format. Since most theories of education maintain that personal interaction -- whether teacher to student, student to teacher or student to student -- is a cornerstone of learning, this presents a serious challenge for mathematics educators. Many online courses have little live interaction, and allow students to access only course outlines, notes and assignments, post to message boards and send e-mail. The more interactive online courses available today still provide only a text-based chatroom or a whiteboard, which can be inadequate for communication in a visual subject such as mathematics. Furthermore, because these technologies are cumbersome for communicating mathematical content, they tend not to be utilized by a significant portion of students.

In this article I will introduce and discuss my experiences with incorporating into teaching a new technology I have created, called enVision, that aids in communicating mathematical content. While there is significant potential for this software in online courses, in this article I will focus on my experiences with using this technology to hold anonymous online office hours in a traditional course. While office hours are a valuable and unique teaching tool, it is a common observation that students in introductory mathematics courses do not attend them. Many feel confused and intimidated by mathematics and do not want to reveal how little they think they know. This in itself is a communication barrier that impedes learning in mathematics and presents a missed opportunity for both student and instructor. In my experience, enVision has helped make me, as a math educator, more accessible to students, and has helped students reduce or overcome any shyness or math phobia they may have.

2. The enVision Platform


The enVision platform consists of two packages, a front end -- the enVision Web interface -- and a back-end server, called MathServer. The enVision interface is what a typical user will see and interact with. It loads into a standard Web browser with no installation, and helps users input and communicate their ideas. It has two communication components: a shared workspace, where any number of participants interact with each other in a mathematical discussion, and a text chat window, where most of the other discussion occurs. The shared work space is essentially a whiteboard drawing program that has special drag-and-drop resizeable math symbols, as well as a panel of special math characters that can be placed with ease onto the whiteboard. Everything that is written on the whiteboard and the chat area is visible to all participants. MathServer is the application that relays the information between different users to ensure that their enVision interfaces are synchronized, thus creating and maintaining a shared workspace.

Figure 1. Student Mode view of enVision interface (Internet Explorer browser)

The core philosophy of enVision is simplicity and ease of use, i.e., allowing for the communication of mathematical content as easily and quickly as possible with a minimal learning curve, for both student and instructor, and minimal hardware and software requirements. The emphasis is on communication in a quick and intuitive fashion, rather than having typeset letter-perfect documents.

In order to keep the program platform independent and accessible to low-bandwidth users, enVision supports a core set of functionalities. It makes it possible to load JPEG and GIF images, which could easily be extracted from applications like Maple, or from PDF documents, with freely available programs like ImageMagick. Likewise, it is assumed that if video or audio are desired features, appropriate packages could be loaded simultaneously. Although enVision is easy to install and maintain, it also has advanced features that allow for integration and customization into existing environments such as Blackboard and WebCT. In short, the program can be easily installed and running in minutes as is, but it is also flexible and can be customized by those who are inclined to do so.

enVision Web Interface

Most of the interface options are accessed through the orange/pink button panel on the left-hand side of the interface or the tabbed panels on top of the applet. For more information, please read the detailed description of the enVision interface.

Figure 2. Instructor Mode view of enVision interface displaying PDF (Linux with Firefox browser)


MathServer is a simple program that runs on the web server from which the enVision applet is downloaded. Only the system administrator installing MathServer would have to be concerned with it, as it is invisible to other users. It has two functions: to receive and distribute any content input by enVision users which is then displayed for all users on the whiteboard, and to load and save sessions. MathServer must be running in order for different enVision users to communicate with each other.

3. Other Web Technologies to Display Mathematics

While the goal of enVision is the easy input and live communication of mathematics over the Internet, it is important to discuss how it relates to the many existing technologies to display mathematics on the Web.

The most widespread solution to displaying mathematics on the Web is undoubtedly LaTeX2HTML and variants such as those used by the online encyclopedia Wikipedia and the interactive mathematics server WIMS. With this solution, mathematical symbols and entire equations are displayed as individual images. The strengths of LaTeX2HTML are that TeX-style notation is the standard in mathematical typesetting and is well-known in the mathematical community, that TeX is fairly easily human-readable, and that existing documents can easily be put on the Web and displayed in older browsers without plug-ins. Of course, there are many serious disadvantages: having many images on the page can make loading slow, images are difficult to edit and are not scalable and so do not render well on high-resolution devices, such as printers. There are other programs based on TeX notation, such as Java applet-based solutions like HotEQN and JavaScript-based solutions like jsMath.

The emerging standard for displaying mathematics on the Web, however, is MathML, the Mathematics Markup Language. MathML is a standard endorsed by the W3 Consortium (the official standards body of the Web), and represents the future of mathematics on the Web. It is XML-based and allows browsers to render mathematics natively in much the same way browsers render HTML. While TeX does an excellent job of encoding the presentation of an expression, the goal of MathML is to encode structural and semantic information as well. MathML is intended to:

  1. Allow documents to be easily displayed in browsers and applications with different capabilities (for example, documents can be formatted for displays of different dimensions and resolutions).
  2. Allow equations to be easily imported and exported between different applications (for example, between a browser and Maple).
  3. Make mathematics on the Web more accessible to the visually impaired.

However, while human-legible, MathML it is fairly verbose. For the purposes of comparison, the expression x2 + 3x + 1 can be written in MathML as

  <msup> <mi>x</mi><mn>2</mn> </msup>

while the equivalent TeX expression is simply $x^2+3x+1$.

There are, however, both free and commercial tools that aid in the easier input of MathML. For example, ASCIIMathML is a free JavaScript solution that allows simple calculator-type expressions, such as `x^2+3x+1`, entered in HTML pages to be dynamically displayed using MathML. A variant, LaTeXMathML, allows the same for LaTeX-type expressions. While WebEQ from Design Science is a commercial product that includes a MathML equation editor and a server to create MathML-based Web applications such as message boards.

As MathML does not specify its own "input method" for users to easily input mathematics, it will not by itself replace the need for enVision. It will be important for future versions of enVision to attempt to incorporate some support for MathML to allow the import and export of content and help enVision be accessible to the visually impaired. However, as the complexity of MathML dwarfs that of enVision, this remains a distant goal.

One problem in adopting MathML standards for rendering equations in enVision is that we actually want enVision to display equations "exactly" the same way, regardless of the platform. Otherwise, it would be difficult for users to overlay position dependent information like that which comes from a tablet pen, for example when drawing arrows between equations by hand. How enVision is currently designed to work is closer to the way PDF documents are displayed, they are rendered very consistently between operating systems and devices such as printers.

Variability in rendering between systems has already been a challenge in the design of the current version of enVision. Browser display technologies such as Java, Flash, and SVG rely heavily on the system fonts of the user, which may not be the same from system to system. This is why enVision uses the fixed-spaced Courier font on the whiteboard (this font is actually slightly different in the Windows, Linux, and Mac operating systems, but some other system fonts are different enough to be unusable).

4. Software Specifications

enVision Interface

The enVision Web interface is a Java applet which the instructor and the student load by visiting the appropriate pages with their browsers. The applet is designed to be very small, approximately 58KB (about the size of an average web page), so that it can be loaded without delay by large numbers of students simultaneously and by users with dial-up connections. It is designed to be as platform-independent as possible, so it will run on any browser that supports at least Java 1.1, including the outdated Java Virtual Machine shipped with a default Internet Explorer installation. Thus, virtually any student with access to the Internet would be able to use the enVision interface. However, if you download the latest Java plug-in, it will run in virtually any other browser. To date, it has been tested on numerous configurations of Internet Explorer, Netscape, Mozilla Firefox, Safari and Opera, as well as various Windows, Mac, and Linux operating systems, without any major issues arising.

If MathServer is running, the instructor must ensure that the enVision.jar and HTML page(s) that load it are accessible on the Web server. Then, all the instructor has to do to log on is load the appropriate Web page into his/her browser. For students, all that is required is to load the appropriate Web page into their browsers. Note, however, that the instructor can make a number of customizations by changing the applet parameters in the HTML page that loads enVision.

Optional Applet Parameters:

<param name=host value=>   
<!-- This sets the IP address that enVision will connect to (it is a good idea to set it). -->
<param name=port value=8000>        
<!-- This sets the port to the given value. The default is 8080. -->
<param name=instructor value=true>  
<!-- This sets the applet to instructor mode. The default is student mode. -->
<param name=username value=UserName>
<!-- This sets the username (useful if you have your own authentication script). -->
<param name=announce value=false>   
<!-- This turns off the log in/out announcements in the Chat Window
     (especially useful in large classes).-->

Instructor and student modes are similar, although they must be accessed from separate HTML pages. There are, however, several noteworthy differences. Students cannot load and save sessions and images, but the instructor could let students access this mode to load and save sessions after class. Instructors also have the ability to lock the whiteboard, using the <F12> key, so that no student can write on the board. If this is done, other instructors may still write on the board. In this mode, both students and instructors can still write to the chat window. The locked status is displayed on the title bar. Using the <F12> key when in locked mode would then unlock the whiteboard.

The images that are used in the More Symbols panel are located in the enVision.jar Java Archive as files 0.gif to 119.gif, numbered in the order in which they appear on the panel. The instructor could customize them, so as to use different symbols instead, by replacing the existing GIF file with another.


MathServer is a platform-independent Java application. It must be running on the Web server from which the user's browser loads the enVision applet. To start MathServer, the instructor must have permission to run processes on the Web server or have the system administrator start it.

Provided Java is installed on the server, MathServer is started by issuing the command "java -jar MathServer.jar" followed by an optional port number. (The default port is 8080.) Any firewall software running on the Web server must be set to allow access to the port that MathServer is set to listen to. When the enVision applet is loaded and the server is running, "** Connected to MathServer **" should appear in the Chat Window. If it does not appear, there is either a problem with the firewall or the IP/port settings in the applet tags.

If a subdirectory called "files" exists, the server will load and save sessions in that directory using the .mth extension. Note that if you wish to load images (GIF and JPEG formats are supported), they must be located in the directory (or subdirectory) from which the enVision applet was loaded (not the "files" subdirectory).

External Applications

As enVision only allows for the loading of images in GIF and JPEG format, one could also consider installing an image conversion tool. As long as the instructor can transfer the resulting images to the Web server, these tools can run on any machine that the instructor has access to. ImageMagick is a free cross-platform utility useful for obtaining and manipulating images for use in enVision from other programs, such as Maple. For example, the command "convert file.pdf[8] file.gif" would extract page 9 (as it assumes pages start from the number 0) of a PDF file and save it as a GIF file, and the command "import file.gif" can be used to create a GIF image from a region of the screen, and thus a screenshot of virtually any application can be loaded into enVision.

More Technical Details

Please read the technical details for more information.

5. Availability

enVision v1.1 is freeware. You can download a copy, try a demo version, and find documentation and updates at the enVision web site

Figure 3. Overview of enVision basic installation
Image: insall.png

6. Learning Outcomes

I have used enVision successfully in large and small class settings, at both large and small universities.

I created the first version of enVision in 2000, while I was a teaching assistant at the University of Toronto. I tried to make myself as accessible to students as possible. However, at the time, I taught multiple sections of introductory calculus tutorials, including some in the evenings (students in these sections were often employed full-time during the day) and some at a distant suburban campus (students would have difficulty meeting me downtown at my office). A live online office hour was the best practical option in order for my students and myself to be able to communicate.

More recently, I have been teaching at Trent University, a smaller liberal arts university, and have been using enVision in a second-year discrete mathematics class of about 25 students. As the course is primarily for computer science majors, students generally feel apprehensive about mathematics. Since enVision was originally conceived as a tool for large or multi-section classes, I have only recently started to experiment with it in this course. I currently supplement my regular office hours with one extra online office hour, during which students can log on anonymously (i.e., using any name they wish). The results have been impressive. Communication has improved; at times, up to half the students in the class attend the online office hour simultaneously.

Based on my experiences, anonymous online office hours are advantageous for addressing the following issues:

Survey Results

An in-class survey was conducted to gauge the effectiveness of online office hours. It was conducted six weeks into a 12-week semester of a second-year discrete mathematics course at Trent University, after four weekly online office hours had been held. Students were asked if they attended the online sessions and were encourage to comment. Nineteen surveys were completed, and 47% of students said that they attended some of the hours. A few students who did not attend added comments that they would like to have attended but were unavailable at the time. Comments were positive regarding online office hours. Some notable comments included the following:


Although interactive Web-based communication is not a substitute for face-to-face interaction, enVision does help facilitate online mathematical discussion. In particular, as today's students tend to be relaxed and comfortable with e-mail and instant messaging, they seem to be open to online office hours, and holding virtual office hours seems to have a number of pedagogical benefits when appropriate communication tools are available. This technology could also be used to encourage more dialogue between students in a student-helping-student model of learning, especially in a completely Web-based course.

7. Resources


Graphics and course management

Math on the web