ScrollScapes & conTopics
deep documentation of references and ways to share them
in the tradition of the florelegia and commonplace books of the pre-digital era.
A project as part of the Orbis Pictus ~ Theatrum Mundi conference initiated by the Theatre Studies Institute of the University of Amsterdam
Kati Röttger and Erik Lint for the UvA & Tjebbe van Tijen/Imaginary Museum Projects

1) Since the Middle Ages onward systems have been developed to gather knowledge in the form of classified quotations:
topoi, loci, loci comunis, handwritten books with collections of commonplaces: common place books.
We are proposing a revival of the principles of such personal and sharing knowledge systems adding to them the posibilities of interactive visualization offered by our electronic media, still finding our inspiration mainly in a reappraisal of past media.
2) The spoken word maried the written ~ over time written text took over completely ~ today media reunite speech and text
3) Information systems seem to have changed a lot but somehow hand gestures blackboard and note taking by hand remains
5) People often prefer hand note making as in this old 'commonplace book' ~ in comparison computers offer poor mnemonics
6) Obsolete paper information retrieval systems can be seen in a new light: recognizing their tactile and spatial qualities
7) Traditional scribal documents with their visual cross reference systems may show us new ways for our digital interfaces
8) After the scribal came the printing machines ~ in European culture this meant often a seperation of text and image ~ one example where instead a new method of integrating text and image was found was the 'tableau' system of Comenius
9) Orbis sensualium pictus ~ the world explained in pictures ~ uses a system based on the emblemeta culture of the 16th and 17th century with its three main elements: title/nomenclatura; pictura/picture; descriptio/description and their complex relations (these elements we find back in our time in methods for advertisment and the like)
10) Small numbers in the tableau-picture pointed to small numbers in the text ~ this was hypertext avant-la-lettre ~ the pages of the book were not primarely meant for linear reading but invited the eye to wander around from picture to text and vice versa ~ the tableau pictures seemed to depict 'the real world' but this collection of landscapes, still lifes and diagrams presented information at another more abstract level, still using 'verisimilitude' to engage the viewer ...
11) Here we can jump from interactive visualization on a double book-page to similar ideas centuries later in the computer age
Pioneer of 'hyper text' Ted Nelson conceptualized almost four decades ago this sytem of interactive transposing windows
12) Documents are intrinsically parallel ~ a document is an arbitrary collection of versions having the same name
13) Keep these ideas and images before your inner eye when looking at the following proposal and examples ...
ScrollScapes
a layered presentation, documentation and navigation system by Tjebbe van Tijen/Imaginary Museum Projects (2007-2009)
version2009/04/15
13.1) Horizontal scrolls for overview - Vertical scrolls for details: continuity of view 1 window with 3 basic layers
1 ScrollScapes consists of an 'inside' (1-5) and an 'outside' (6) world: five layers inside one window (1-5) and all external links open in a new window (6). Four of the five layera are scrolls with two distinctive functions: - presentation (1, 4); - documentation (3, 5). On the presentation level the user can slide through a horizontal or a vertical scroll and when the mouse over the user passes over a distinctive part a semi-transparent layer (2) will come up with a short textual and/or visual explanation. This 'overlay' can also have one or more 'buttons' that can be clicked to go one 'information level' deeper to the documentation layer, either horizontal or vertical (3,5). All scrolling layers can have any length. On opening ScrollScapes the window is automatically resized to 1000 x 725 pixels. An introductory screen may be shwon in which it is explained that the window will be set to the size of 1000 x 725 pixels and extra bars, like book marks can be switches off to give the maxi,um amount of space to the visual materials, as many people use web browsers on a screen of 1024 x 768 pixels with multiple navigation bars that take away many pixels on the smallest vertical side of the brwoser window. The exernal link windows could keep the default settings of each user...
13.2) Fixed window size with sliders: knowing where you came from and where you are heading to
2 Navigation through any of the horizontal or vertical layers is done by sliders that drag the layers through the (fixed size) window on the computer screen. The 'sliders' moving on their 'rails' are indicating the relative position within a scroll. Specific overlays come up when the mouse os moved over (roll-over). At any time at the most two layer elements are visible: - horizontal presentation (purple) + horizontal documentation (blue); or vertical presentation (green) + vertical documentation (blue); - horizontal or vertical presentation (purple or green) + mouse-over overlay (yellow). The sliders are not the standard sliders, but generated by the special script that controls the appearance of ScrollScapes.
13.3) Mouse-over clicks can trigger jumps from a position in a horizontal scroll to a position in a vertical scroll
13.4) Overview of information objects like a 'tableau de troupe' of a balet on stage - mouse-over gives focus
14) Example of a vertical presentation scroll with information objects (can bebooks, paintings, or any other object) when the mouse goes over a specific object an half transparent overlay pops up (yellow) which gives a short explanation in text and/or image and also some options for more detailed information. When one of the three further information (yellow) buttons is clicked either a horizontal or a vertical layer appears (purple or blue) ...
14.1) example of Tableau de Troupe system of information objects (books) ordered by publishing year (De Verbeelding)
14.2) example Ouverture page with several opened books ordered by author name
14.3) Documentation layer (vertical scroll) over layer with information objects - with new windows for external links
9 Another example where a documentation layer in the form of a vertical screen appears over a vertical presentation scroll. This documentation layer is in a format with the following functions: 1) book cover; 2) bibliographical information; 3) links to libraries that have a copy of a book or other information object; 4) quotations that are summarized in short headings (monades that represent the core element of a longer quotation); 4) a link to a horizontal documentary layer with visual quotations from a publication. All the monades (quotation headers) are in a list at the top of this bibliographic format. The user can click a specific line and jump down to a specific quotation further down, and vice versa jump up again to the list of monades.
15) web site Orbis Pictus ~ Theatrum Mundi conference with first example of ConTopics (deep documentation references)

