Andre Hypermedie Domæner 2D spatiale hypermedier Context aware hypermedier Frank Allan Hansen fah@cs.au.dk Aarhus Universitet Hypermedier & Web / WAU 2011
2D Spatial hypermedier Rationale & Definition Auqanet, VIKI, and VKB Andre spatiale systemer
Rationale: Hvorfor Spatial?
Rationale: Hvorfor Spatial? Hvad er hypermedier?
Rationale: Hvorfor Spatial? Hvad er hypermedier? - Navigationelle hypermedier: Nodes, links, and anchors, - Vannevar Bush (1945): machine support for associative memory - Ted Nelson (1984): non-sequential forms of writing involving links. - Doug Engelbart (1984): [Augment s links were] textual citations to some specific file item. - Conklin (1987): [Links are] the essential feature of hypertext Link
Rationale: Hvorfor Spatial? Navigationelle hypermedier: Relationer mellem informationsobjekter repræsenteret som eksplicitte links - Men når man arbejder med store informationsmængder er disse relationer måske ikke kendt på forhånd Halasz seven issues: premature sorting - Halasz (1991): [nodes] explicitly or implicitly organized into one or more structures Hvad er hypermedier? - Computerunderstøttelse for relationer mellem informationsobjekter
Rationale: Hvorfor Spatial? Hvad er spatiale hypermedier? - Man arbejder stadig med struktur - Ikke repræsenteret med eksplicitte links (link-less), men rumligt organiseret - Spatial placering, former, farver og andre visuelle virkemidler - Maskin-understøttelse for struktur Gør det nemmere at arbejde med tvetydige, ufuldkomne og emergent strukturer Simpel interaktion og ad-hoc organisering Udnytter mennesket spatiale forståelse og hukommelse Sorterings fase (første fase) - Andre hypermedier teknikker kan benyttes bagefter 5
Spatial organisering af materialer Materialer ser forskellige ude - Farve og form kan hjælpe med at huske materialer Placering opretholder sammenhæng mellem materialer Lokation, lokation, lokation! Fysisk tilgang til materialer
Informations Analyse Eksplorativ fortolkning og analyse af digitalt materiale - Ingen formalisme - Sortering, prioritering, analysering, meningsdannelse - Eks: Efterretning Forskning The Central Intelligence Agency (CIA) is a civilian intelligence agency of the United States government. Its primary function is collecting and analyzing information about foreign governments, corporations, and persons in order to advise public policymakers. Wikipedia 7
Spatial hypermedier Repræsentation frem for navigering - Informationen er jo nødvendigvis ikke struktureret på forhånd Oprettelse af struktur fremfor læsning - Uformel interaktion - Nemt at afprøve ting og re-arrangere materialer - Personligt struktureringsværktøj; ikke forfatterværktøj eller præsentationsværktøj Visuel struktur - Rumlig placering (relationer) - Visuel udseende (typer) 9
Hypermedie Domæner Liberal 2D canvas Single/multiple Document window(s) No abtractions, types, regularities Abstractions on demand User-defined abstractions System defined abstractions, (Eg. Argumentation models) Regelbaseret, Modelbaseret 10
Eksempel på en argumentation efter Toulmins model
Hypermedie Domæner Liberal 2D canvas Single/multiple Document window(s) No abtractions, types, regularities Abstractions on demand User-defined abstractions System defined abstractions, (Eg. Argumentation models) Regelbaseret, Modelbaseret 12
2D Spatial hypermedier Rationale & Definition Auqanet, VIKI, and VKB Andre spatiale systemer
Aquanet
Aquanet - Spatial Diskussion 15
Spatiale Strukturer Lists - Lister af ens objekter Stacks - Overlappende stakke af ens objekter Composites - Ens arrangementer af forskellig objekter Heaps - Overlappende objekter af forskellig type 16
VIKI - data model Objekter - Indholdsholdene objekter (Dexter Atomic Components) - Hvert objekt refereres med et eller flere visuelle symboler. - Deklarering af pre-definerede typer ikke nødvendigt Typen angives med den visuelle formatering (form, farve, osv) Collections - System-understøttede hierarkier Kan indeholde en vilkårlig spatial arrangement af objekter eller andre collections - Visuelt symbol: Scrollbare 2½D rum Composites - Kombination af to eller flere objekter eller collections i en bestemt spatial/visuel konfiguration
Relationer i VIKI 18
Spatial Support Collections: spatial navigation, lokal kontekst 19
Spatial Parser Click selection Enable interaction with implicit structures Structures need not be explicitly defined Works much like text selection in text editors 20
Spatial Parser Collection suggestion - Bridge the gap between user activities and data model, Suggest collections based on subdivision of material created by the user - User can iterate through suggestions Collections are created and populated by VIKI
Spatial Parser Composite suggestion - New Abstraction and structures on demand Based on recurring spatial patterns Enables user-accessible composites types, defined From parser Modified from parser suggestion From scratch - Composite types can be applied to material 22
Visual Knowledge Builder (VKB) - Koncept og idé VKB efterfølger til VIKI - Beregnet til at organisere og fortolke information fra forskellige kilder - F.eks. fra desktop og WWW - Anvendelse: Skrivning af relateret arbejde i afhandling eller artikel kategorisering af information planlægning og organisering af opgaver
Visual Knowledge Builder What to do... - start by dragging and dropping items from the desktop, web pages, and images into your personal or group information space. - then move the visual symbols into clusters, lists, or other structures. - categorize symbols by changing visual attributes like color, border color, border width, font, etc. - as your information space enlarges, put symbols into a hierarchy of collections. 24
2D Spatial hypermedier Rationale & Definition Auqanet, VIKI, and VKB Andre spatiale systemer
CAOS - Master's Thesis, AU Open, collaborative, Web integration 26
works author of imapping This is an Heiko Haller and Andreas Abecker. annotation 2010. imapping: a zooming user interface approach for personal and semantic knowledge management. imapping: a graphical approach to semi-structured knowledge m imapping core principles spatial layout nesting, zooming graphical authoring allow vague structures capture implicit semantics minimize cognitive overhead use Conceptual Data Structures Conceptual Data Structures CDS is a lightweight top-level ontology about relations that naturally occur in common knowledge artefacts. It is designed to bridge the gap between unstructured content like informal notes and formal semantics like ontologies by allowing the use of vague semantics and by subsuming arbitrary relation types under more general ones. relation Abstrac imapping is a technique for visually st objects. It supports the full range from semi-structured personal information knowledge models. With imaps, users overview to fine-grained structures w refining the knowledge base in one co An imap is comparable to a large whit items can be positioned like post-its b other. Spatial browsing and zooming a facilities make it easy to structure co imapping builds on a zooming user int facilitate navigation and to help users the knowledge space. While a first im developed, imapping is still in a conce we describe the imapping approach a and extend the advantages of other a context/detail subclass part of annotation tag type order
other methods etc... CS-TR-3665 July 1996 ISR-TR-96-66 The Eyes Have It: A Task by Data Type Taxonomy for Information Visualizations Ben Shneiderman Department of Computer Science Human-Computer Interaction Laboratory, and Institute for Systems Research University of Maryland, College Park, Maryland 20742 USA ben@cs.umd.edu, http://www/cs.umd.edu/projects/hcil/ IEEE TRANSACTIONS ON SOFTWARE ENGINEERING, VOL. 30, NO. 8, AUGUST 2004 1 Benjamin B. Bederson, Jesse Grosjean, and Jon Meyer Abstract In this paper, we analyze toolkit designs for building graphical applications with rich user interfaces, comparing polylithic and monolithic toolkit-based solutions. Polylithic toolkits encourage extension by composition and follow a design philosophy similar to 3D scene graphs supported by toolkits including Java3D and OpenInventor. Monolithic toolkits, on the other hand, encourage extension by inheritance, and are more akin to 2D Graphical User Interface toolkits such as Swing or MFC. We describe Jazz (a polylithic toolkit) and Piccolo (a monolithic toolkit), each of which we built to support interactive 2D structured graphics applications in general, and Zoomable User Interface applications in particular. We examine the trade offs of each approach in terms of performance, memory requirements, and programmability. We conclude that a polylithic approach is most suitable for toolkit builders, visual design software where code is automatically generated, and application builders where there is much customization of the toolkit. Correspondingly, we find that monolithic approaches appear to be best for application builders where there is not much customization of the toolkit. Index Terms Monolithic toolkits, polylithic toolkits, object-oriented design, composition, inheritance, Zoomable User Interfaces (ZUIs), animation, structured graphics, Graphical User Interfaces (GUIs), Pad++, Jazz, Piccolo. æ 1 INTRODUCTION developers rely on User Interface (UI) toolkits such as Microsoft s MFC and.net Windows Forms, and Sun s Swing and AWT to create visual user interfaces. However, while these toolkits are effective for traditional widget-based applications, they fall short when the developer needs to build a new kind of user interface component-one that is not bundled with the toolkit. These components might be simple widgets, such as a range slider or more complex objects, including interactive graphs and charts, sophisticated data displays, timeline editors, zoomable user interfaces, or fisheye visualizations. Developing application-specific components usually requires significant quantities of custom code to manage a range of features, many of which are similar from one component to the next. These include managing which areas of the window need repainting (called region management), repainting those regions efficiently, sending events to the internal object that is under the mouse pointer, managing multiple views, and integrating with the underlying windowing system. Writing this code is cumbersome, yet most standard 2D UI toolkits provide only rudimentary support for creating custom components typically, just a set of methods for drawing 2D shapes and methods for listening to low-level events. Some toolkits such as Tcl/Tk [19] include a structured canvas component, which supports basic structured. The authors are with the Human-Computer Interaction Laboratory, Institute for Advanced Computer Studies, Computer Science Department, University of Maryland, College Park, MD 20742. E-mail: {bederson, jesse, meyer}@cs.umd.edu. Manuscript received 16 Sept. 2003; accepted 16 Mar. 2004. Recommended for acceptance by D. Weiss. For information on obtaining reprints of this article, please send e-mail to: tse@computer.org, and reference IEEECS Log Number TSE-0145-0903. graphics. These canvases typically contain a collection of graphical 2D objects, including shapes, text, and images. These components could in principal be used to create application-specific components. However, structured canvases are designed primarily to display graphical data, not to support new kinds of interaction components. Thus, for example, they usually do not allow the application to extend the set of objects that can be placed within the canvas. We have found that many developers bypass these structured canvas components and follow a roll-yourown design philosophy, rewriting large quantities of code and increasing engineering overhead, particularly in terms of reliability and programmability. There are also commercial toolkits available such as Flash [6] and Adobe SVG Viewer [2]. But, these approaches are often difficult to extend and integrate into an application. We believe future user interface toolkits must address these problems by providing higher-level libraries for supporting custom interface components. However, there is still an open question regarding which design philosophy to adopt for these higher-level toolkits. The core issue we address here is whether toolkits should be designed so that the inevitable complexity and extension of the components are supported primarily through composition (which we call polylithic) or inheritance (which we call monolithic). In this paper, we consider these two design approaches for interactive structured graphics toolkits through two toolkits we built: Jazz, 1 a polylithic toolkit; and Piccolo, 2 a 1. The name Jazz is not an acronym, but rather is motivated by the music-related naming conventions that the Java Swing toolkit started. In addition, the letter J signifies the Java connection, and the letter Z signifies the zooming connection. Jazz is open source software according to the Mozilla Public License, and is available at: http://www.cs.umd.edu/ hcil/jazz. 2. The name Piccolo is motivated by the music connection of Jazz and Swing, and because it is so small (approximately one tenth the size of Jazz). Piccolo is open source software according to the Mozilla Public License, and is available at: http://www.cs.umd.edu/hcil/piccolo. 0098-5589/04/$20.00 ß 2004 IEEE Published by the IEEE Computer Society!"#$%&'()*+$,,"%- >1*#"5+1$5&3?&@3+*;51"&'0)1$01&#$=&@1$51"&?3"&5(1&'5;=A&3?&>):)5#2&B)C"#")18.%/01"23"*45'12'%3*'%*!,$&'$1*+6,"7&"8& D1E#8&<F/&G$)H1"8)5A!"#$%&'()*+#$,&-.&/)0(#12&/33"1,&4"115#+&/#233",&6#371)&68)1(,&9#:(;&<%%#*1==) @3221:1&'5#5)3$,&DI&JJKLMNMOOP&G'< >1*#"5+1$5&3?&@3+*;51"&'0)1$01&#$=&@1$51"&?3"&5(1&'5;=A&3?&>):)5#2&B)C"#")18 QO&RJR&KSP&MPOS D1E#8&<F/&G$)H1"8)5A @3221:1&'5#5)3$,&DI&JJKLMNMOOP&G'< QO&RJR&KSP&MPOS 8()*+#$T08.5#+;.1=; 25 )#-&+-7(."#$%&$'&8()011$)&+/*G6-)$,(+*&$%4-2$)8(5+'$,G+*+&+-&+9$,+-7/1)8(9+)0-7(7-*10-1$8()#-&+-7(#-%)$%8(+*2%$5$*&-7(4/%5-7+C-&+/*!"#$%&$'&(.-)(7/*1(6$$*(%$2/1*+C$,(-)(-(4/%5(/4(3*/<7$,1$ %$#%$)$*&-&+/*($5#.-)+C+*1(+*&$%,/205$*&(%$7-&+/*):(=*(-,,+&+/*(&/ 5/%$(2/55/*(#-1$G)+C$,(*/,$)(4/0*,(+*()")&$5)(7+3$(?PQ(JRK -*,(&.$(S$68(-(*056$%(/4()")&$5)(.-9$(+*270,$,()5-77$%G)+C$, +*4/%5-&+/*(2.0*3)(&/(%$#%$)$*&(4+*$%G1%-+*$,(%$7-&+/*):(T-%7" $'-5#7$)(+*270,$(&.$(%$#%$)$*&-&+/*(/4(Q$-%7$U)(V.+*$)$(W//5 -%105$*&(+*(T027+,(JXYK8(;/075+*G)&%02&0%$,(-*-7")$)(+* D$%5+))+/*(&/(5-3$(,+1+&-7(/%(.-%,(2/#+$)(/4(-77(/%(#-%&(/4(&.+)(</%3(4/% #$%)/*-7(/%(27-))%//5(0)$(+)(1%-*&$,(<+&./0&(4$$(#%/9+,$,(&.-&(2/#+$)(-%$ */&(5-,$(/%(,+)&%+60&$,(4/%(#%/4+&(/%(2/55$%2+-7(-,9-*&-1$(-*,(&.-&(2/#+$) 6$-%(&.+)(*/&+2$(-*,(&.$(4077(2+&-&+/*(/*(&.$(4+%)&(#-1$:(;/(2/#"(/&.$%<+)$8(/% %$#067+).8(&/(#/)&(/*()$%9$%)(/%(&/(%$,+)&%+60&$(&/(7+)&)8(%$^0+%$)(#%+/% )#$2+4+2(#$%5+))+/*(-*,M/%(-(4$$:( 789:;8(g0*$(RRGRH8(\hh\8(V/77$1$(D-%38(P-%"7-*,8(iQ]:( V/#"%+1.&(\hh\(]VP(RGH[RRXGIYYGhMh\Mhhha:::jH:hh:( 25 Z/&$V-%,)(JR[K8(-*,(=@=QG6-)$,(,$)+1*(%-&+/*-7$(+*(P+3%/#7+)(J\\K -*,(1=@=Q(JIK: S/%3(/*(3*/<7$,1$G6-)$,(."#$%&$'&(6$2-5$(7$))(2/55/*(<+&. &.$($5$%1$*2$(/4(&.$(S$6:(b*$(%$-)/*(+)(&.-&(&.$(S$6U)(#%+5-%" %$#%$)$*&-&+/*)8($:1:(!;Pc8(,+,(*/&(+*270,$(0)$407(4-2+7+&+$)(4/% 5/%$(4/%5-7(%$#%$)$*&-&+/*:(P/%$(%$2$*&()&-*,-%,)(.-9$(2.-*1$, &.-&:(=*,$$,8(5-*"(/4(&.$(-6/9$(&.$5$)(-%$(6$+*1(%$9+)+&$,(+*,+)20))+/*)(/4(&.$(EQ$5-*&+2(S$6:F(dPc(+*270,$)(5-*"(/4(&.$ 2.-%-2&$%+)&+2)(/4($-%7+$%($44/%&)(<+&.(%$1-%,)(&/(+*&$1%-&+*1(4%-5$G 6-)$,( %$#%$)$*&-&+/*)( -*,(."#$%&$'&:( c+3$( ]^0-*$&U) %$#%$)$*&-&+/*8(+&(+)(-(5$&-G7-*10-1$(&.-&(2-*(6$(0)$,(&/($*2/,$ )#$2+4+2(3*/<7$,1$(%$#%$)$*&-&+/*(7-*10-1$):(;.$(W$)/0%2$ N$)2%+#&+/*(O%-5$</%3(AWNOB(-*,(N]Pceb=c(4/77/<(&.$ 3*/<7$,1$(+*&$%2.-*1$(4/%5-&(A?=OB(-*,(3*/<7$,1$(^0$%"(-*, 5-*+#07-&+/*(7-*10-1$(A?fPcB(-)()&-*,-%,)(4/%().-%+*1(2/55/* #%/2$,0%-7(%$#%$)$*&-&+/*)(/4(3*/<7$,1$: ;.$)$(-%$(-77(%$#%$)$*&-&+/*)(,$)+1*$,(&/(-+,(+*(&.$(0)$(-*,().-%+*1 /4(3*/<7$,1$(/*2$(+&(+)(%$#%$)$*&$,8(60&(./<(&.$(3*/<7$,1$(+) E-0&./%$,F(+*(&.$(4+%)&(#7-2$(+)(*/&(2/*)+,$%$,:(b0%(4/20)(+)(/*(./< &/()0##/%&(&.+)($'#%$))+/*8(<.+2.(<$(2-77(0123.'/4'+5(%./%146(;.+) +)(-(2/*)&%02&+9$(-2&+9+&"(<.$%$(&.$(-0&./%U)(/<*(3*/<7$,1$(+) +5#-2&$,(6"(&.$($'#%$))+/*(#%/2$)):(@$)+,$)(#%/9+,+*1(9+)0-78 )#-&+-7(-*,(&$'&0-7(5$-*)(/4(2/550*+2-&+/*8(<$(-%$(60+7,+*1 #%/-2&+9$()0##/%&(4/%(&.+)(#%/2$)): ;.$(*$'&()$2&+/*(,+)20))$)(,+44+207&+$)(<+&.(3*/<7$,1$ %$#%$)$*&-&+/*(-*,(+5#7+2-&+/*)(4/%(,$9$7/#+*1(&//7)(&/(.$7# Mum Dog House Charly Daddy Mouse Cat Computer Papers Spider Office Boss Printer search-filter Bulldozer Horse Type: Animal Farm Farmer Buildings Stable Pig new Text... superordinate Node when [enter] is pressed while editing a node, editing is anded and a Textcursor is set to the position below the node - where a new paragraph would start. Andreas Abecker Max Völkel WP1 members KTH Yngve Sundblad Bosse Westerlund FZI Heiko Haller Rosa Gutjohnsdottir Visualisation / UI Heiko Haller MAyG imapping Search House Mum Daddy Charly Dog Cat Knowledge Articulation Max Völkel Semantic Wiki Mouse imapping Examples Office Boss Computer Printer Papers Spider search-filter Type: Animal Farm Farmer Bulldozer Buildings Stable Pig Horse imapping imapping related work Mapping Techniques Mind-Maps Concept Maps Knowledge Maps Spatial Hypertext other methods etc... tools Literature imapping Design Principles 7 Tasks of Information Visualisation overview details-on-demand Focus & Context Levels Of Detail Conceptual data Structures zoom filter relate history extract Designing the User Interface Using Vision to Think The Eyes Have It: Usability Heuristics Zoomable User Interfaces Beyond the Plane Hide & Progressive Disclosure Visual Information Seeking Mantra overview first zoom and filter details on demand NepomukProject SurroundingWikiPage Max works_for knows Rudi Heiko works_for imapping DenkWerkzeug2006_CDS [event] Heiko Haller and Andreas Abecker. participant_of HeikoHaller 2010. imapping: a zooming user organiser_of interface MaxVölkel approach for personal and met_at semantic knowledge management. DennyVrandecic Eyal NepoWorkPackages Max imapping is developed in imapping related work imapping Design Principles Mapping Techniques Mind-Maps Concept Maps Knowledge Maps Literature Designing the User Interface Using Vision to Think The Eyes Have It: 7 Tasks of Information Visualisation overview zoom Focus & Context Levels Of Detail Hide & Progressive Disclosure Spatial Hypertext tools Usability Heuristics Zoomable User Interfaces Beyond the Plane filter details-on-demand relate history Visual Information Seeking Mantra overview first zoom and filter details on demand extract Abstract A useful starting point for designing advanced graphical user interfaces is the Visual Information- Seeking Mantra: Overview first, zoom and filter, then details-on-demand. But this is only a starting point in trying to understand the rich and varied set of information visualizations that have been proposed in recent years. This paper offers a task by data type taxonomy with seven data types (1-, 2-, 3-dimensional data, temporal and multi-dimensional data, and tree and network data) and seven tasks (overview, zoom, filter, details-on-demand, relate, history, and extract).!"#$%!&$ Z/&$V-%,)(JR[K8(-*,(=@=QG6-)$,(,$)+1*(%-&+/*-7$(+*(P+3%/#7+)(J\\K!"#$%&$'&(%$#%$)$*&)(+,$-)(&.%/01.(2.0*3)(/4(&$'&(/%(/&.$%(5$,+- -*,(1=@=Q(JIK: +*&$%2/**$2&$,(6"(%$7-&+/*)8(&"#+2-77"(*-9+1-&+/*-7(7+*3):(;.$ ;.+)(4+%)&(%/0*,(/4(%$#%$)$*&-&+/*-7(."#$%&$'&(.$7#$,(5/&+9-&$(&.$ )+5+7-%+&"(&/(3*/<7$,1$(%$#%$)$*&-&+/*)()02.(-)(4%-5$)(-*,!"#$%&$'&(%$#%$)$*&)(+,$-)(&.%/01.(2.0*3)(/4(&$'&(/%(/&.$%(5$,+-,$)+1*( /4( -( *056$%( /4( )")&$5)( <+&.( 5/%$( $'#%$))+9$ )$5-*&+2(*$&)(.-)(7$,(&/(502.($44/%&(+*(0)+*1(."#$%&$'&()")&$5)(4/% %$#%$)$*&-&+/*):(=NT(JRHK($'&$*,$,(Z/&$V-%,)(&/(+*270,$(- 3*/<7$,1$(%$#%$)$*&-&+/*(-*,($'&$*,+*1(."#$%&$'&()")&$5)(&/ +*&$%2/**$2&$,(6"(%$7-&+/*)8(&"#+2-77"(*-9+1-&+/*-7(7+*3):(;.$ &',-.!&'+#!"/(4/%(,$4+*+*1(&"#$)(&.%/01.(&.$(+*.$%+&-*2$(/4 5-3$(&.$5(-67$(&/($'#%$))(5/%$:(;.+)(</%3(.-)(5$&(<+&.(7+5+&$, -&&%+60&$)(-*,(6$.-9+/%(<+&.+*(&.$(2/*&$'&(/4(+*)&%02&+/*-7(,$)+1*: )022$))(,0$(&/(,+44+207&+$)(+*270,+*1(&.$(&-2+&(-*,()+&0-&$,(*-&0%$(/4 )+5+7-%+&"(&/(3*/<7$,1$(%$#%$)$*&-&+/*)()02.(-)(4%-5$)(-*, QDW=Z;(JXK8(<+&.(-*(-+5(&/($*.-*2+*1(60)+*$))(#%-2&+2$8(0)$, 502.(3*/<7$,1$:(=*)&$-,(/4(9+$<+*1(3*/<7$,1$($'#%$))+/*(-)(-* )$5-*&+2(*$&)(.-)(7$,(&/(502.($44/%&(+*(0)+*1(."#$%&$'&()")&$5)(4/% Q5-77;-73(5$&./,)(-&&-2.$,(&/(-(4%-5$G6-)$,(%$#%$)$*&-&+/*(&/ -77(-&(/*2$($9$*&8(<$(9+$<(+&(-)(-(2/*)&%02&+9$(#%/2$))8(+:$: +*&$1%-&$(."#$%5$,+-8()$5-*&+2(*$&</%38(-*,($'#$%&()")&$5 3*/<7$,1$(60+7,+*1:(;.$(>+)0-7(?*/<7$,1$(@0+7,$%(A>?@B(7$&) 3*/<7$,1$(%$#%$)$*&-&+/*(-*,($'&$*,+*1(."#$%&$'&()")&$5)(&/ %$#%$)$*&-&+/*):(V/*2/%,$(JRRK()0##/%&$,(3*/<7$,1$($*1+*$$%+*1 0)$%)($'#%$))(2/*&$*&(9+-(9+)0-7(/%(&$'&0-7(5$-*)(-*,(7-&$% &.%/01.(-(%$#%$)$*&-&+/*(+*(<.+2.(%$7-&+/*)(6$&<$$*(*/,$)(2/07, 4/%5-7+C$(&.-&(2/*&$*&(+*(&.$(4/%5(/4(-&&%+60&$)8(9-70$)8(&"#$)8(-*, 5-3$(&.$5(-67$(&/($'#%$))(5/%$:(;.+)(</%3(.-)(5$&(<+&.(7+5+&$, 6$(2/*)&%-+*$,:(?*/<7$,1$()&%02&0%+*1(<-)(&.$(1/-7(/4(]^0-*$& %$7-&+/*):(>?@(#%/-2&+9$7"()0##/%&)(&.+)(#%/2$))(&.%/01.(-()$&(/4 JR_K8(<.+2.(-77/<$,(0)$%)(&/(,$4+*$(%$#%$)$*&-&+/*-7()2.$5-)(&.-& )011$)&+/*(-1$*&)(<./)$(+*&$%-2&+/*(<+&.(&.$(0)$%(+)(5$,+-&$,(6" )022$))(,0$(&/(,+44+207&+$)(+*270,+*1(&.$(&-2+&(-*,()+&0-&$,(*-&0%$(/4 +*270,$,(/6`$2&(-*,(%$7-&+/*(&"#$)8(-&&%+60&$)8(-*,(2/*)&%-+*&):(;.$ &.$()011$)&+/*(5-*-1$%:(D%$7+5+*-%"($9-70-&+/*(/4(&.$()011$)&+/* -6/9$(%$#%$)$*&-&+/*)($5#.-)+C$(&.$($'#%$))+/*(/4(,$27-%-&+9$ 5-*-1$%(-*,()011$)&+/*(-1$*&)("+$7,)(#/)+&+9$(%$)07&)(60&(40%&.$% 502.(3*/<7$,1$:(=*)&$-,(/4(9+$<+*1(3*/<7$,1$($'#%$))+/*(-)(-* 3*/<7$,1$:(D.+,+-)(J\XK($56$,,$,(#%/2$,0%-7(3*/<7$,1$(+*(&.$ 2/*4+%5)(&.-&(&.$%$(+)(*/(E)+79$%(6077$&F(4/%(3*/<7$,1$($*1+*$$%+*1."#$%&$'&(%$#%$)$*&-&+/*8()02.(-)(+*4$%$*2$)(6-)$,(/*(4/%<-%,G GG()$5-*&+2($'#%$))+/*(+)(5/)&(7+3$7"(&/(.-##$*(,0%+*18(-*,(+) -77(-&(/*2$($9$*&8(<$(9+$<(+&(-)(-(2/*)&%02&+9$(#%/2$))8(+:$: 2.-+*+*18(6"(-77/<+*1(*/,$)(+*(+&)(."#$%6-)$(&/(2/*&-+*(-()&/%$,,%+9$*(6"8(&-)3(#$%4/%5-*2$: ^0$%":(]77(/4(&.$)$()")&$5)(67$*,$,(%$#%$)$*&-&+/*)(4%/5 3*/<7$,1$(60+7,+*1:(;.$(>+)0-7(?*/<7$,1$(@0+7,$%(A>?@B(7$&) &'()*+,-)./'01/#234)5(/6).5,-7(+,.."#$%&$'&(-*,(-%&+4+2+-7(+*&$77+1$*2$:(O0%&.$%(,+)20))+/*)(/4(&.$ 0)$%)($'#%$))(2/*&$*&(9+-(9+)0-7(/%(&$'&0-7(5$-*)(-*,(7-&$%,$)+1*(-*,(0)$(/4()02.()")&$5)(-%$(4/0*,(+*(JRaK8(JXRK8(-*,(J\HK:!:H:I(J809+,:'(-+0/80(),9'5)./'01/;,).)0('(-+0KL(!"#$%&$'&M!"#$%5$,+-(G(!"#$%&'#&("')*+()'"+%))(') S/%3(/*(3*/<7$,1$G6-)$,(."#$%&$'&(6$2-5$(7$))(2/55/*(<+&. 4/%5-7+C$(&.-&(2/*&$*&(+*(&.$(4/%5(/4(-&&%+60&$)8(9-70$)8(&"#$)8(-*, &.$($5$%1$*2$(/4(&.$(S$6:(b*$(%$-)/*(+)(&.-&(&.$(S$6U)(#%+5-%" <)0),'=/$),:. %$#%$)$*&-&+/*)8($:1:(!;Pc8(,+,(*/&(+*270,$(0)$407(4-2+7+&+$)(4/% N$)+1*8(!05-*(O-2&/%) %$7-&+/*):(>?@(#%/-2&+9$7"()0##/%&)(&.+)(#%/2$))(&.%/01.(-()$&(/4 5/%$(4/%5-7(%$#%$)$*&-&+/*:(P/%$(%$2$*&()&-*,-%,)(.-9$(2.-*1$, >)?@+,1. &.-&:(=*,$$,8(5-*"(/4(&.$(-6/9$(&.$5$)(-%$(6$+*1(%$9+)+&$,(+* )011$)&+/*(-1$*&)(<./)$(+*&$%-2&+/*(<+&.(&.$(0)$%(+)(5$,+-&$,(6",+)20))+/*)(/4(&.$(EQ$5-*&+2(S$6:F(dPc(+*270,$)(5-*"(/4(&.$ )#-&+-7(."#$%&$'&8()011$)&+/*G6-)$,(+*&$%4-2$)8(5+'$,G+*+&+-&+9$ &.$()011$)&+/*(5-*-1$%:(D%$7+5+*-%"($9-70-&+/*(/4(&.$()011$)&+/* 2.-%-2&$%+)&+2)(/4($-%7+$%($44/%&)(<+&.(%$1-%,)(&/(+*&$1%-&+*1(4%-5$G,+-7/1)8(9+)0-7(7-*10-1$8()#-&+-7(#-%)$%8(+*2%$5$*&-7(4/%5-7+C-&+/* 6-)$,( %$#%$)$*&-&+/*)( -*,(."#$%&$'&:( c+3$( ]^0-*$&U) AB//CD;E%$EF$/!G6/>GHIJE6<E/ 5-*-1$%(-*,()011$)&+/*(-1$*&)("+$7,)(#/)+&+9$(%$)07&)(60&(40%&.$% %$#%$)$*&-&+/*8(+&(+)(-(5$&-G7-*10-1$(&.-&(2-*(6$(0)$,(&/($*2/,$ %E;%E#EG$!$8HG )#$2+4+2(3*/<7$,1$(%$#%$)$*&-&+/*(7-*10-1$):(;.$(W$)/0%2$ 2/*4+%5)(&.-&(&.$%$(+)(*/(E)+79$%(6077$&F(4/%(3*/<7$,1$($*1+*$$%+*1 N$)2%+#&+/*(O%-5$</%3(AWNOB(-*,(N]Pceb=c(4/77/<(&.$!"#$%&$'&(.-)(7/*1(6$$*(%$2/1*+C$,(-)(-(4/%5(/4(3*/<7$,1$ 3*/<7$,1$(+*&$%2.-*1$(4/%5-&(A?=OB(-*,(3*/<7$,1$(^0$%"(-*, %$#%$)$*&-&+/*($5#.-)+C+*1(+*&$%,/205$*&(%$7-&+/*):(=*(-,,+&+/*(&/ GG()$5-*&+2($'#%$))+/*(+)(5/)&(7+3$7"(&/(.-##$*(,0%+*18(-*,(+) 5-*+#07-&+/*(7-*10-1$(A?fPcB(-)()&-*,-%,)(4/%().-%+*1(2/55/* 5/%$(2/55/*(#-1$G)+C$,(*/,$)(4/0*,(+*()")&$5)(7+3$(?PQ(JRK #%/2$,0%-7(%$#%$)$*&-&+/*)(/4(3*/<7$,1$: -*,(&.$(S$68(-(*056$%(/4()")&$5)(.-9$(+*270,$,()5-77$%G)+C$,,%+9$*(6"8(&-)3(#$%4/%5-*2$: +*4/%5-&+/*(2.0*3)(&/(%$#%$)$*&(4+*$%G1%-+*$,(%$7-&+/*):(T-%7" ;.$)$(-%$(-77(%$#%$)$*&-&+/*)(,$)+1*$,(&/(-+,(+*(&.$(0)$(-*,().-%+*1 $'-5#7$)(+*270,$(&.$(%$#%$)$*&-&+/*(/4(Q$-%7$U)(V.+*$)$(W//5 /4(3*/<7$,1$(/*2$(+&(+)(%$#%$)$*&$,8(60&(./<(&.$(3*/<7$,1$(+) -%105$*&(+*(T027+,(JXYK8(;/075+*G)&%02&0%$,(-*-7")$)(+* E-0&./%$,F(+*(&.$(4+%)&(#7-2$(+)(*/&(2/*)+,$%$,:(b0%(4/20)(+)(/*(./< &/()0##/%&(&.+)($'#%$))+/*8(<.+2.(<$(2-77(0123.'/4'+5(%./%146(;.+) D$%5+))+/*(&/(5-3$(,+1+&-7(/%(.-%,(2/#+$)(/4(-77(/%(#-%&(/4(&.+)(</%3(4/% #$%)/*-7(/%(27-))%//5(0)$(+)(1%-*&$,(<+&./0&(4$$(#%/9+,$,(&.-&(2/#+$)(-%$!:H:I(J809+,:'(-+0/80(),9'5)./'01/;,).)0('(-+0KL(!"#$%&$'&M +)(-(2/*)&%02&+9$(-2&+9+&"(<.$%$(&.$(-0&./%U)(/<*(3*/<7$,1$(+) */&(5-,$(/%(,+)&%+60&$,(4/%(#%/4+&(/%(2/55$%2+-7(-,9-*&-1$(-*,(&.-&(2/#+$) +5#-2&$,(6"(&.$($'#%$))+/*(#%/2$)):(@$)+,$)(#%/9+,+*1(9+)0-78 6$-%(&.+)(*/&+2$(-*,(&.$(4077(2+&-&+/*(/*(&.$(4+%)&(#-1$:(;/(2/#"(/&.$%<+)$8(/%!"#$%5$,+-(G(!"#$%&'#&("')*+()'"+%))(') )#-&+-7(-*,(&$'&0-7(5$-*)(/4(2/550*+2-&+/*8(<$(-%$(60+7,+*1 %$#067+).8(&/(#/)&(/*()$%9$%)(/%(&/(%$,+)&%+60&$(&/(7+)&)8(%$^0+%$)(#%+/% #%/-2&+9$()0##/%&(4/%(&.+)(#%/2$)): )#$2+4+2(#$%5+))+/*(-*,M/%(-(4$$:( 789:;8(g0*$(RRGRH8(\hh\8(V/77$1$(D-%38(P-%"7-*,8(iQ]:( ;.$(*$'&()$2&+/*(,+)20))$)(,+44+207&+$)(<+&.(3*/<7$,1$ V/#"%+1.&(\hh\(]VP(RGH[RRXGIYYGhMh\Mhhha:::jH:hh:( %$#%$)$*&-&+/*(-*,(+5#7+2-&+/*)(4/%(,$9$7/#+*1(&//7)(&/(.$7# N$)+1*8(!05-*(O-2&/%) ;.+)(4+%)&(%/0*,(/4(%$#%$)$*&-&+/*-7(."#$%&$'&(.$7#$,(5/&+9-&$(&.$,$)+1*( /4( -( *056$%( /4( )")&$5)( <+&.( 5/%$( $'#%$))+9$ %$#%$)$*&-&+/*):(=NT(JRHK($'&$*,$,(Z/&$V-%,)(&/(+*270,$(- &',-.!&'+#!"/(4/%(,$4+*+*1(&"#$)(&.%/01.(&.$(+*.$%+&-*2$(/4 -&&%+60&$)(-*,(6$.-9+/%(<+&.+*(&.$(2/*&$'&(/4(+*)&%02&+/*-7(,$)+1*: QDW=Z;(JXK8(<+&.(-*(-+5(&/($*.-*2+*1(60)+*$))(#%-2&+2$8(0)$, Q5-77;-73(5$&./,)(-&&-2.$,(&/(-(4%-5$G6-)$,(%$#%$)$*&-&+/*(&/ +*&$1%-&$(."#$%5$,+-8()$5-*&+2(*$&</%38(-*,($'#$%&()")&$5 %$#%$)$*&-&+/*):(V/*2/%,$(JRRK()0##/%&$,(3*/<7$,1$($*1+*$$%+*1 &.%/01.(-(%$#%$)$*&-&+/*(+*(<.+2.(%$7-&+/*)(6$&<$$*(*/,$)(2/07, 6$(2/*)&%-+*$,:(?*/<7$,1$()&%02&0%+*1(<-)(&.$(1/-7(/4(]^0-*$& JR_K8(<.+2.(-77/<$,(0)$%)(&/(,$4+*$(%$#%$)$*&-&+/*-7()2.$5-)(&.-& +*270,$,(/6`$2&(-*,(%$7-&+/*(&"#$)8(-&&%+60&$)8(-*,(2/*)&%-+*&):(;.$ -6/9$(%$#%$)$*&-&+/*)($5#.-)+C$(&.$($'#%$))+/*(/4(,$27-%-&+9$ 3*/<7$,1$:(D.+,+-)(J\XK($56$,,$,(#%/2$,0%-7(3*/<7$,1$(+*(&.$."#$%&$'&(%$#%$)$*&-&+/*8()02.(-)(+*4$%$*2$)(6-)$,(/*(4/%<-%,G 2.-+*+*18(6"(-77/<+*1(*/,$)(+*(+&)(."#$%6-)$(&/(2/*&-+*(-()&/%$, ^0$%":(]77(/4(&.$)$()")&$5)(67$*,$,(%$#%$)$*&-&+/*)(4%/5."#$%&$'&(-*,(-%&+4+2+-7(+*&$77+1$*2$:(O0%&.$%(,+)20))+/*)(/4(&.$,$)+1*(-*,(0)$(/4()02.()")&$5)(-%$(4/0*,(+*(JRaK8(JXRK8(-*,(J\HK:!"#$%&'()*+$,,"%-.%/01"23"*45'12'%3*'%*!,$&'$1*+6,"7&"8&!"#$%&'()*+#$,&-.&/)0(#12&/33"1,&4"115#+&/#233",&6#371)&68)1(,&9#:(;&<%%#*1==) 8()*+#$T08.5#+;.1=; imapping Examples display search results search-filter Type: Animal House Mum Daddy Charly Dog Office Cat Boss Computer Mouse Printer Papers Farm A PPLICATION Toolkit Design for Interactive Structured Graphics!"#$%!&$ &'()*+,-)./'01/#234)5(/6).5,-7(+,. <)0),'=/$),:. >)?@+,1. AB//CD;E%$EF$/!G6/>GHIJE6<E/ %E;%E#EG$!$8HG imapping Search entering text Semantic MediaWiki Max Markus Denny Heiko Projects Nepomuk Nepomuk WorkPackages WP1 WP3 Processes WP++ Case Studies WP6 Architecture WP2 WP5 Application Integration 2p2 WP4 Search Goals Partners Website Farmer Spider Bulldozer Horse Buildings Stable Pig
imapping Heiko Haller and Andreas Abecker. 2010. imapping: a zooming user interface approach for personal and semantic knowledge management. Figure 1: Screen shot with part of an imap (about imapping). Only links from and to one item are visible. up a virtually infinite amount of space for imaps to grow over time, e.g. when used as personal knowledge repositoferent ways of interrelating items which can be used in an imap:
Fra 2½D to 3D: Webvize 3D 28
Fra 2½D to 3D: Webvize 3D 28
Topos: 3D-Spatial Hypermedia Åben integration Pen interaktion - gestures Flere brugere interagerer efter tur Distribueret samarbejde 29
Clusters and arrangements 3D spatial parser understøttelse 30
Context-aware Hypermedia
Overview: Context-aware hypermedia Context-aware Hypermedia Scenario Techniques and Technologies Prototypes
Context-aware Mobile Hypermedia
Scenario: Requirements Scenario indicates requirements for the context-aware hypermedia platform: - Linking objects in digital and physical space - Filtering and adapting information to the use-context - Adapting services and application behavior - Pervasive infrastructure - Support for heterogeneous mobile and stationary devices Diverse devices Diverse locations
Overview: Context-aware hypermedia Context-aware Hypermedia Scenario Techniques and Technologies Prototypes
From open hypermedia to context-aware hypermedia (I)
From open hypermedia to context-aware hypermedia (I) Q: How do we link to physical objects?
From open hypermedia to context-aware hypermedia (I) Q: How do we link to physical objects? A: Open hypermedia!
From open hypermedia to context-aware hypermedia (I) Q: How do we link to physical objects? A: Open hypermedia! Hypermedia support for third-party applications - Open hypermedia structures Anchor based Structures are not embedded in linked resources Externally defined, out-of-line links Write access to resources not required Multiple sets of structures on the same information corpus - Content and structure are separated!
From open hypermedia to context-aware hypermedia (II)
From open hypermedia to context-aware hypermedia (II) If an object (digital or physical) can be identified, it can be linked!