Educational Opportunities using VRML in the AI Classroom


Paul Juell


This paper presents some results from the Visual Program project. The goal of the Visual Program project is to provide an environment in which students can study and learn AI techniques. We provide tools to support active learning using visualizations of AI programs. These visualizations include animation, fly-through models and more interactive information models. The visualizations are distributed as VRML virtual worlds. The distribution of the visualizations on the Web allows the student to explore the data or the model. Some of our models allow the students build their own virtual world to provide a visualization of programs they are developing. These then would allow the student to explore the operations and characteristics of her/his program. Some examples of the various systems are: (1) For a presentations unit, we have animations showing various searches. (2) For explorations of data/process we have 3D fly-through models of the points searched by a Genetic Algorithm (GA). (3) For the student building a visualization we have tools to allow them to build virtual worlds modeling the states in a state space search.

New technology presents opportunities to do new and hopefully useful things. We emphasize visualizations of data and process using VRML as the delivery platform. These visualizations are intended for a graduate level course in Artificial Intelligence. We felt it would be a good problem domain because the course content can be very complex, but may be characterized by compact descriptions. This is, in part, because of the symbolic nature of much of AI. The symbolic notation offers the possibility of creating small but informative visualizations. This project has developed a number of these visualizations.

VRML as a development environment

VRML is a standard for building 3 dimensional worlds that can be navigated in real time, can include complex objects, and can interact with normal web information in HTML based pages. In addition, VRML directly supports animation and also supports real time interaction with Java. This combination of features allows building ranges of virtual worlds. These can vary from simple static worlds, to worlds with preprogrammed interactions, to worlds with complex interactions using programs to provide the model driving the interactions.

Visualizations for the classroom

All of the products developed for this project started with an individual having a vision of an image, world or movie. Then the job became to find a way to get the technology to provide an instantiation of the concept. Once that was done, we needed to determine quality and usability of the product. This evaluation lead to redesigns and rebuilding the images, worlds and the interactions. The projects were demonstrated and evaluated by the programming team and a larger group of faculty and students working on the umbrella grant project. This process has lead to a number of innovative visualizations. All of the visualizations can be used in the classroom to present a single example or concept. Many of these visualizations can be used with more examples.

We developed a number of these presentation tools. An example is a set of visualizations of the searching process. We have images of search trees with the search shown by a animation of a ball following the search path. We have examples showing depth first, breadth first and hill climbing searches. Another example of this class of visualization is a nice pictorial of what is known as a crossing problem. Our example is the problem of a father and his two sons trying to get across a river. There is a boat that can take only 200 pounds. The solution to this problem requires a number of steps of loading the boat, crossing the river, unloading load the boat repeating these processes. One of our visualizations shows pictures of the father, the two sons, and a stylized boat. A movie is shown of the appropriate individuals getting into the boat, and they and the boat crossing the river. This movie then shows the full process.

These presentation tools can be shown in the classroom. This assumes availability of the computer, projector and web access. A VRML plug-in and Java support are also required. The author is using the Web for most lecture material, so it is a trivial matter to include these examples in the lecture. The visualizations can also be used by the student outside the classroom. The visualizations are distributed to the students over the web.

We provide a second level of visualization which we refer to as an explorative visualization. The basic information, process or data is pre-packaged and does not change. However, the student has various options and can control the process of examining the information. This process of examination serves as an aid in understanding the interactions of the data and process. An example of this is a multi paned window showing the execution of a rule based program. One pane shows the working memory (the current variable values), one pane show the rule to act on the working memory and a third pane shows the sequence steps. Mousing over the step will show the appropriate information in the other panes. This visualization allows the student to inspect the operation of the process at their own speed and order.

Examples of Visualizations

A common example used in AI is a blocks world. A set of rules cause changes in the blocks world over time, causing the configuration of a stack of blocks to change. One of our visualizations shows the full running of a blocks worlds program. All of the steps are shown in one image. Each point in time is shown further back in the image. Each layer shows the stack of blocks as it would be at that point in time. Next to the stack is the rule that will effect the blocks next and the current values of variables in the working memory. This fly-through 3D image will allow the user to inspect the changes in states, the effects of the states on the blocks world and to see patterns in the execution of the program. At this time, we have hand coded this blocks example. We hope to allow building these types of worlds from data later.

Another version of an exploration visualization is an active diagram. By delivering a Data Flow diagram in VRML, we allow user control of the presentation of the diagram. The user can select how much, and which types of information to display. Animations clarify the flows of data, and navigational tools allowing focusing on parts of the information. Descriptions of the nodes are hidden until a mouse over turns on the text. Navigation aids are built into the diagram. These will step the view to the next selected point of interest. Clicking on a connector will change the view to the next node. Some nodes will have full diagrams inside them. Clicking on these nodes will take you into an embedded world. The embedded world is the next level of detail in the diagram. We plan on later developing a notation to allow the user to build these active diagrams.

The highest level of visualization we support allows the student to build his/her own visualization. This allows the student to explore the data or process of their own programs. A command or data interface is provided that allows the student to build the visualization. An example of this is a visualization tool for state space search. The student will instrument their program and obtain a sequence of state descriptions. Another file specifies how to display the states, including which images to attach to the items. The tools will then produce a VRML file that can be inspected to see the progress of the program. The VRML file will either show the states over time, with the later states farther back in the 3 dimensional image or will display a user controllable movie.

Another example shows the searching done by a Genetic algorithm (GA). The student has the GA program create a file describing the points searched. The file has the 3 space location of the searched point, the generation of the search and the quality of answer the location represents, the time of the search and the goodness of the value. These values will then be displayed in 3 dimensions with the points represented by a sphere and the color showing approximately when the search occurred. The answer quality can also be shown by the shape of the point representing the search. The user can also select that this be shown as a movie rather than a single image.


This project has developed a number of visualizations to aid a student in understanding of AI techniques. These visualizations can be used in various ways, from presentations to aids in debugging of programs. The development process is continuing, with new visualization and improvements in the current tools.

(Note: This abstract is under consideration by the Association for the Advancement of Computing in Education for presentation at their March 1-4, 1999 meeting entitled M/SET 99--International Conference on Mathematics/Science Education and Technology.)

Copyright © 1998. World Wide Web Instructional Committee