Jack, H., “Developing Multimedia Courseware for the Web”, ASEE North Central Section Conference Proceedings, Dayton Ohio, April 1997.



Hugh Jack

Padnos School of Engineering

Grand Valley State University

Grand Rapids, Michigan



The author has developed a large quantity of course content that is now located on the world wide web. This can be a powerful tool for public presentations, such as lectures. It may also provide strong support for students outside lectures. The author will discuss how to develop such on-line materials using commonly available tools and techniques. A number of challenges and opportunities are described to help guide those considering a similar development.



Paper books are designed to be read from one cover to the other. What happens in between the covers is a linear development of theories, concepts and details. A number of editorial questions must be answered along the way, such as,

- At what intellectual level should the material be presented?

- What background should the reader have?

- What material is essential, and what will be considered excessive?

- How will photographs and other media be provided and used?

- Are there any significant technical errors?

- What does the reader expect in the book?

- Is the book marketable?

The answers to these questions shape a book into a single form. It is the answers to these questions that make a book so effective, but also limit its use. In effect the book becomes a static snapshot of information that is captured on paper for a narrow audience. As a reader you will have certain expectations of a book. Consider the example of books instructing the use of various software packages. Some books are very simplistic (claiming they are for ‘dummies’), while others discuss the intimate details of the hardware and software. If we were to take the hundreds of books available for Microsoft Windows and look at content they could probably be condensed down into a few volumes. If we were free to select chapters and information, we could obtain a more useful and complete book, but this is not reasonable with modern printing techniques.


The value of computer based books has long been known, but rarely implemented. The best examples of early computer based books are user/help manuals for many computer programs and operating systems. Many of these would allow a user to hop about between descriptions and reference information as they search for solutions to problems. One of the most extensive on-line document is the Unix ‘man’ pages. When printed these fill about three feet of shelf space. The electronic version contains the same information but it can also be searched, and provide the same information at a very high speed. And, as new software is installed in the system, software specific manual pages are added to the others in the system. As a result, it is unusual to find a Unix system that is shipped with any manuals. Another popular approach to electronic books is a database type program that stores snips of information on-line. The user then uses a proprietary user interface to view these items of text, sound, pictures and video. The reader can search and link to other documents by using the mouse. These platforms can be extremely powerful, but they are tightly controlled by the software vendor.


The World Wide Web (Web) is essentially one large interlinked document. The browsers, such as Netscape, enhanced the basic hypertext documents with graphics (pictures and videos), sounds, programming (Java), and any other application that the client computer will run. As a result, most software vendors are actively trying to produce products that use the format of the Web, HyperText Markup Language (HTML). The world wide web now presents us with the capability to create complex documents that can be viewed on any number of platforms with different versions of software. The documents for the web can be created easily by hand, or by using specialized software, and most importantly with our word processors.





We must be realistic when looking at the Web for presenting material. Simply converting a book to appear on the Web, in the same format as on paper provides little benefit. In general there are design (style) issues to consider when developing a Web book,

- written text is bulky and hard to read, point form or highly condensed text is better.

- the material should be cut up into small sections, a single printed page is a good size, but more or less can be used as required.

- a good directory structure is needed to organize the information. This should be done before doing any large scale development of the Web site. Cut the information up and organize by major and minor topic areas. (don’t worry if these are not perfect, you can adjust this later when setting up tables of content.)

- the need to worry about fonts and layout (e.g. pagination) is not an issue as the readers viewer will take care of these. But, each section/subsection should be in a separate file to decrease delays.

- we can add links to other documents that allow direct connection to references. The frees us from having to fully explain every point (e.g. go straight to an earlier proof).

- tables of contents can be used, as in normal books, but they can be broken into smaller parts.

- when there are enough small segments of information, we can put together different books. Each of these can put the material in different sequences, or as reference. I typically produce one of these for each course.

- a date must be added to sections. The document is living, and corrections and additions can be made frequently. The reader needs a date or version number to know when these changes have occurred.

- various miscellaneous items need to be added. A set of icons are needed for navigating through the document (next, previous, up one level). A contact email address. An identifying icon that marks the page. A copyright notice is optional, but should appear on each web page.

- line drawing figures convert well to Web format.

- photographs can be added easily but are best left as links. Viewing documents with a large number of photographs on the page slows down viewing, and makes the document very large.

- linking to video and sound can cause problems, as no format is supported universally.

- linking to application files requires that the reader have specific application software (e.g. Mathcad).

- we can add hypertext links to other sites outside of our documents, but these are highly unreliable, and so they may be separated into a separate file.

This list of style points has been developed through extensive experience in presenting materials for courses and on the Web. The simple tree diagram shows an abbreviated version of my directory structure for my word processor files and the web site. It also shows how a simple statics course is put together using these sections.