15.1) Each source has a link to the wordlcat.org mega library catalogue: the best bibnliographic source in the world
Cite this item gives standarize formats for making references, this can be scripted into our Contopics system

15.2) We propose extensive quotations and ask also to give a header to each quotation expressing the core idea (from the perspective of the person who has selected a quotation); these headers we call 'monade' (after Leibniz) the part or partys of the quotation from which such a 'monade' has been taken will be marked in red. A clickable icon will put the full quotation and its sources +_ the conetxt from which it has been taken into the clipboard of the end-user's computer.
15.3) The quotations show up as a single line (the monade), when clicked they open up like a harmonica; there can be several quotations with one source.
16 examples of possible papers/abstracts interface with visual representations used on a standard flashcard (can also be send around like a post card)
16.1) barcodes could be use for interaction but also dotmatrix codes (these codes can be recognized by certain mobile telephones) these codes are very popular in Japan and are used mainly for commercial interest, we propose a cultural usage
16.2) laptops in a local or open network during a conference can access templates for the participants to construct their visualization by using image content from the internet
16.3) examples of templates for visualising, these can be java or javascript based online routines
16.4) public sharing of image forums like Flickr can be a good source for making visualization; here is shown a web site Flickrleech that had a very good concept of 'interactive vsiualization' using the API of Flickr; sadly this service has disappeared but similar ones will come up...
17) the principle of horizontal scrolls can be combined with making one or more documentation overlays; here a proposed system skecth (a working version of such a system exists as a museum installation by Tjebbe van Tijen: "ideas fo Visual Language", too larhe to be projected with a standard 1024 x 768 beamer.
 
17.1) Example of a horizontal presentation layer with a browsable vertical documentation layer (Bibliomania) ....
 
18) Designs fort a virtual bookshelve by Tjebbe van Tijen/Imaginary Museum projects book cover pictures a deformed acoording to their relative size and the number of pages, giving the impression of a book backs/spines on a shelve
18.1) mouse-over will trigger a overlay of the full book cover + bibliographical notes; the cover can be clicked to go to further details (quotations or other) on/from the book
18.2)
18.3)
19) Horizontal scroll mentioned before "ideas of Visual Language" whcih can be clicked everywhere and produces documented overlays
19.1) Skecth for the principle of having related books on a virtual bookshelve appearing over a visualized argument