1 / 51

Visualization and Spatial Hypertext

Visualization and Spatial Hypertext. Haowei Hsieh Center for the Study of Digital Libraries Texas A&M University. CPSC 436, 9/28/2006. Information Life Cycle. Modification Annotation & Authoring. Added content influences further access. Reading leads to annotation, note

honorato-burt
Download Presentation

Visualization and Spatial Hypertext

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Visualization and Spatial Hypertext Haowei Hsieh Center for the Study of Digital Libraries Texas A&M University CPSC 436, 9/28/2006

  2. Information Life Cycle Modification Annotation & Authoring Added content influences further access Reading leads to annotation, note taking, and writing Understanding one document may require other documents or result in further information requests Comprehension Skimming & Reading Location Searching & Browsing Located resources must be understood to be evaluated

  3. Formality of Information • People naturally process informal information • By perception, association, abstraction • Computers process formalized information • Database (data tables, records, fields) • Metadata (attributes, values) Less formal More formal Superclass Note A Text Note Subclass Subclass Node B Frames & Semantic Nets Object Text & Graphics Web Database Hypertext

  4. Challenges • Design for humans or computers? • Humans: • Good at abstraction and visual perception • Handle information less formally • Computers: • Good at repetitive computation • Data needs to be formalized

  5. Research Projects • Visual Knowledge Builder (VKB) • An information workspace providing free-form interaction and visual expression for knowledge work with unstructured information • VITE • An information workspace supporting two-way mappings to work with structured information

  6. Related Research • Visual languages • Specify and present relationships • Express relationships in visual workspaces • Explicitly via schema based visual languages • Implicitly via patterns and spatial arrangement

  7. NoteCards Aquanet Tivoli VITE HOS VIKI KMS VKB VNS Related Research • Hypermedia/hypertext • Node and link hypertext • Map-based hypertext • Spatial hypertext • Evolution of hypermedia systems

  8. NoteCards Aquanet VITE VIKI VKB Related Research • Hypermedia/hypertext • Node and link hypertext • Map-based hypertext • Spatial hypertext • Evolution of hypermedia systems

  9. NoteCards Aquanet Tivoli VITE HOS VIKI KMS VKB VNS Related Research • Hypermedia/hypertext • Node and link hypertext • Map-based hypertext • Spatial hypertext • Evolution of hypermedia systems

  10. NoteCards Aquanet Tivoli VITE HOS VIKI KMS VKB VNS Related Research • Hypermedia/hypertext • Node and link hypertext • Map-based hypertext • Spatial hypertext • Evolution of hypermedia systems

  11. Visual Knowledge Builder (VKB) • Information objects: visual data representation • Collections -- hierarchy of 2-d spaces • Visual attributes for user interpretation • Import information by drag & drop, copy/paste • Short Demo

  12. VKB Advanced Features • Spatial parser (structure recognition) • User-defined attributes • Integrated search (NSDL and Google) • Navigable history

  13. VKB Advanced Features Lab Administrators username: haowei group: power user • Spatial parser (structure recognition) • User-defined attributes • Integrated search (NSDL and Google) • Navigable history

  14. VKB Advanced Features • Spatial parser (structure recognition) • User-defined attributes • Integrated search (NSDL and Google) • Navigable history

  15. VKB Advanced Features • Spatial parser (structure recognition) • User-defined attributes • Integrated search (NSDL and Google) • Navigable history

  16. Example Applications • Organization

  17. Example Applications • Information gathering and collection

  18. Example Applications • Project management

  19. VKB Summary • Support the information life cycle • Embedded search and easy import • Visual manipulation and expression • Support for incremental formalization • Gradually transform informal information into semi-formal or formal information • Software freely available at http://www.csdl.tamu.edu/VKB/

  20. VITE • An information workspace for manipulating structured information in a semi-formal setting

  21. Motivation • Difficulties interacting with structured information • Incomplete representation: deconstructive nature of formalization • Intermediate representation: transient states during problem solving

  22. Visualization Visual Parsing Two-way Mapping Two-way Mapping Mapping Data Table Visual Display Link semantic content of the database with visual attributes of information objects

  23. SemanticAttributes Visual Attributes Semantic Attributes • Title, Level, Start Time, Instructor, Classroom, etc. Visual Attributes • Position, Size, Color (background and border), Text label, Border width

  24. Semantic Value Visual Value • Mapping assignments • Day of Week: X Position • Start: Y Position • Difficulty: BG Color • Title: Text Label • Start: Text Label • End: Text Label • Value assignment e.g. Difficulty • Level 1: Green • Level 2: Yellow • Level 3: Red Mathematics Start: 1000 End: 1100

  25. MiscellaneousInterface Visual Workspace Mapping AssignmentInterface MappingDesigner Mapping Engine Mapping Assistant Data Storage VITE Architecture User Inputs Visual Display Mapping Profile Visual Parser Visual Renderer

  26. VITE Interface • Workspace • Mapping Designer • Mapping Assignment • Continuous/Discrete settings • Miscellaneous Interfaces

  27. Available Semantic Attribute Visual Attributes Selected Semantic Attribute Mapping Designer

  28. Mapping Assignment 1. Continuous value 2. Continuous color 3. Discrete value 4. Discrete color

  29. Selected Visual Attribute : Y Size Select Attribute : MarketValue Select Mapping Style: Continuous Available Value Range from Scanning the Database Estimated Range for Selected Visual Attribute Mapping Preview Mapping Assignment 1/4 2 1

  30. Selected Visual Attribute : Background Color Select Attribute : MarketValue Select Mapping Style: Continuous Available Value Range from Scanning the Database Default Color Range for Selected Visual Attribute Mapping Preview Mapping Assignment 2/4

  31. Selected Visual Attribute : X Position Select Attribute : POS Select Mapping Style: Discrete Available Value from Scanning the Database Default Values for Selected Visual Attribute Mapping Assignment 3/4

  32. Selected Visual Attribute : Background Color Select Attribute : POS Select Mapping Style: Discrete Available Values from Scanning the Database Default Values for Selected Visual Attribute Mapping Assignment 4/4

  33. VITE Demo • Class scheduling example used in the tutorial

  34. User Study • Investigate • How people solve problems using visual workspaces • How people use two-way mappings • Observe • General use and selection of visual attributes • Identify • Problems when dealing with two-way mapping • Desired enhancements through feedback

  35. Tasks • Task 1: Flight approach control • User acts as an air traffic controller • schedule airplanes to avoid conflict • Task 2: Fantasy basketball • User acts as a team manager of a fantasy basketball team • Select 5 players within a limited budget

  36. Task 1: Data Attributes Arrival: Arrival time Runway: Pre-assigned runway Flight: Flight Number Category: Airliner, Regional passenger plane, or Cargo plane Airline: Airline who operates this flight Airplane: Type of the aircraft (Make/Model) AP_Speed: Approach speed RW_Length: Required runway length. Capacity: Maximum number of passenger Passengers: Number of passengers on board Departure: Departure time Engine_Type: Type of engine of the aircraft, i.e., Jet, Turbo, etc. No_Engines: Number of engines Gate: Preplanned gate assignment Status: Flight status

  37. Task 1: Example Mapping

  38. Task 1: Example Space

  39. Task 2: Data Attributes Market Value : Current salary to recruit the player POS : Position the player plays Decision : Decision to choose, reject, or still consider the player. Athlete: The name of the player Team : Where the team comes from 3PT : 3 point shots made REB : Rebounds Min : Minimum field goal AST : Assists BLK : Blocked Shots STL : Steals TO : Turnovers FTM-A : Free Throws Made-Attempted FT% : Free Throw Percentage FGM-A : Field Goals Made-Attempted FG% : Field Goal Percentage Prev : Salary of the player's previous contract Change : Change of the player's salary between current market value and previous salary.

  40. Task 2: Example Space

  41. Task 2: Visual Problem Solving

  42. Task 2: Creating Reference

  43. Step 1: select objects to be sorted Task 2: Visual Sorting • Object height is mapped to a critical attribute. The user need to find a proper object by comparing their height.

  44. Task 2: Visual Sorting • Object height is mapped to a critical value. The user need to find a proper object by comparing their height. • Step 2: make the selection into a pile by Stack function

  45. Step 3: Align the selection at top with Align Y - Top function. • A list of objects handy for comparing their height and sorting Task 2: Visual Sorting • Object height is mapped to a critical value. The user need to find a proper object by comparing their height.

  46. Task 2: Comparing

  47. Task 2: Result

  48. Task 2: Similar Strategy

  49. Observations • Users’ preference of visual properties • Position > (Size, Color) • Text label is inevitable • Use and selection of visual properties: • Unmapped visual properties: temporary memory • Text Label: for textural description and feedback • Position: to hold status, sort, distribute, or categorize • Color: to show status, categorization, or reveal value distribution • Size: to compare value (numeric) or show categorization (discrete) • Border Width: rarely used, because too few values available, and it effect the usefulness of border color

  50. VITE Summary • Two-way mapping enables semi-formal manipulation of formalized information • VITE supports users in developing advanced problem solving strategies • VITE provides users new ways of interacting with structured information • Users identified additional features that would support this approach

More Related