This paper studies the development of web browsers and describes a hyperbolic browser, a dynamic browser that organizes information visually

Desmarais, Norman

English

HELIN Digital Commons

Hyperbolic Browsers: From GUI to KUI

DigitalCommons@Providence

Providence CollegeDigitalCommons@ProvidenceLibrary Faculty and Staff papers Phillips Memorial LibraryNovember 2003Hyperbolic Browsers: From GUI to KUINorman DesmaraisProvidence College, normd@providence.eduFollow this and additional works at: http://digitalcommons.providence.edu/facstaff_pubsThis Article is brought to you for free and open access by the Phillips Memorial Library at DigitalCommons@Providence. It has been accepted forinclusion in Library Faculty and Staff papers by an authorized administrator of DigitalCommons@Providence. For more information, please contactmcaprio1@providence.edu, hposey@providence.edu.Desmarais, Norman, "Hyperbolic Browsers: From GUI to KUI" (2003). Library Faculty and Staff papers. 30.http://digitalcommons.providence.edu/facstaff_pubs/301Hyperbolic Browsers: From GUI to KUINorman DesmaraisThe World Wide Web has often been described as a library where all the books have been thrown on the floor. The challenge for librarians and information workers has been to try to organize a plethora of disparate material. The challenge for researchers has been to locate pieces of information relevant to their research.Advances in computer storage have allowed digital information to grow exponentially. Web sites are also growing in complexity, making it difficult for users to understand the contents and structure of a site by following hypertext links on individual web pages. Researchers typically complain about information overload, unfriendly interfaces, the absence of intuitive search structures, and the need to learn special languages or conventions to search effectively.GUI The graphical user interface (GUI) vastly simplified the process of training researchers to use computers because it allowed them to visualize information. But there has been very little progress in user interfaces since Douglas Engelbart built the first GUI -- in 1969! For instance, the amount of information displayed on a monitor hasn't increased much since 1993. And the pointing device or mouse has seen more modifications and improvements than the user interface.Representing the quantity of information and its distribution within a set of linked documents poses one problem with visualizing information on the World Wide Web. Hypertext readers find this information along with the type of document (text, image, audio, video) useful in deciding on the suitability of a web site without spending a great deal of time browsing its structure. However, they find it difficult to navigate large document spaces. They often become disoriented and must remember their location in the network, make decisions about where to go next, and keep track of pages previously visited, as documented by McKnight, Dillon, and Richardson (1).  The problem of disorientation becomes more severe as the number of nodes increases.GUIs, such as Microsoft Windows, focus on delivering information to the screen. They do not even begin the process of transferring knowledge to humans. A first step to knowledge acquisition requires understanding the relationship between various elements and how they affect one another. Just as a skilled manager must understand the technical or operational parts of a business as well as how they relate and affect one 2another to run a successful operation, a researcher needs to see the various facets of a topic or problem and how these factors interrelate to get a complete picture and formulate a solution.KUIOne way to improve hypertext design is to provide a structured overview of the hypertext contents so as to facilitate understanding (2). A so-called knowledge user interface (KUI) uses visual cues rather than text or a combination of an underlying graphical structure with a textual component to visualize information. The User Interface Research Group at Xerox PARC (Palo Alto Research Center Inc.) [http://www.parc.xerox.com/istl/projects/uir/projects/InformationVisualization.html] defines information visualization as "the use of computer-supported interactive visual representations of abstract data to amplify cognition."Work done at the PARC promises to go far beyond the traditional GUI in speeding up the rate at which people can understand information, not just see it. It uses visual hierarchies, webs of nodes, even head and hand tracking devices, retinal projection, and virtual environments to enable navigation through complicated knowledge bases by making more relevant information available within a single view. Dr. Ben Schneiderman of the University of Maryland is responsible (both directly and indirectly) for much of the reported research on information visualization. His Online Library of Information Visualization Environments (OLIVE) [http://www.otal.umd.edu/Olive/] provides a wonderful resource for obtaining background information on the types of visual structures and their uses. It lets researchers read about eight structure types and follow links to current projects utilizing the technology.Donald T. Hawkins (3) effectively summarizes information visualization when he says, "It is important to note that what is being communicated in visualization is not the information itself, but its structure." Just because we do not readily perceive the structure does not mean it is not there. We must discover and impose structure if we are to apply technology to information management or information-intensive work because it is the structure that identifies the relationships between the various elements. Work on metadata and metalanguages like SGML and XML goes a long way to identifying information structure.Hyperbolic Browser3John Lamping, Ramana Rao, and Peter Pirolli (4) take another approach to information visualization. They explain how to map a hierarchical tree structure to a hyperbolic display that provides a “fisheye” representation of information. A traditional 2-D display, such as the Windows file manager, can only display about 100 nodes in a 600- by 600-pixel window. A tool like Inxight Categorizer, developed by Inxight Software Inc. (http://www.inxight.com), helps publishers and information aggregators arrange unstructured information into classifications or taxonomies. It uses a strong natural language processing system that automatically classifies documents by subjects and can display up to 1,000 nodes in the same 600- by 600-pixel window. A hyperbolic browser like InXight Software's Star Tree navigator then makes it possible to navigate, visualize, and absorb far more complex sets of information.John Lamping and Ramana Rao of PARC state that “the amount of information that can coherently be displayed on the screen of an interactive computer system can dramatically affect the ease of interacting with a large information structure (5).” They demonstrate the Hyperbolic Browser technique for displaying and manipulating large hierarchies and graphs, such as organization charts, file system hierarchies, and the link structure of web servers and spaces. These structures have been converted to trees that initially display with the roots at the center with multiple branches off it. Different nodes continuously appear and disappear. As one moves along the roots, the display transforms smoothly to bring other nodes into focus. For a library example, see The Universal Library at Carnegie Mellon University’s site (http://www.ulib.org/webRoot/_hTree/) which uses InXight’s software. This site is an excellent illustration of the technology both because of the size of its structure and because of the expectation that it will continue to grow with the addition of more material. This site shows what hyperbolic structures can do for the organization of knowledge; but it also demonstrates some of the limitations of the technology in its current state. Rick Lugg of R2 Consulting also uses InXight’s Star Tree to map the ebook industry. The various nodes branch off the central node (original content) in a star fashion as seen in the following graphic.4Fig. 1 Main screen of R2 Consulting’s map of the ebook industry.The various topics appear in different colors to facilitate grouping, conceptualization, and navigation. Sub-topics overlap each other as can be clearly seen -- particularly at the top and the right side of the screen. Moving the mouse or pointing device over a button operates much like a pop-up window, making the content of the button clearly visible. (Mouseovers are another navigational tool to highlight connections between nodes.) Clicking on a button re-focuses the display with the selected button at the center.  Looking at the eBook Formats button at the bottom of the screen, we see lines branching to nodes that are not identified. Clicking on this button brings it to the center, revealing several of the sub-topics. Clicking on Peanut Press centers on that button (fig. 2); and we notice several lines at the upper left that lead to other formats not displayed.  To return to the initial display, one only needs to click on the Original Content button.5Fig. 2 Selecting the eBook Formats button followed by the Peanut Press button re-centers the display to focus on the desired sub-topic. Clicking on the Original Content button returns to the initial display.Information MappingThe information hierarchy is laid out on a hyperbolic plane which is a non-Euclidian geometry where parallel lines diverge from one another. In this construct, the circumference of a circle grows exponentially with its radius. This means that as distance increases, exponentially more space becomes available. The mathematical construct is then mapped onto a circular display region. This allows laying out the hierarchies in hyperbolic space in a uniform manner so that the distance between parents, children, and siblings is roughly the same across the hierarchy -- even the more detailed hierarchies. Tamara Munzner, a graduate student at Stanford University, has extended hyperbolic browser technology into three dimensions by plotting the nodes onto a hemisphere instead of a circle. This allows the software to handle over 100,000 nodes by hiding those  not relevant to a particular search.There are two ways of mapping the hyperbolic plane: the Klein model and the more common Poincaré model. The latter works better for visualizing hierarchies because it preserves the fan-out shapes at nodes and uses 6the screen real estate more efficiently. As one navigates the display and changes the focus at the center of the disk, the rest of the hyperbolic plane fades off toward the edge of the disk. The effect resembles that of the fisheye lens, giving more room on the display to a point at the center than to points around the periphery.Clicking on any visible point or dragging any visible point to any other position changes the focus smoothly with that point at the center. Regions closer to the center appear magnified while those further from the center shrink as they move toward the edge, allowing researchers to concentrate on the portion of interest and reducing distraction caused by unnecessary information. Thus, a hyperbolic browser can display up to 10 times as many nodes and provide more effective navigation around the hierarchy, allowing the reader to browse the tree structure while maintaining the visual context.ExamplesExamples of hyperbolic browsers include InXight’s Star Tree, epixtech (http://www.epixtech.com), ClearForest (http://www.clearforest.com,) and HyperProf Mapit, a hyperbolic browser that provides a graphical display of patent citation information for US and European documents. Cone-Tree is a 3D tree that focuses on nodes the user touches and allows manual or automatic culling to show only items of interest. Hyper-G (6) represents web sites as nodes on a 3D tree; but it does not use the fisheye paradigm. Virtual Integration Technology’s knowledge management product, Deliverymanager (7), incorporates a hyperbolic browser that allows users to navigate a business information directory and to retrieve corporate information throughout an enterprise. Customers can display the entire directory on a single screen and find relevant information at a glance instead of navigating through several directories.TheBrain Technologies [http://www.thebrain.com] consists of a relational database with a visual presentation similar to hyperbolic trees. However, it differs in that it does not follow a hyperbolic structure mapped to a circular display area, even though it comprises nodes in a hierarchical tree. (Mohageg (8) shows that a hierarchical linking structure allows a faster search than either a linear or network organization.) Instead, TheBrain Technologies displays the primary node in the center (like a hyperbolic browser).  The branches lead to other related nodes which can also have links to other nodes outside of its particular branch, as in a relational database. When one selects a particular node, it automatically moves to the center with a new set of related nodes radiating out from there. This allows a researcher to see 7both the nodes that are members of the same branch and any other related nodes –- a significant difference from a hyperbolic browser. A web engine, called WebBrain [http://www.webbrain.com], also developed by TheBrain Technologies, lets users select from sixteen primary subject areas.Visualization techniques that use the fisheye paradigm usually let a researcher navigate toward the target location with a smooth transition. While a table of contents and 2D tree structures are easier to learn and comprehend (see the Chimera, R. and Nation David A. articles in the Additional Reading section), the hyperbolic browser’s ability to zoom lets one concentrate on a specific area of interest with a minimum of distraction caused by unnecessary information.DrawbacksHyperbolic trees are good for browsing collections; but they become unwieldy and almost useless for finding specific documents or pages when one does not know their location in the hierarchy.  Readers who select particularly dense areas of a tree and try to move them to the center of the display will notice that the labels crowd each other out, making them impossible to read. Also, hyperbolic browsers require a JavaScript-enabled browser such as Netscape or Internet Explorer to operate.Circular hyperbolic trees and 3-D tree representations may also disorient new users, thus requiring more training than flat structures. However, as the number of nodes increases, a flat layout of tree hierarchy may become unwieldy. Information on the nodes may become too small to identify -- a problem that can be corrected with higher resolution displays. Although it will always be more difficult to locate a node in such hierarchies because of information overload, the fisheye paradigm helps overcome this problem by showing the relevant portions of information.George Lawton (9) says that the weakest link in getting text information to people is the speed at which people can read from the computer. He cites studies that indicate that the average person reads between 240-400 words per minute (wpm) from paper but only 100-200 wpm from a monitor because of the lower resolution and the need to manually scroll the text. Peter McIan, president of Softology (www.softology.com/) believes that people can absorb a maximum of 800-900 wpm which is almost four times faster than the average person can read on a computer screen.8Other constraints limiting reading speed include subvocalization and poor eye movement. Subvocalization refers to our habit of “speaking” the words in our minds when we read them. Poor eye movement refers to a habit of the eyes stopping repeatedly throughout a line of text. These factors limit most people to reading rates under 400 words per minute. Critics believe that although hyperbolic trees and visually orientated relational databases are good for browsing collections, they will not replace traditional search engines any time soon. Information professionals will have to make an enormous cultural shift in currently ingrained conventions for searching and information retrieval. Neither the 2-D nor the hyperbolic browsers contain a sophisticated text retrieval engine with Boolean search capabilities; and initial studies have found almost no significant differences between the tree browser and the hyperbolic browser.References1. McKnight, C., Dillon, A., and Richardson, J. A comparison of linear and hypertext formats in information retrieval. In R. McAleese & C. Green (Eds.), Hypertext: The state of art (p. 10-19). Oxford, England: Intellect Books, 1990.2. Rouet, J., Lovonen J. Studying and Learning with hypertext: empirical studies and their implications. In Rouet Jean-Francois, Lovonen Jarmo J., Dillon, Andrew, Spiro, Rand J.(Eds.): Hypertext and Cognition. Lawrence Earlbaum, New Jersey, 1996.3. Hawkins, Donald T. Information Visualization: Don't Tell Me, Show Me! Online 23, No. 1, January/February 1999, pp. 88-90.4. Lamping,  John; Rao, Ramana; and Pirolli, Peter. Visualizing Large Trees Using the Hyperbolic Browser, Proceedings of the Conference on Human Factors in Computing Systems, April 13-18, 1996, Vancouver, British Columbia, Canada [http://www.acm.org/sigchi/chi96/proceedings/video/Lamping/hb-video.html5. ibid.6. Andrews, Keith. Browsing, Building, and Beholding Cyberspace, New Approaches to Navigation, Construction, and Visualisation of Hypermedia on the Internet, Doctoral dissertation, Graz University of Technology, September, 1996.97. Lawton, George. Building the New Knowledge Interface: The GUI is passe. Advanced software and hardware technologies are converging in machine-human interfaces that vastly extend knowledge transfer capacities. Knowledge Management Magazine. February, 1999.8. Mohageg, M.F. The influence of hypertext linking structures on the efficiency of information retrieval. Human Factors, 34(3), 351-367. 9. Lawton, George. loc. cit.Web sites:Xerox PARC's User Interface Research Group [http://www.parc.xerox.com/istl/projects/uir/projects/InformationVisualization.html].andhttp://www2.parc.com/istl/projects/uir/projects/ii.htmlThe Online Library of Information Visualization Environments (OLIVE) [http://www.otal.umd.edu/Olive/].Spotfire [http://www.spotfire.com].Pacific Northwest National Laboratories [http://www.pnl.gov/infoviz/].InXight Software [http://www.inxight.com].Carnegie Mellon University, The Universal Library [http://www.ulib.org/webRoot/_hTree/].TheBrain Technologies [http://www.thebrain.com].TheBrain Technologies WebBrain [http://www.webbrain.com].Additional ReadingAllen, Maryellen Mott. The Hype Over Hyperbolic Browsers Online 26:3 (May/June 2002) pp. 20-22, 24, 26, 28.Chimera, R., Wolman, K., Mark, S., Schneiderman B. (revised Sept. 1993) An exploratory evaluation of three interfaces for browsing large hierarchical tables of contents, ACM Transactions on Information Systems, vol.12., #4 (Oct. 94) 383-406. CS-TR-2620, CAR-TR-539] shows that tables of contents that allow the user to expand and contract levels 10of the hierarchy decrease browsing time compared to a stable, fully-expanded version.  Lamping, John and Rao, Ramana. The hyperbolic browser: A focus+context technique for visualizing large hierarchies. Journal of Visual Languages and Computing, 6:4, 1995.Nation David A.; Plaisant, Catherine; Marchionini, Gary; and Komlodi, Anita. Visualizing websites using a hierarchical table of contents browser: WebTOC  (http://www.cs.huji.ac.il/~sdbi/1999/elik/nation.html) describes a  method for visualizing the contents of a Web site with a hierarchical table of contents using a Java program and applet called WebTOC. Early results from user studies suggest that WebTOC is easily learned and can assist users in navigating websites.

https://digitalcommons.providence.edu/cgi/viewcontent.cgi?article=1031&amp;context=facstaff_pubs

Hyperbolic Browsers: From GUI to KUI

Abstract

Similar works

Full text

Available Versions

HELIN Digital Commons

DigitalCommons@Providence