Figure 1 - Global Directory Structure for Note Set with EGR 209 Shown as a Subset


In the hierarchy above (Figure 1) we can see the general refinement of topic areas. For the directories, subdirectories and files listed I have used the actual names so they may seem a bit cryptic, but this is irrelevant to the reader. If we look at the ‘refer’ directory as an example, I have put my general reference material in this directory. This includes directories for a glossary, material properties, a math handbook, and a list of units and conversions. At the simplest, each of these directories contains only one large file, but these can be split into smaller files to allow inclusion of only part of the material in another table of contents. There is a global table of contents that presents all of the topics together, and points to the sub directories. Each of the document directories has an extensive table of contents file, that can access the materials. But to go from the global to the specific tables of contents can be time consuming. Hence the EGR209 and EGR210 tables of contents are examples of material specific tables of contents. Each of these refer to specific tables of contents (the same ones referred to in the global table of contents), but puts them in sequence for the specific course. In the example above EGR209 is a course for both statics and mechanics of materials, while EGR210 is for transfer students that have already had statics, but need to cover the mechanics of materials portion only. This allows most of the material to be reused, but both courses to have customized for both classes.


The impact that web based material has on the students is,

- easy access to course note correction and additions.

- easy access to ‘bulletin-board’ type information.

- students can add their own assignments to the course notes.

- software and application specific files can be easily downloaded by the students.

- the students can have a copy of the lecture material, and so the lecture focus shifts from dictation, to discussion of the course content.

- homework can be submitted and returned without leaving home.

In general the students strongly favor the Web based approach, although there are a number of problems that face some of them,

- different levels of computer support. Some students have no Internet access from home

- access problems in campus computer labs.

- the learning curve - this is quickly decreasing.


There are some strong benefits for the faculty member that plans to use the Web for course materials,

- the preparation before each lecture is decreased

- each lecture can be consistent, if the web pages are used for presentation

- software and files are easy to distribute

- paperless marking can be done by having students upload files to their accounts. The instructor can then download these files and use software (e.g. MathCAD and Working Model) to mark and leave comments. These files are then uploaded to a private directory where the student can retrieve them.

- homework submitted with software such as Mathcad forces students to be exact in their calculations. It makes it harder to be obtuse, verbose, or vague.

- notices can be posted on the web, saving trips to a designated board.

- individual students can be reached with email.

- changes in the course notes can be easily distributed.

There are some additional demands placed on the instructor,

- before the course is offered the first time the instructor must spend a large amount of time developing solid course materials.

- support is needed from the department/faculty to provide needed release time and equipment support.

- mistakes on-line can become very public.

- the course may become less flexible after the beginning of the term.





To put a course on the Web should be looked at as a three step process; before, during and after. Before the course begins we need to have the course notes prepared, and all of the resources in place. Figure 2 shows a reasonable set of steps before the course begins. There are some lead times provided to give a general idea of when would be a good time to be actively engaged in these activities. An estimate of time is also provided. These numbers will vary widely depending on the type of course, available software and resources, and previous knowledge of the faculty member. To follow this flowchart through, the faculty member must make a solid commitment to follow this process through. After deciding to proceed some time is needed to look at what is available for your use, and the students. It is a good idea at this time to try creating a web page using available tools. This web page should be like part of the course notes you will be presenting (equations and figures can be a large stumbling block). Once you have determined what equipment you need, put together a proposal for the powers-that-be. This should ask for any required equipment, software and release time. If this proposal is accepted you will want to order the needed components quickly so that you will have ample time for testing. At this point the course notes need to be developed, and entered into a word processor. If course notes exist, and somebody can be secured for entering them into the computer the development time will be much shorter. Next, you will want to try posting these to the web to see how they appear, and to determine if the notes have come through accurately. With the notes on the web it will be helpful to try a ‘dress rehearsal’ for the notes. Try to make it as much as a normal lecture day as possible. You will learn what works, and what still needs work. If this is done soon enough you will have time to order missing equipment/software. At this point the notes should be reviewed, and sent off to the bookstore where the students may purchase them. In the last weeks before class you may try to collect supplemental materials, such as photographs or MathCAD files that help to enhance the course notes (but don’t fit on paper). This is also a good time to add links and other interesting extras to the web site.


Figure 2 - What to do before the class starts


