|
|
The design patterns reported in this section mainly concern with the
design of groups of Web pages, named "collections" in the HDM terminology.
A collection denotes a set of application elements called "collection members".
Members can be pages or collections, in turn, which grouped according to
some objective or subjective criteria. Collection members very often concern
the same category of topics or subtopics (for example, "sculpture works",
or "sculpture of a given artist"). In this case, we have taxonomic collections,
made of elements which belong to the same "class" (according to come domain
oriented classification). In other cases, elements are collected since
they are all relevant for some specific situation of use or for user's
task (for example, "all the most frequently visited paintings in the museum",
or "all the most representative pieces in the museum for a quick overview
of its content"). They satisfy some ad-hoc, subjective requirements, not
easily expressible in a formal way.
We will first present two basic design patterns for collections - Pure
Guided Tour and Pure Index. We will then introduce a number of variants,
achieved either by refining the problems and solutions expressed by these
basic patterns, or by combining them and their variants.
Pattern Name: Pure Guided Tour (sometime denoted only Guided
Tour, for short).
Problem: Given a collection, provide a navigation structure which
is easily understandable by users, particularly those who are accessing
the collection for the first time, want to explore all its content with
no preference on a particular item, and like to be "guided" across the
collection contents.
Solution: Identify an order among the collection members, and
create links from the first one to the second one, from the second one
to the third one and so on, until the last one, and all their inverse links.
Create an additional page containing a short introduction to the collection
content and purposes; and define a link from this page to the first member
of the collection. To improve user understanding of the collection rationale,
include here also representative "identifiers" of the members - textual
titles and/or visual representatives, such as miniature pictures. Present
identifiers in a visual order consistent with the order defined for navigation
among members. You may also include in the center any content which can
be relevant to understand the collection rationale: "common" information
which concern all member pages (e.g., a biographical note about
an artist, if the collection is about his works), a short introduction
to the collection theme and purposes, some explicit explanation about its
scenario of use, and similar.
Discussion: The proposed solution involves structure, navigation,
and content aspects.
In HDM, the composite object defined with the above rules is named
guided
tour. The additional page included in the collection is named
center.
A guided tour center has the purpose to make clear what is the intended
meaning of the collection and to provide an overview of its contents. Still,
the level of user understanding is dependent from the expressiveness of
the center content (e.g., the choice of the member identifiers), and from
the intuitiveness of the collection order. The main advantage of a guided
tour is that it provides a fast exhaustive access to all its member in
a cognitively simple way for users. It is suitable for "naive" users or
for users who are at their first exploration of the collection, or users
who have a "passive" attitude and like to be guided in the exploration
rather than to engage a free navigation across the collection. The main
disadvantage of a guided tour is that members must be traversed sequentially,
since there is no way to select one of them directly. Thus, the linear
navigation in a guided tour is also appropriate when the number of members
of a collection is relatively small, so that the user does not get bored
to traverse all elements and does not feel the need of "flying" through
the collection jumping from one member to another, nor to rapidly reach
the end of the tour.
Pattern Name: Pure Index.
Problem: Given a collection, provide users with a fast efficient
access to each member, and make clear what is the collection intended meaning
and which are its members.
Solution: In HDM terms, the solution consists of creating an
index.
Define
an additional page in the collection (named index
center - as in
a guided tour) which provides a collection overview, by containing at least
the identifiers of all members (textual titles and/or visual representatives,
such as miniaturised pictures); define links from the center to each member,
and vice versa. The center my also include any information which
can be relevant for improve user's understanding of the collection rationale
(e.g., a short introduction to the collection theme and purposes, some
explicit explanation about its scenario of use, or some "common" information
which is relevant to all member pages).
Discussion:A pure index is very similar to a pure guided tour
- see the pattern above - but its navigation structure is different. As
in the pure guided tour pattern, the solution involves structure, navigation,
and content aspects. An example of pure index is the collection of all
paintings of a given art period, with the center describing all the painting
titles coupled with artist names, a short introduction to that period and
an explanation about the criteria of painting choice.
There are a number of possible variants to these basic patterns. The
following one, named Hybrid Collection, combines the two basic patterns
described above.
Pattern Name: Hybrid Collection.
Variant of: Pure Index, Pure Guided Tour.
Problem: Given a collection, provide a navigation structure which
is easily used by various types of users: users who want to scan the collection
exhaustively, users who have a "passive" attitude, and users who are interested
to subsets of the collection (not known a-priori) or to a specific subject;
make clear what is the collection intended meaning and which are its members.
Solution: Define an order among the collection members and create
a center page as in a guided tour or an index; define links from the center
to the first member and from each member to the next and previous one,
as well as links from the center to each member and vice versa.
Discussion: The navigation structure proposed by this pattern
combines index and guided tour navigation. The main advantage of this hybrid
pattern, with respect to the pure guided tour and index, is that it speeds
up the page access within the collection, and allows to achieve a compromise
to satisfy requirements of different type of users, or of different situations
of use, within the same design. Users can choose among different navigation
styles according to their (evolving) needs. For example, users may prefer
to traverse the collection sequentially (in the guided tour style) the
first time they visit it, but may adopt the index style if they visit the
collection again or gain experience about the system. Users may start sequential
navigation and after a while, if they are not satisfied, jump to the center,
inspect the list of members and directly access one of them. Such a need
typically occurs when the collection is significantly long (say, more that
8-10 members), or when moving from page to page becomes frustratingly long
with the delay access time of WWW.
The following patterns are variants of the basic guided tour and index
pattern, and refine their navigation properties. Their are "acceleration
patterns" which introduce features to speed up the user's access to the
collection members, and to reduce the number of page loading from the remote
server.
Pattern Name: Circular Guided Tour.
Variant of: Pure Guided Tour.
Problem: Consider the same problem for the Pure Guided Tour pattern,
but also assume that users may need to restart the exploration of the collection
again, one or more time, or return to a previously visited element (e.g.,
since they are studying the collection content).
Solution: Define a basic guided tour and then extend it with
a link from the last member to the first one (or from the last member to
the center).
Pattern Name: Accelerated Index.
Variant of: Pure Index.
Problem: Consider the same problem as discussed for the Pure
Index pattern, but also assume that from each member user wants to have
a fast access to the collection overview (or outline), and to each members,
without accessing a different page every time.
Solution: Define a structure very similar to the Pure Index,
but i) the center stores only the member identifiers with the corresponding
links to each member; and ii) the center is not a separate page but it
is visually included in each member of the collection. Such an "embedded"
center visually appears as a list of links - or links plus collection members
identifiers - and can be arranged in several ways: it can be placed on
the top or/and the bottom of the member page or defined as a left-side
frame. A combination of these three lay-out solutions can also be provided.
Discussion: This design solution involves structure, navigation,
content, and presentation; it differs from the Pure Index pattern for presentation
aspects, i.e., the way of visually perceiving the center, and from the
absence of real links form the center to the members and vice versa. The
main advantage of the Accelerated Index with respect to the Pure Index
is that it avoids loading the page with the collection center every time
the center content is needed. Since we are talking of Web-based applications,
this is a consistent advantage, because the access to the network is often
slow, and with the Accelerated Index the access to a different member of
the collection requires only one-step (directly towards the sibling member)
instead of two (one-step upwards to the center and then one-step downwards).
The disadvantage of the Accelerated Index is that placing the center within
a member page reduces the screen space available for displaying the content
of the member page. If we compare the various presentation design proposed
in the solution, when a member page is long the second solution - left
side frame - is smarter than the solution in which the center is described
in the page bottom or in the top: it allows users see the center without
scrolling down (if they are placed at the beginning of the page) or up
(if they are at the end of the page). The combination of the three solutions
resolves the described consequences, but introduces redundant mechanisms
of navigation.
Pattern Name: Accelerated Hybrid Collection.
Variant of: Hybrid Index.
Problem: Consider the same problem defined for the Hybrid Collection,
but also assume that from each member, users want to have a fast access
to the collection overview (or outline) and to each members, without accessing
a different page every time.
Solution: Define a structure very similar to the Hybrid Collection,
but i) the center stores only the member identifiers with the corresponding
links to each member; and ii) the center is not a separate page but it
is visually included in each member of the collection. Such an "embedded"
center visually appears as a list of links - or links plus collection members
identifiers - in a left-side frame.
Discussion: As the Accelerated Index, this design solution involves
structure, navigation, content and presentation, and differs from the Hybrid
Collection for presentation aspects, (i.e., for the way of presenting the
center, and from the absence of real links from the center to the members
and vice versa). Advantages and disadvantages are similar to the ones of
the Accelerated Index. We do not propose here the placement of center links
on bottom and top of the pages since we suggest to include here the links
to the previous and next member (and we want to avoid an access of links
in these areas).
The following pattern concerns navigation within nested collections,
i.e., collections whose member are collections in turn. Nested collections,
very typical of museum Web sites, are ways to express the conceptual organization
of contents in classes and sub-classes (for example, the collection of
all paintings in a museum can be organized by artist, physical allocation,
movement, etc.) according to subjective or objective criteria. Navigation
within nested collections can be inefficient and disorienting, especially
if the depth of nesting is high. The following pattern represent a typical
solution of our inspected Web sites to reduce such problems.
Pattern Name: Top Level Ancestors.
Problem: Improve efficiency of navigation within a deeply nested
structure of collections, providing users with easy understandable mechanisms
to access alternative branches of a set of nested collections hierarchy.
Solution: Define a link from any element of a nested collection
to each member of the first level collection, i.e. to each son page of
the root of the hierarchy induced by the nesting structure.
Discussion: Within nested collections, the various styles of
navigation within a single collecting, induced by the index and guided
tour patterns, are integrated with navigation across collections at different
levels. The basic movements is one-step downwards and one-step upwards,
i.e., from the center of a collection to the center of the collection at
the previous or the next level. Downwards step-by-step navigation can be
acceptable when a user needs to explore "horizontally", in a breadth-first
style, the various branches of the hierarchy; it can be extremely inefficient
when the users proceeds "vertically" (depth-first style): once they get
the bottom level and want to access alternative branches in the nested
structure, moving upwards step by step can be extremely slow. Most Web
sites provide a "go-home" facility which allows users return to the home
page, that is usually the center of the top-level index where all the possible
top-level branches are listed. A more efficient solution, proposed by this
pattern and discovered in many Web sites we have inspected, is make visible
and available at any time during the navigation within a nested structure,
the list of all top level branches, and to offer the user the possibility
of accessing each of them directly. From a topological perspective, in
the hierarchical relationship induced by the nesting structure, these elements
are, directly or indirectly, the oldest ancestors of any element in the
hierarchy - hence the source of the pattern name.
(Back to table of contents)
4. Pattern Analysis of Museum Web Sites
Our design patterns have been "discovered" by intensively visiting and
analysing the museums Web sites described in Table 1. For each discovered
pattern, we have studied its frequency and distribution. This section will
report a portion of these statistical results, concerning the patterns
(described in Section 3) in 11 of the 32 inspected sites.
The exploration of each Web museums has been carried out in exhaustive
way, visiting all nodes and traversing all links (except to a few complex
Web site marked by "*", where we visited a significant portion of the site,
omitting some sections).
Table 2 contains information related to the use of indexes. The term
"level" denote the level of nesting of a given index in the hierarchy induced
by the top-level nested collection (the one rooted at the home page). For
example, an index which is not member of any other index has level 0 (this
is also called "top-level index"); an index which is member of an index
at level 0 has level 1, and so on. The dimension is the number of members
of an index. Table 2 reports the dimensions of the indexes at each level where
they appear.
Sometime index members are grouped in subgroups; in other terms, this
means that the index collection merges members of several collections.
In such a case, the dimension is expressed in terms of a sum, where each
addendum is the number of elements of a subgroup.
The symbol "/" is used to list the different dimensions of different
indexes at the specified level (for example: 3/4/6 means: "at this level,
there are three indexes, with 3, 4, and 6 members respectively).
The symbol ">" is used when the dimensions are very variable, so that
there are several indexes having an higher number of members with respect
to the specified number.
Two main results can be derived from Table 2:
-
indexes are intensively used in all sites (and therefore can be surely
considered a mile-stone concepts in Web site) but index structure is very
variable both even within the same site. Only in 9% of indexes have a regular
shape, i.e., the number of members in indexes is well-balanced (almost
uniform) at any level (see for example Odyssey Online).
-
54% of Web sites have indexes with subgroups, and these are typically used
at levels 0 and 1; this may suggest that to capture explicitly, in a new
design pattern, the concept of subgroup.
| Museum Sites |
Level |
Dimension |
Discussion |
| National Gallery of Art |
0 |
6 + 5 + 2 |
|
| |
1 |
3 / 4 / 8 / 10 / 18 / >24 |
In the indexes with more than 10 members, these are grouped
in several subgroups. |
| |
2 |
From 3 to 7
>24
From 1 to >10 |
The number of members is very variable, since it depends
on the number of the gallery arts existing in a particular art collection. The average is
6 (if we do not consider the indexes composed of more than 24 members). |
| |
3 |
2 |
|
| |
4 |
50 |
|
| The Tibetan Book |
0 |
7+2 |
|
| |
1 |
17 |
|
| Odyssey Online |
0 |
4 |
|
| |
1 |
6 / 6+3 |
|
| |
2 & 3 & 4 |
From 2 to 5 |
There is a regularity in the indexes use, since the number
of members in them is well-balanced (uniform) at level 2, 3 and 4. |
| Monet Exhibit |
0 |
4+5+4+1 |
|
| |
1 |
3 |
All indexes have a regular number of members. |
| The New Space |
0 |
5 |
|
| |
1 |
4 / >10 |
|
| Perseus Project* |
0 |
>10 |
|
| Adventure Online |
0 |
4+9 |
The subgroup of 9 members are pages in other sites. |
| |
1 |
(4+1) / (5+4) |
There is one member which is an out-site page in the first
index at level 1, and four in the second one. |
| |
2 |
6 / (5+4) |
There is one member which is an out-site page in the first
index at level 2, and four in the second one. |
| Women in the Arts* |
0 |
12 |
|
| National Maritime Museum |
0 |
8 |
|
| Museum of Contemporary Art |
0 |
7+6+4 |
|
| |
1 |
>4 / >6 |
|
| |
2 |
>10 |
|
| ArtsNet Minnesota |
Any |
From 3 to 6 |
|
Table 2. Pure Index Pattern.
Tables 3, 4, and 5 report some results concerning guided tours and hybrid
collections, and highlight that, on the contrary of indexes, guided tours
are not employed in every Web site.
Table 3 shows the sites in which pure guided tours or different variants
of guided tours occur. The frequency of use of guided tours is 63% of sites
have at least one guided tour (pure or variant). The variant Hybrid Collection
is used in 45% of sites.
Table 4 concerns pure guided tours only. An analysis of Table 4 shows
that only 36% of our inspected sites uses pure guided tours. We have also
observed that these are mainly used to browse among pages related to artists
or to works in art collections. In one case - Monet Exhibit - two guided
tours have a quiz-like interactive behaviour: at any member page, there
is a question on the page subject and going-next is allowed only if the
user has answered the question correctly.
Table 5 discusses how the Hybrid Collection pattern occurs at the various
levels, and presents their dimension.
An analysis of the Tables 4 and 5 shows that the guided tour dimension
is very variable; furthermore, it points out that many tours are in a sense
incorrect, in that they have only next links, to move forwards, but no
previous link: the only way to traverse backwards the sequence of guided
tour members is by using the "back" command provided by the browser.
| Museum Sites |
GT |
Circular GT |
Circular Hybrid GT |
Discussion |
| National Gallery of Art |
X |
|
X |
|
| The Tibetan Book |
|
|
|
|
| Odyssey Online |
|
|
|
|
| Monet Exhibit |
X |
|
|
No previous link is in the GT. |
| The New Space |
|
X |
|
No previous link is in the GT. |
| Perseus Project* |
|
|
X |
|
| Adventure Online |
|
|
X |
|
| Women in the Arts* |
|
|
X |
|
| National Maritime Museum |
|
|
|
|
| Museum of Contemporary Art |
|
|
|
|
| ArtsNet Minnesota |
|
|
X |
|
Table 3. Guided Tour Pattern (Pure and
Variants).
| Museum Sites |
Level |
Dimension |
Discussion |
| National Gallery of Art |
2 |
2 |
The 2 nodes of these guided tours are indexes. |
| The Tibetan Book |
None! |
|
|
| Odyssey Online |
None! |
|
|
| Monet Exhibit |
1 |
5 |
There are 2 guided tours in this site; in one case we found
a quiz-like interactive behaviour: at any member page, there is a question
on the page subject and going-next is allowed only if the user
has answered the question correctly. |
| The New Space |
1 |
26 |
It is used to navigate among paintings. This is only one
guided tour in the site. |
| Perseus Project* |
None! |
|
|
| Adventure Online |
None! |
|
|
| Women in the Arts* |
1 |
7 |
It is used to navigate among "centuries" in the "Permanent
Collection". Each century is a member of the guided tour and is an index:
its center contains a brief description of the century and its members
are pages about artists. |
| National Maritime Museum |
None! |
|
|
| Museum of Contemporary Art |
None! |
|
|
| ArtsNet Minnesota |
None! |
|
|
Table 4. Pure or Circular Guided Tour
Pattern.
| Museum Sites |
Level |
Dimension |
Discussion |
| National Gallery of Art |
3 |
From 3 to 26 |
The 17 tours are among the work of arts of an artist. The
tours are also organised in "rooms" with 6 works for each room. The forwards/backwards
is only among objects related to only one work of art. |
| |
4 |
50 |
The indexes refer to artists. There are 27 (equal numbers
of alphabetical letter more anonymous) indexed guided tours; each index has 50 items. |
| The Tibetan Book |
|
|
|
| Odyssey Online |
|
|
|
| Monet Exhibit |
|
|
|
| The New Space |
|
|
|
| Perseus Project* |
1 |
13 |
There are 2 typologies of index: by categories & by
alphabetical order. The dimension is about index by categories. |
| |
3 |
From 6 to 24 |
Tours among essays. |
| Adventure Online |
2 & 3 |
>24 |
It is used to read the pages of a journal. The circularity
of the GT depends on the existence of the index that appears in each node of the
GT. There are 4 analogous guided tours here. |
| Women in the Arts* |
1 |
7 |
Special collections. |
| |
2 |
7 |
Exhibitions catalogues. Each node of the GT contains information
about (more or less) 6 books. |
| National Maritime Museum |
|
|
|
| Museum of Contemporary Art |
|
|
|
| ArtsNet Minnesota |
4 |
4 |
Tour from gallery to gallery. It is also directly accessible
from the cover page. |
Table 5. Hybrid Collection Pattern.
Table 6 reports the frequency of use of the Top Level Ancestors pattern,
from which we have derived the following data:
-
91% of the inspected sites do use this pattern;
-
70% of them use it at any level, hence use it in a regular way; irregularities
of use are induced by the peculiar nature of page contents given, e.g.,
pages containing only a full screen photo (that reproduces a painting),
or a VRML application.
| Museum Sites |
Level |
Discussion |
| National Gallery of Art |
Any |
|
| The Tibetan Book |
Any |
|
| Odyssey Online |
Any |
|
| Monet Exhibit |
Any |
Except in members which contain a big picture only. |
| The New Space |
Any |
Except in the VRML page. |
| Perseus Project* |
Variable |
There is a branch where the acceleration is not used from
the level 2, while in other branches of the hierarchy it is used until centers of the
deepest level collection. |
| Adventure Online |
None! |
|
| Women in the Arts* |
2 or more |
Sometimes at level 3 these accelerations disappear. |
| National Maritime Museum |
Any |
|
| Museum of Contemporary Art |
Any |
|
| ArtsNet Minnesota |
Any |
|
Table 6. Top Level Ancestors Pattern.
(Back to table of contents)
5. Conclusions
One of the main goals of our research in the last ten years has been to
support the process of developing hypermedia application (off-line and,
more recently, on-line, mostly in the art domain) from the requirement
analysis phase to implementation and testing. This paper reports the first
results of a new branch of research in this mainstream, which aims at supporting
the dissemination and reuse of design experience in museum hypermedia.
This can be achieved by defining and distributing an evolving catalogue
of design patterns. We believe that such a catalogue can represent a powerful
conceptual tool to significantly improve the quality/cost rate of developing
cultural hypermedia, in arts as well as in other domains, and may lead
to a useful high-quality standardization of these products.
We are planning to continue the work reported in this paper in a number
of directions:
-
to discover new patterns, addressing more intensively content and presentation
aspects (presentation, multimedia and implementation patterns);
-
to check the frequency and the distribution of the discovered patterns
by means of an exploration of other Web sites, in related areas;
-
to compare the discovered patterns of museums Web sites with patterns of
museums hypermedia on CD-ROM;
-
to refine and evaluate the quality of our patterns with respect to user
requirements, in order to identify which patterns are more appropriate
in which situations of use. To address this problem, we are designing a
set of experiments of pattern validation which will involve samples of
real users, with different profiles and different goals.
(Back to table of contents)
Acknowledgments
This work has been partially supported by the INTERDATA project and by
the European Project SITMOON. A special thank goes to Paolo Paolini for
his critical but stimulating comments on a preliminary version of this
paper.
(Back to table of contents)
6. References
Alexander, C. & Ishikawa, S. & Silverstein, M.
& Jacobson, M. & Fiksdahl-King, I. & Angel, S. (1977). A
Pattern Language.
Oxford University Press, New York. (back)
Appleton, B. (1997). Patterns and Software: Essential
Concepts and Terminology. http://www.enteract.com/~bradapp/docs/patterns-intro.html.
(back)
Bernstein, M. (1998). Patterns of Hypertext. In Proc.
of the ACM International Conference on Hypertext '98, ACM Press. (back)
Discenza, A. (1998). Design Patterns for WWW Museum
Hypermedia. Technical Report 98.79. Dipartimento di Elettronica e Informazione,
Politecnico di Milano. (back)
Gamma, E. & Helm, R. & Johnson, R. & Vlissides,
J. (1996).
Design Patterns. Elements of Reusable Object-Oriented Software.
Addison-Wesley. (back)
Garzotto, F. & Paolini, P. & Schwabe, D. (1993).
HDM - A Model Based Approach to Hypermedia Application Design.
ACM Transaction
On Information Systems, Vol. 11, No. 1, 1993. (back)
Garzotto, F. & Mainetti, L. & Paolini, P.
(1996). Information Reuse in Hypermedia Applications. In Proc. of the
ACM International Conference on Hypertext '96, ACM Press. (back)
Nanard, M. & Nanard, J. & Kahn, P. (1998).
Pushing Reuse in Hypermedia Design: Golden Rules, Design Patterns and Constructive
Templates. In Proc. of the ACM International Conference on Hypertext
'98, ACM Press. (back)
Rossi, G. & Schwabe, D. & Garrido, A. (1997).
Design Reuse in Hypermedia Applications Development. In Proc. of the
ACM International Conference on Hypertext '97, ACM Press. (back)
Schmidt, D. C. & Johnson, R. E. & Fayad,
M. (1996). Software Patterns.
Communications of the ACM, Special Issue
on Patterns and Pattern Languages, Vol. 39, No. 10, October 1996. (back)
Schwabe, D. & Rossi, G. (1998). An Object Oriented
Approach to Web-Based Application Design. Theory and Practice of Object
Systems, 4 (4), J. Wiley. (back)
Schwabe, D. & Rossi, G. & Barbosa, S. (1996).
Systematic Hypermedia Design with OOHDM. In Proc. of the ACM International
Conference on Hypertext '96, ACM Press. (back)
(Back to table of contents)
|
