An example of sorted cards representing the structure of a Russian course Web site (see an enlargement).

An example of a Russian course Web site organizational flowchart (see an enlargement).

An example of a Russian course Web site interactive grammar drill navigational flowchart (see an enlargement).

An example of a Russian course Web site mind map (see an enlargement).

An example of content outline of a previous version of the DMC site (see an enlargement).

An example of a storyboard for a promotional CD-ROM about the DMC (see an enlargement).

DMC Home : Use Development Aids :

Diagramming Techniques

You can organize the content and plan the navigational structure of your educational technology activities and materials using one or more of the following techniques.

Card Sorting

Technique

1. Write each content element on an index card or Post-It Note.
2. Sort each card or note into a category based on your schema.
3. Post the cards or notes on paper.
4. Draw lines and arrows between them showing how they are linked together.

Uses

This technique helps you break down your content into the smallest elements that can stand alone and be linked together hypertextually. It also enables you to see easily how different people categorize your content. However, it is hard to reproduce copies to send to others.

Flowcharting

Technique

1. Write each content element inside a flowchart shape (e.g., a box to represent a page or a triangle to represent that the student can choose from a set of options) using pen and paper or graphics/flowcharting software.
2. Arrange the shapes on the page to show which are subordinate to the others.
3. Draw lines and/or arrows between the shapes showing how they are linked together.

Uses

This technique enables you to represent the top levels of your organizational structure on one page or screen, to easily check for schematic and labeling consistency, and to design how your content element will be linked together. It especially is useful for mapping the navigational systems of complex interactive features such as online quizzes. However, it is difficult to represent on a single flowchart many subcategories or decision paths and their relationships.

Mind Mapping

Technique

1. Write each content element inside a circle using pen and paper or graphics software.
2. Arrange the circles on the page so that the home page is in the middle and the other pages circle around it.
3. Draw lines and/or arrows between the circles showing how they are linked together.

Uses

This technique can help you first brainstorm your content elements either by yourself or in a group. However, it is difficult to represent on a mind map many subcategories and their relationships.

Outlining

Technique

1. List content elements using pen and paper or a word processing program.
2. Arrange them in a hierarchical outline, categorizing them from the general to the specific or vice versa.

Uses

This technique enables you to represent the organization of deep structures (those with many sublevels). However, it is not as well-suited to representing hypertextual structures.

Storyboarding

Technique

Create a table with columns for each media type you will use and with rows for each content element you will use in an animated or interactive feature on your course Web site.

Uses

This technique can help you design the movement and timing of self-running or interactive multimedia segments. However, it probably won't help you design static Web pages.

Contact:
dmc@umn.edu

212 Walter Library
117 Pleasant Street S.E.
Minneapolis, MN 55455
(612) 625-8030

69 McNeal Hall
1985 Buford Avenue
St. Paul, MN 55108
(612) 625-8030