86 |
upon traversing |
upon traversing |
87 |
a link, the view fluidly animates to the target, while the |
a link, the view fluidly animates to the target, while the |
88 |
originating document remains visible. |
originating document remains visible. |
|
We use directed but bidirectional links to retain the left-right |
|
|
relationships between nodes. |
|
89 |
|
|
90 |
We have developed new user interface techniques |
We have developed new user interface techniques |
91 |
to facilitate this interface, which together: |
to facilitate this type of interface, which are especially |
92 |
|
effective when used in combination. |
93 |
|
|
94 |
- break lines: the buoy is actually a torn-off piece of the whole other end of the link! |
- break lines: the buoy is actually a torn-off piece of the whole other end of the link! |
95 |
|
|
102 |
fragments of the linked-to documents (called buoys) |
fragments of the linked-to documents (called buoys) |
103 |
floating near the anchors in the article.. |
floating near the anchors in the article.. |
104 |
|
|
105 |
|
We use directed but bidirectional links to retain the left-right |
106 |
|
relationships between nodes. |
107 |
|
|
108 |
The individual nodes use fisheye |
The individual nodes use fisheye |
109 |
|
|
110 |
The user interface techniques have been made possible |
The user interface techniques have been made possible |
117 |
Introduction |
Introduction |
118 |
============ |
============ |
119 |
|
|
120 |
In many hypertext systems today, following a link means a disruptive change |
In several hypertext systems today, following a link means a disruptive change |
121 |
in the user's workflow, replacing the current context with an |
in the user's workflow, replacing the current context with an |
122 |
entirely different one. |
entirely different one. |
123 |
The reason for this is that most systems still use the paradigm |
The reason for this is that most systems still use the paradigm |
127 |
existing window. |
existing window. |
128 |
Alternatives, such as replacing part of text (XXX antont's reference), |
Alternatives, such as replacing part of text (XXX antont's reference), |
129 |
are not very popular nor intuitive... [XXXref] |
are not very popular nor intuitive... [XXXref] |
130 |
|
Improving user orientation through user interface improvements has |
131 |
|
recently received much attention. |
132 |
|
|
133 |
There have been much work on improving user orientation. |
One approach is to display information about the destinations of the links. |
134 |
One approach is to embed information about the destination in the links. |
Browsers' status lines or tooltips show the URL or the HTML link title of the link |
135 |
Link titles are now a standard HTML feature (at least since version 2.0) and |
that the mouse is currently over. |
136 |
fluid links [zellweger98fluid]_ take the concept further by |
Fluid links [zellweger98fluid]_ take the concept further by |
137 |
allowing the user to see gradually more and more target context |
allowing the user to see gradually more and more target context |
138 |
before following a specific link. |
before following a specific link. |
139 |
|
|
140 |
Hypercept [milgram99hypercept]_ provides a cue of local structure |
Hypercept [milgram99hypercept]_ provides a cue of local structure |
141 |
by animating the transition from the current document to a linked |
by animating the transition from the current document to a linked |
142 |
document in different ways depending on the structural relationship |
document in different ways depending on the structural relationship |
144 |
|
|
145 |
.. XXX: behaviour, structural role |
.. XXX: behaviour, structural role |
146 |
|
|
147 |
Another approach is to show the context directly in the view layout. |
Another approach is to treat the local hypertext structure as a graph, |
148 |
|
and visualize it as such. |
149 |
Focus+context views of the web, as proposed by Mukherjea and Hara |
Focus+context views of the web, as proposed by Mukherjea and Hara |
150 |
[mukharjea97fcwww]_, provide overview diagrams of the linking strucure |
[mukharjea97fcwww]_ and Munzner and Burchard[fc-3dhyperbolic]_, |
151 |
|
provide overview diagrams of the linking strucure |
152 |
of web pages with important nodes emphasized. |
of web pages with important nodes emphasized. |
153 |
|
|
154 |
The Pad++ browser [fc-zooming]_ records history of the visited pages |
The Pad++ browser [fc-zooming]_ records history of the visited pages |
155 |
as a tree with nodes showing complete pages. |
as a tree with nodes showing complete pages. |
156 |
The focused page is shown at a larger scale and the user can |
The focused page is shown at a larger scale and the user can |
159 |
|
|
160 |
.. - long pages get scrollbars |
.. - long pages get scrollbars |
161 |
|
|
162 |
While focus+context views of the linking relationships provide good overview, |
Nelson's transpointing windows [XXXref 1979] |
|
the interconnections of documents are deeper. |
|
|
Nelson's as of yet unimplemented transpointing windows [XXXref 1979] |
|
163 |
show connections crosscutting the view hierarchy |
show connections crosscutting the view hierarchy |
164 |
between relevant parts of documents. |
between relevant parts of documents. |
165 |
This form of annotation is often used on images: |
This form of annotation is often used on images: |
166 |
a label is placed on the margin and a line is drawn to the relevant |
a label is placed on the margin and a line is drawn to the relevant |
167 |
point in the image. |
point in the image. XXX See fig.XXX |
168 |
|
|
169 |
Free form 'digital ink' annotation |
Free form 'digital ink' annotation |
170 |
(e.g., XLibris [schilit98digital]_, iMarkup[XXref]) |
(e.g., XLibris [schilit98digital]_, iMarkup[XXref]) |
171 |
is currently the closest thing to cross-cutting connections, |
allow cross-cutting connections inside a single document. |
172 |
because that's what users do with them. |
The XLibris system also |
173 |
However, document authors cannot anticipate the information |
searches for pages containing contant similar |
|
needs of all readers, so the user also needs a way to make |
|
|
connections between multiple documents. |
|
|
XLibris automatically searches for pages containing contant similar |
|
174 |
to what the user underlined or circled on a page, |
to what the user underlined or circled on a page, |
175 |
and suggests links to the related pages as thumbnails in the margin. |
and suggests links to the related pages as thumbnails in the margin. |
176 |
|
|
|
|
|
177 |
In this article, we take the ideas seen in the above references |
In this article, we take the ideas seen in the above references |
178 |
a step further. |
a logical step further. |
|
Modern graphics accelerators enable, even on commodity hardware, |
|
|
several visual effects that 5 years ago were only possible on expensive |
|
|
graphics workstations. |
|
|
We present a number of user interface technologies that are now possible |
|
|
on typical hardware. |
|
179 |
These techniques together make it possible to implement a |
These techniques together make it possible to implement a |
180 |
new focus+context user interface with two important features. |
new focus+context user interface with two important features. |
181 |
First, all connected information is visible in fine detail |
First, all connected information is visible in fine detail |
195 |
and unique background textures for visualising the identity |
and unique background textures for visualising the identity |
196 |
of the documents. |
of the documents. |
197 |
|
|
198 |
|
Modern graphics accelerators enable, even on commodity hardware, |
199 |
|
several visual effects that 5 years ago were only possible on expensive |
200 |
|
graphics workstations. |
201 |
|
We present a number of user interface technologies that are now possible |
202 |
|
on typical hardware. |
203 |
|
|
204 |
|
|
205 |
We present an example application that shows PDF documents |
We present an example application that shows PDF documents |
206 |
with connections and annotations using the new techniques. |
with connections and annotations using the new techniques. |
207 |
The application is based on a xanalogical structure and, |
The application is based on a xanalogical structure and, |