WWW and Internet

1
WWW and Internet

• CS 7450 - Information Visualization
• October 24, 2000

2
Internet and WWW

• By nature, abstract, so good target for
  visualization
• Often described in terms of metaphors
• Information Superhighway

3
Agenda

• Two main topics
• Presentations of the Internet and WWW
• Focus on topology and navigation, similar to the
  graph visualization work
• Visual aids for browsing and using the WWW and
  the Internet
• Assistive visualizations not focusing on
  presenting net structure and connectivity

4
1. Internet and WWW Topology

• Fundamentally, the Internet is a graph with some
  existing physical topology, though that is often
  not how we want to conceptualize it
• Might think of it as having a structure
• Our discussions from graph visualization are
  germane here

5
The Problem
Mukherjea 95
6
The Problem

• Websites simply are too big
• Huge graphs
• Layout is challenging

7
Step Back

• Why would someone want to visualize the WWW?

8
Reasons

• Aid authors and webmasters with production and
  organization of content
• Assist Web surfers making sense of the
  information
• Help researchers understand the Web

9
Depictions of the Web

• Great web site that presents many different
  conceptualizations of cyberspace
• Atlas of Cyberspacehttp//www.cybergeography.org/
  atlas/
• Lets take a few minutes to browse...

10
Mapping the Internet

• Bill Cheswick at ATT
• Interesting visualizations plus the data sets are
  available
• www.cs.bell-labs.com/who/ches/map/index.html

11
Internet Traffic Paths
www.caida.org/tools/measurement/skitter/
12
MBoneMap
www.cs.berkeley.edu/elan/mbone/map.html
13
Immersive Systems
www.pnl.gov/remote/projects/starlight/
14
View of Web Sites Pages
www.dynamicdiagrams.com/
15
Web Site
www.mos.ics.keio.ac.jp/NattoView
16
Web Site Visitations
www.inventix.com
17
Task Analysis

• Potential web-related tasks
• How and when has info been accessed?
• Where do people enter and spend time?
• How do they move about?
• What paths arent traversed?
• Where are they coming from?
• What has been added, changed, deleted?
• Do changes affect navigation patterns?
• Do we need to do a redesign?

18
Web Ecology

• Problem Most visualizations of the web fail to
  present the dynamically changing ecology of users
  and documents on the web
• What do we mean by ecology metaphor?

Chi, et al 98
19
Web Ecology

• By understanding set of relationships (ecology)
  among users and their information environment,
  and its change through time (evolution)
  individuals can better understand
• Web Content
• Layout of physical and topological space
• Usage through time

20
Existing Visualizations

• Despite useful functions, problems
• Difficulty visualizing large number of documents
• Considerable amount of screen real-estate used
• Only permits the visualization of a site at a
  particular point in time, very difficult to make
  comparisons across times
• No mechanisms provided that allow differences in
  usage to be identified

21
Techniques

• Disk Tree
• Center-rooted tree that represents the hyperlink
  structure of a web site
• Time Tube
• Set of disk trees that organizes and visualizes
  the evolution of web sites

22
Task Application

• Visualizations designed to be useful for
• Local - Finding specific content
• Comparison - Comparing info at two places
• Global - Discovering a trend or pattern in the
  site

23
Analysis Domain

• www.xerox.com, April 97
• 7,588 items across a 30-day period
• 889 new items
• Daily log kept of additions, modifications, and
  deletions of content
• Base data comes from link info, usage log from
  web servers
• Topological info from custom hyperlink database

24
Disk Trees

• Interested in shortest number of hops from one
  document to another
• Breadth-first traversal transforms the web graph
  into a tree by placing the node as close to the
  root node as possible
• After obtaining this tree we then visualize the
  structure using the Disk Tree technique

25
Disk Tree
Lines - tree links Line size brightness -
page access frequency Color - page lifecycle
stage new red continued green
deleted red
26
Advantages

• Structure is compact, with pattern easily
  recognizable
• When viewed straight on or at slight angles, no
  occlusion problems, since entire layout is on a
  2-D plane
• Unlike cone trees, this 2-D representation can
  utilize a third dimension for other information,
  such as time
• Circularity pleasing to the eye

27
Time Tubes

• Time Tubes are multiple disk trees layered out
  along a spatial axis
• Advantages
• By using a spatial axis to represent time, we see
  information space-time in a single visualization
• Focus and Context
• Possibility for Animation

28
Time Tubes
29
Key Point

• Pages there any time during the studied period
  are shown in all disk trees for period, even if
  they didnt exist yet

30
Real Use

• Time Tube answers following questions
• What devolved into dead wood? When did it? Was
  there a correlation with the restructuring of the
  web?
• Product safety pages got darker and darker,
  indicating lower usage
• Doesnt tell why page is less popular, just
  raises a flag to explore page further

31
Real Use

• What evolved into a popular page? When did it?
  Was there a correlation with the restructuring of
  the Web site?
• Redesign of site called attention to Fact Book
  page
• Became more popular and the corresponding Disk
  Trees become greener and greener in successive
  weeks

32
Real Use

• How was usage affected by items added over time?
• Press release issued for new family of products,
  shown as red links
• Usage in the third week jumped from 1 access to
  871 accesses, this example helps us understand
  that this was probably a well received product
  line

33
Real Use

• How was usage affected by items deleted over
  time?