During the course the procedures are more regular, and can be shown with the crude flowcharts in Figure 3. The first class is a critical time to launch the web usage. In the first class the students should be told that web usage is ‘not optional’, and be given an assignment to have them generate their own web pages. When I have done this before, I found that the students had no problems developing their own pages, and this only required a couple of hours of help. It is also helpful to get their accounts set up on the first day. On a daily basis some preparation is required before the lecture. By reviewing the notes you may catch some mistakes, and might even reword the notes. If there is some difference between the printed and projected notes the students will be a bit more attentive. It is also important to review problems or shortcomings of the notes as they are covered. This can be updated on the web site, as the changes are made, allowing students looking for clarification to find it easily, and reducing preparation for the next time the course is offered. Assignments can be posted to the web where the students will find them easily. Have the students submit their assignments by uploading (using ftp) to their accounts, and adding them to their web pages. You can then download these, and mark them as usual. For example, if an assignment is submitted in HTML, comments can be added, and highlighted in red. The marked file is uploaded to a student directory that is private (for obvious reasons) where the student may pick it up at any time. If applicable, assignment solutions can be posted to the web also. Another alternative to this method is to submit assignments using email with attachments. It is worth noting that midterm solutions can be posted to the web so that as soon as the exam is done, students will be able to review a solution. This fast feedback can be very valuable.


Figure 3 - Procedures to follow during the term


After the course it is advisable to look over the course materials, and determine any deficiencies. If the course went well there will be very few changes required. But this is also an opportunity to make further proposals, and spend reworking materials.



There are some essential items that must be present to allow Web based teaching. I will present these as a list with headings and a discussion for each. This will be followed by a list of optional items that can enhance the course.

• Essential

Web Server - Your campus will have at least one web server, and this can acts as a useful place to leave files. But, for practical reasons you will not be able to get access to private student directories for returning marked work. The best alternative is to set up your own web server. I have set mine up using Linux (Unix for PCs) on a standard desktop computer, this can also be done using Windows NT (TM) produced by Microsoft. Between your files, and the students work, you should expect to fill tens of megabytes conservatively or up to gigabytes for large files and/or classes.

Faculty Computers - You will need at least one computer. A laptop is best, and can often be taken to the classroom. Networked desktop machines in the office and in the classroom can be set up with appropriate software.

Data Projector - If possible get a high quality data projector that will connect to your computer. If this is not possible, use an LCD panel on an overhead projector, this will appear a bit dark. Worst case use a computer to TV converter, this will be the least expensive, but the graphic quality is very poor. (see [2] for more detail)

Word Processor/Publishing Software - You will need a word processor of some description to prepare web pages. This is actually somewhat difficult for engineering needs. The word processor typically needs to be able to include equations, and figures. The format used in this package must then be able to be converted to HTML. At the time of writing the variety of option is limited, but the market will soon be flooded. At present the best solution that I have been able to find is Adobe Framemaker (TM) and Quadralay Webworks (TM). Both packages run on PCs, Macintosh, and Unix platforms.

Browser - There are a number of excellent browsers available today, but the two best are available from Netscape and Microsoft. Both can be obtained at no charge under certain conditions. Either will do for the students, and this software can be used as a presentation tool in class.

• Optional

Application Software - I have used packages such as Working Model, and Mathcad to support lectures. Anybody using the browsers for course notes will need copies of application software to included files. These files will allow the notes to become interactive, visual, experimental, etc. For example, in Statics I have used working model to illustrate the slip-tip problem. There are a large number o packages that offer low cost student editions, or even free demonstration versions that still be used for viewing.

Digital Camera/Scanner - A scanner can be very useful for capturing images on paper. But this should be discouraged. Scanned documents are very large, and can be very slow when downloaded for viewing. Scanned photographs also tend to have a poor quality. A very good option is to buy a digital camera that captures images directly to digital format. These cameras come in a variety of prices, but a good midrange camera can be purchased for $600 that will give good quality photographs. Within a short period of time these costs will drop quickly, and real time video capture will be an option. Other poor options include camcorders with image capture hardware in a PC. This gives grainy pictures or low resolution.



Up to now I have discussed what is possible, and how to go about preparing a Web based course. It may be useful to view part of a web based course note set (you may see the full version at [1]). Here we will have a look at the course notes for EGR209 - Statics and Mechanics of Materials. Below you can see the main page for the course in Figure 4. This includes a few basic elements.


Figure 4 - EGR 209 Main Page


By selecting classes, and then course notes we can get the table of contents for the course, see figure 5. The can be used to select a section of the notes. If we select the Free Body Diagram section we will then be in notes (Figure 6). At times we can use pictures that are linked to aid in explanation, Figure 7 shows an example from the truss section.


Figure 5 - Table of Contents for the EGR 209 Notes


Figure 6 - Notes on Free Body Diagrams



Figure 7 - Embedded Photograph of a Roof Truss





The basic procedural components required to produce on-line course materials for the web were presented. This covered elements of style, how it may change the roles of faculty and students, and the technology involved. The paper concludes by briefly discussing an example of an on-line course note set.





[1] Jack, H., http://claymore.engineer.gvsu.edu, a web site containing materials discussed in this paper.

[2] Jack, H., “Use of Computer Technology in the Classroom”, a paper to be presented at the ASEE annual conference, 1997.


Session 1630