WWW and Internet

1
WWW and Internet

• CS 7450 - Information Visualization
• March 3, 2005
• John Stasko

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 Foley WWW 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
Some 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
Data Set

• Each server request is a data case
• Example variables
• IP Address/Client host
• Timestamp
• URL requested
• HTTP status (success, not found, )
• Bytes delivered
• Referencing URL (HTTP-Referrer)
• User agent (browser and OS info)
• ...

19
One Approach

• Use existing InfoVis tool (Eureka, Spotfire,
  InfoZoom, etc.), load the data set, and analyze
  it
• Get all the strengths and weakness of the InfoVis
  tool for supporting particular analysis tasks

20
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 CHI 98
21
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

22
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

23
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

24
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

25
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

26
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

27
Disk Tree
Lines - tree links Line size brightness -
page access frequency Color - page lifecycle
stage new red continued green
deleted yellow
28
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

29
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

30
Time Tubes
31
Key Point

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

32
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

33
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

34
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

35
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

36
E-Commerce Applications

• What if your focus is on understanding user
  access patterns for web sites selling products to
  consumers?
• What tasks are important?

37
One Approach

• Blue Martini Software
• Aggregate web data and visualize simplified graph
  of user movements through web site
• Highlight places where people leave before
  purchasing
• ...

Brainerd Becker InfoVis 01
38
Different icons represent different kinds of
pages Only show most-used pages
39
E-Commerce mimics mall shopping ) Gender
differences in purchase paths at websites
40
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

41
WebBook and Web Forager

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

Card, Robertson and York CHI 96
42
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

43
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

44
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

45
Assisting People

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

46
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

47
WebBook
48
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

49
Applications

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

50
Web Forager
51
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

52
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
53
Discussion

• Strengths/Weaknesses

54
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 UIST 98
55
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

56
Video
57
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

58
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

59
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

60
Limitations/Future

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

61
Discussion

• Strengths/Weaknesses
• Could it be used elsewhere?

62
Upcoming

• Trees Hierarchies (2 days)
• Reading
• Chapter 8
• Lamping Rao

63
References

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