• Change in removing direct link from home page to
  main driver page did not negatively affect the
  overall use of driver information
• Info stayed green indicating usage, but link from
  home page was black, showing not much traffic

34
2. Aiding WWW Browsing

• Can we utilize information visualization
  techniques to help people interact with the WWW
  and the Internet?
• Battle lost in hyperspace problem
• Help us know whats there
• Help us find things

35
Harmony Internet Browser

• Goals
• Provide location feedback
• Alleviate user disorientation
• 2D/3D tightly coupled views

Andrews 95
36
Data Model

• Hierarchical structure - collections of pages
• Links are stored in separate database and are
  bi-directional
• Search and retrieval facilities
• Full text search
• Similarity measures between documents

37
Harmony Session Manager

• Provides navigation, search, and general
  functions
• Similar to a file manager
• Shows pages within a collection
• Provides location feedback, showing this
  documents position in collection
• Tries to fight lost in hyperspace

38
Sessionmanager
39
Local Map

• Short-range radar
• Hyperlink neighborhood
• Collection membership, inline images
• Can navigate by selecting and regenerating
• One use - check for image inlined in multiple
  documents

40
Localmap
41
3D Hyperdocuments

• Harmony VRweb 3D
• Typical VRML style viewer
• 3D website
• models
• embedded hyperlinks
• exploration - walk, fly
• model manipulation

42
3D Structure Maps

• Harmony Information Landscape
• Tightly coupled 3D visualization of Session
  Manager
• Collections are blocks
• Documents are stacked on top of corresponding
  collection block
• Color and height -- type and size
• Also provides 2D flat overview window
• Dynamically updated as user navigates

43
(No Transcript)
44
Whither 3D?

• Are the 3D views helpful?
• Topic to be discussed more fully later...

45
WebBook and Web Forager

• Personal computers viewed as knowledge processors
  before
• Spreadsheets and calculatros
• Now viewed as knowledge sources, portals to vast
  information worlds
• Networking and WWW

Card, Robertson and York 96
46
WWW Problems

• Pages are hard to find
• Users get lost, cant relocate pages
• Difficulty organizing things once found
• Difficulty doing knowledge processing on found
  thing
• Interacting with web is too slow to incorporate
  gracefully into other activities

47
Information Foraging Theory

• From Ecological Biology
• Idea user stalks certain types of information
• Users have tendency to interact repeatedly with
  small clusters of information (locality of
  reference)
• Information encountered at certain rate
• Users evolve to increase finding rate
• Sources evolve to be more attractive

48
Mechanisms Evolved

• 3 mechanisms in the evolution of the web on the
  server side
• Indexes - Lycos search
• Table of contents - Yahoo
• Home pages provided by users with big lists of
  related links

49
A Poor Information Workspace

• To provide insight
• must support sensemaking
• restructuring
• recoding
• Hotlists are one mechanism in this direction

50
Improvements

• WebBook and Web Forager try to do two things to
  foster information sensemaking
• Move away from a single web page, and group and
  manipulate related pages
• Move from a work environment containing a single
  element to a workspace in which the page is
  contained with multiple other entities, including
  Web Books

51
WebBook
52
Features

• WebBook allows for the rapid interaction with
  object at a higher level of aggregation than
  pages
• 3D book representation, uses animation
• Can ruffle through pages, leave bookmarks

53
Applications

• Hot List books
• Topic books
• Search reports
• Book books
• ...

54
Web Forager
55
Web Forager

• Application that embeds the WebBook and other
  objects in a hierarchical 3D information
  workspace
• Workspace is intended to create patches from the
  web where high density of relevant pages (grouped
  together in Web Books) can be combined with rapid
  access

56
Constituents

• Hierarchical Workspace - 3 levels
• Focus Place - full page shown, direct interaction
• Intermediate memory space - books or pages placed
  when they are in use but not immediate focus
• Tertiary space - Storage (bookcase)

Video
57
Discussion

• Strengths/Weaknesses

58
Data Mountain

• 3D document management system
• Prototype is an alternative to web browser
  bookmarks or favorites
• Could be used for any kind of document management

Robertson, et al 98
59
Make-Up

• 3D inclined plane in which thumbnails of web
  pages are placed to serve as favorites
• User is responsible for organization
• Uses smooth animation and audio to assist
  interaction

60
Video
61
User Study

• Data Mountain versus IE4 Favorites
• Experienced IE4 users
• Stored 100 pages, then retrieved them
• DM fared about-as-well with title cue
• DM fared better for all other cues

62
Leveraging Human Capabilities

• Spatial memory analogy with paper placed on a
  pile on your desk
• User is responsible for personal organization
• 3D perception minimal cognitive load, good
  utilization of screen space

63
Interaction Techniques

• Placing pages confinement to inclined plane
  makes normal 2D drag-and-drop sufficient no
  unfamiliar 3D navigation needed
• Continuous feedback both audio and visual
  feedback are natural minimized unexpected
  interactions/surprises

64
Limitations/Future

• Limits number of pages stored
• No explicit support for grouping
• Landmarks/contours as helpers

65
Discussion

• Strengths/Weaknesses
• Could it be used elsewhere?

66
References

• Spence and CMS texts
• All referred to papers and websites
• McNamara Defnet and Craighill, Robeson
  Sheridan F 99 slides