CAL-laborate Volume 8 June 2002


Web-based program to illustrate metabolic pathways to students

Alan Wise
School of Life Sciences, The Robert Gordon University, St Andrew's St, Aberdeen AB25 1HG, Scotland

There are many excellent Internet resources that illustrate metabolic pathways. The International Union of Biochemistry & Molecular Biology (2002) provides figures illustrating parts of metabolism with chemical structures and enzyme names. More clearly laid out pathways with larger chemical structures have been provided by Miller (1998), and the structures can be visualised in 3D if you have the right plug-in. The well-known wall chart produced by Boehringer-Mannheim (2000) can be accessed online and users can search for a keyword or click on the map itself to see part of it. GenomeNet (2002) provides overview diagrams illustrating sections of metabolism with hotspots that can be clicked to provide detailed information on the enzymes including amino acid and base sequences. These resources are extremely valuable for students who are studying biochemistry in depth, but they are arguably too complex and information intensive for many who are required to study only the major pathways at a basic level.

Since the Internet contains such a vast amount of information, there are undoubtedly many other useful resources and it would be foolish to deny the existence of a program similar to the one described in this paper. The current program was designed to help nutrition students learn about the main metabolic pathways, and in particular the ways in which vitamins are used in metabolism. The program might be useful to other students in the life sciences. The approach to program design was to make it as interactive as possible to enhance exploration and understanding of interrelationships between substances via the inclusion of many hotspots on the screen for navigation and provision of relevant information. Readers are invited to try the program in the free software section of the commercial WinDiets web site:; the author would welcome comments and collaboration from others who wish to evaluate the usefulness of incorporating the program into teaching or who would like to help to develop the program further.

The program was originally written as a help file, which enabled it to include interactive pathways containing hotspots that led to the next step in the pathway or provided information about enzymes in popup windows (Wise 1998). With the development of the Internet and web technology, it was decided to rewrite the program for the new medium. The screen design (see Figure 1) contains 3 frames, one at the top (Frame 1) and a second, larger, frame at the bottom, split into two frames (Frame 2 on the left and Frame 3 on the right). The whole program is written in JavaScript and each frame is written by a function placed in the opening page (Wise 1999). There is only one file that contains the whole program, which is only 149 Kb in size and hence downloads quickly. The program requires 179 gif files containing the pathways and chemical structures. These are 1-15 Kb in size and are downloaded when required by the program.

The pathways were produced using SnapGraphics 1 (Micrografx Inc., Richardson, Texas) and structural formulae of substrates using ISIS/Draw 2.3 (MDL Information Systems Inc., San Leandro, California). The top frame contains a menu, which includes links to a 'contents' page or a popup map showing the outline of basic metabolic pathways (see Figure 2), or an exit. The program appears in a page with no tool bar to maximise space, so Frame 1 contains buttons to enable students to go back a step and to print the information in either of the lower frames. The pathways appear in Frame 2 and an example screen is shown in Figure 3 that illustrates the presence of links to other parts of metabolism. Clicking on the arrow between the two substrates generally shows the structures of the metabolites in Frame 3 along with the name of the enzyme, and in this particular illustration shows that clicking on the coenzyme gives its structure with the location of the vitamin in the molecule. Since the metabolite also acts as an allosteric modifier elsewhere in metabolism, this is indicated when that hotspot is clicked. Frame 3 is used to illustrate material about the pathway in Frame 2 and also for a contents page that lists some important substrates. These may link directly to show where they appear in metabolism in Frame 2 or may lead to a further list of substances that provide links to Frame 2. The list of vitamins links to pages of information about individual vitamins and for each of these there is a list of reactions requiring the vitamin and links to the pathways that then appear in Frame 2. The program could be adapted to include other pathways and other educational scenarios such as emphasising what happens during starvation and after feeding. Issues that need to be addressed by further research on the program are student responses, the ideal number of steps shown in Frame 2 and how to emphasise the locations of reactions in the cell and in different cell types.

Figure 1.

Figure 1. Outline of screen structure

Figure 2.

Figure 2. Map with hotspots that link to metabolic pathways

Figure 3.

Figure 3. Illustration of pathway screen in Frame 2


  1. GenomeNet (2002) KEGG (Kyoto Encyclopedia of Genes and Genomes) Metabolic pathways.
  2. International Union of Biochemistry & Molecular Biology (2001) Nicholson minimaps.
  3. Michal, G. (Ed.) (2002) Roche Applied Science: Biochemical pathways chart. Boehringer Mannheim,
  4. Miller, K. J. (1998) Metabolic Pathways of Biochemistry.
  5. Wise, A. (1998) Information technology in nutrition and dietetic education. British Journal of Nutrition, 79, 547-550.
  6. Wise, A. (1999) Interactive learning aided by JavaScript. Association for Learning Technology Journal, 7, 46-56.

Alan Wise
School of Life Sciences
The Robert Gordon University
St Andrew's St
Aberdeen AB25 1HG

Return to Contents

CAL-laborate Volume 8 June 2002

[an error occurred while processing this directive]

Page Maintained By:
Last Update: Monday, 30-Apr-2012 15:19:24 AEST