Longing the boundaryborder | enclosure | interface | vehicle Border Spatial Colonization Contours, boundaries, and geographies are called upon to stand in for the contested realms of identity, from the national to ethnic. Its contours and voids are occupied by bodies that replicate internally the external conditions of political and social struggles as well as private and public Man-made Political Borders | Ingo Gunter 1997 interventions.
Longing the boundaryborder | enclosure | interface | vehicle Enclosure Territorial Mapping All intellectual and experimental reversals involving in both the construction and de- construction, as well as the inevitable ambiguities between the reality and its imagination. Perhaps space has always been deconstructed to generate a massive work ofA Room in the Room | Jay Lee 1999 reconstruction.
Longing the boundaryborder | enclosure | interface | vehicle Interface Constant Interaction In between the spaces and enclosures, there are always transition that is made between two elements which form common boundary between two parts of matter or space. We live on the boundary between physical space and cyberspace. However, these interfaces are confined to GUI boxes that are separated from physical spaceTangible Bits | Hiroshi Ishii & TMG 1998 and impoverish human senses.
Longing the boundaryborder | enclosure | interface | vehicle Media Room hybrid media space By sitting on a chair facing a large projection wall, embedded sensors all over the room are used for accessing electronic content. In this hybrid architectural space, a room serves as a computer terminal in which bits meet atoms and the electronicNicholas Negroponte and AMG 1980 information overlaps with everyday physical world and human life.
Designing the boundaryIntellectual Exploration 1935 Mathematical Computing 1972 Personal Computing 1945 Electronic Computing Hybrid Media Space Nature of Computer 1981 Direct Manipulation 1953 Graphical Communication 1983 Graphical User Interface 1960 Synergetic Coupling 1991 Ubiquitous Computing 1963 Literary Machine 1993 Augmented Reality Computer Aided Design Graspable User Interface Computer Networking 1995 Tangible User Interface 1968 Interactive Hypermedia 1999 Pervasive Computing 1970 Head-Mounted Display 2006 Cloud Computing
Designing the boundaryIntellectual Exploration Differential Analyzer mathematical computing An analog computer using mechanical integrators, gears for constant multiplication, (+/-), was primarily used for evaluating and solving differential equations by mechanical integration. A series of rotating shafts and wheels, powered by electric motors, ran problems through ten integration units to produce a solution. [Vannevar Bush and MIT ’35] Photos courtesy MIT Museum
Designing the boundaryIntellectual Exploration ENIAC electronic computing Consisted of 1500 relays and hundreds of thousands of resistors, capacitors, and inductors. All of this electronics were held in 42 panels: 9 feet tall, 2 feet wide, and one foot thick. Applications: atomic energy problems, computing ballistic trajectories, weather prediction, astronomical cosmic ray studies. [Eckert and Mauchly ‘45]
Designing the boundaryIntellectual Exploration MEMEX nature of computer Computer as a fundamental tool for transforming human thought and creative activity. As we may think, the form of a desk, a device for individual, is a sort of mechanized private file and library: Information Storage, Retrieval, and Multimedia. [Vannevar Bush ’45]
Designing the boundaryIntellectual Exploration Whirlwind | SAGE graphical communication An air-defense command and control system which allows human to manipulate pictures as well as numbers and texts on display. - Internal hierarchic structure of iconic representations pictures - Master picture and its instances (object oriented programming) - Operations: copy, move, delete [MIT Lincoln Lab ’53]
Designing the boundaryIntellectual Exploration Man-Machine Symbiosis synergetic coupling Computer as a intellectual partner or a facilitator of aspects of human creativity and problem solving. Human brains and computing machines will be coupled together very tightly, and that the resulting partnership will think as no human brain has ever thought. [J.C.R. Licklider ’60]
Designing the boundaryIntellectual Exploration SketchPad computer-aided design The display, a lightpen, and a bank of switches were the interface as the first interactive computer graphics. Highly precise drawings could be created, manipulated, duplicated, and stored. The software provided a scale of 2000:1, offering many acres of drawing space. [Ivan Surtherland ’63]
Designing the boundaryIntellectual Exploration Hypertext literary machines Computer as the tool that makes explicit the interdependence of ideas, drawing out connections between literature, art, music and science. Human brains and computing machines will be coupled together very tightly, and that the resulting partnership will think as no human brain has ever thought. [Ted Nelson ’63]
Designing the boundaryIntellectual Exploration ARPANET networking: resource sharing Virtually all the world is linked by packet switched communications service which become the revolution of Human Communication: ARPANET>TELNET > USENET > INTERNET [Lawrence Robert ’66]
Designing the boundaryIntellectual Exploration Ultimate Display head-mounted display (HMD) A helmet shaped apparatus designed to immerse the viewer in a visually simulated 3D toward marrying the computer to the design, construction, navigation and habitation of virtual worlds. This ineffable potential of computers to transform the abstract nature of mathematical constructions into habitable, expressive worlds. [Ivan Sutherland ’66]
Designing the boundaryIntellectual Exploration oNLine System (NLS) interactive hypermedia Augmenting the human intellect will exhibit more of what can be called intelligence by organizing his intellectual capabilities into higher levels of synergistic structuring and physical interface A collaborative method of sharing knowledge through interactive linking is now modern on-line system. [Douglas Elgelbart ’68]
Designing the boundaryIntellectual Exploration Dynabook personal computing User interface design first happened when we better understand how our minds worked would completely shift the paradigm of interaction. As a dynamic medium for creative thought through synthesizing static media with the intimacy and responsiveness of the personal computer. [Xerox Parc and Alan Kay ’72]
Designing the boundaryIntellectual Exploration Media Room hybrid media space By sitting on a chair facing a large projection wall, embedded sensors all over the room are used for accessing electronic content. In this hybrid architectural space, a room serves as a computer terminal in which bits meet atoms and the electronic information overlaps with everyday physical world and human life. [Nicholas Negraponte + AMG ’80]
Designing the boundaryIntellectual Exploration Star direct manipulation (WYSWYG) 8010 Star Information System: Pioneering for User Interface Networking: file/print server Knowledge Workers [Xerox Parc ’81]
Designing the boundaryIntellectual Exploration Apples graphical user interface (GUI) Lisa [Apple ’83] Together with the use of icons and windows in the desktop metaphor. Macintoshi 128K [Apple ’84] 8Mhz CPU, 128K Ram, Graphical User Interface and Desktop Publishing a computer intended to be literally revolutionary.
Designing the boundaryIntellectual Exploration Ubiquitous Computing transparent interface The most profound technologies are those that disappear. They weave themselves into the fabric of everyday life until they are indistinguishable from it. Computational services are delivered through a variety of computational devices such as Tabs, Pads, and Boards, with the infrastructure to allow these devices to talk with each other. [Mark Weiser ‘91]
Designing the boundaryIntellectual Exploration Wearable Computing augmented reality With heads-up displays, unobtrusive input devices, etc. , the wearable computer can act as an intelligent assistant. Through the consistency and mediation, user can interact with digital information based in the context of the situation. [Steve Mann ’81 MIT, VuMan: CMU ’91, Thad Starner: MIT ‘92]
Designing the boundaryIntellectual Exploration KARMA computer-augmented env.(CAE) One of the most powerful uses of virtual worlds will not be to replace the real world, but rather to augment the users view of the real world with additional information. Graphics and text overlaid on the surrounding world could explain how to operate, maintain, or repair equipment. [Steven Feiner ‘93]
Designing the boundaryIntellectual Exploration digitalDESK augmented reality Exploratory Interfaces between atom, bits, and people; making physical forms to digital information and talking advantage of direct manipulation and physical affordances in Human-Computer Interaction. [Pierre Wellner ‘93]
Designing the boundaryIntellectual Exploration Chameleon graspable user interface As input devices that can be held in a hand and moved on a surface, bricks can control the computer directly manipulating the objects. -Direct control of virtual objects through physical handles - Blend physical / virtual afford. - Distribute cognitive load more evenly from visual to tactile system [Fitzmaurice, Ishii, Boxton ‘95]
Designing the boundaryIntellectual Exploration Tangible Bits tangible user interface (TUI) Physical Interfaces between atom, bits, and people; making physical forms to digital information and talking advantage of human senses and skills in everyday life. Physical Direct Manipulation (WYGIWIG) [Hiroshi Ishii and Tangible Media Group at the MIT Media Lab ‘97]
Designing the boundaryIntellectual Exploration Augmentation paradigm Hypertext | NLS | Ubicomp principle WYSIWYG | WYSIWIS | WYGIWIG idea hunch ”Demo or Die” hack prototype Paolo Alto (GUI) | Collab (CSCW) Mosaic: Univ. of Illinois product Lisa / Mac (GUI): Apple Navigator: Netscape market PC, Internet, Web [Bill Verpank ’98]
Designing the boundaryIntellectual Exploration Physical - Digital Mapping Characteristics Static Digital Media Physical States Idea Motivation Image, a/v files Digital States Error Observation Dynamic Digital Media Physical Live Video, Audio Representation Digital Information Metaphor Meaning Model Consistency Data Structure Scenario Inventing Task Engineering Combination of data, attributes, operations Physical Representation Digital Mediation Control Manipulation Digital Attribute Display Mapping Material Properties Physical Representation Information storage, retrieval, and manipulation | Information visualization | Remote Interaction Simulation Modeling and construction | Systems management, Digital Control configuration, and control | Education | Interaction in social spaces | People Places, Devices Remote communication and awareness | Augmentation Entertainment
Designing the boundary Beyond GUI: grasp and manipulate “bits”Intellectual Exploration in the center of users’ focus metaDESK inTouch CHI ‘97, UIST ‘97 CSCW ‘98 Touch PSyBench Counters CSCW ‘98 CHI ‘99 PingPongPlus Urp Illuminating Light Triangles mediaBlocks CHI ‘99, CHI ‘98, CHI ‘99 CHI ‘98 CHI ‘98 SIGGRAPH ‘98 SIGGRAPH ‘99 SIGGRAPH ‘98 musicBottles SIGGRAPH ‘99 curlybot CHI ‘00, HandSCAPE SIGGRAPH ‘99 CHI ‘00, SIGGRAPH ‘99
Beyond the boundaryInteractive System and Interface Design HandSCAPE Computer augmented digital measuring tape, Presented at Emerging Technology at SIGGRAPH 1999, LA Convention Center, Los Angeles and CHI 2000, The Hague, Netherlands HandSCAPE is a vectorizing digital tape measure as an input device for digitizing field measurements, and visualizing the volume of the resulting vectors with computer graphics. Using embedded orientation-sensing hardware, HandSCAPE captures relevant vectors on each linear measurements and transmits this data wirelessly to a remote computer in real- time. Combining physical measuring and computer modeling as a seamless step enhances the efficiency of on-site measuring tasks with the addition of digital functionality.
Designing the boundaryIntellectual Exploration Handheld Unit 9W x 4H x 2D (cm) Base Unit 8W x 8H x 1D (cm)
Designing the boundaryIntellectual Exploration Music Bottles Evocative Interface Seamless extension of physical affordances and aesthetical metaphors into the digital domain is a key principle for the design of this transparent interfaces. Upon opening the bottles, users can hear the sound of music, or narrative stories with computer control light projections. Electromagnetic tags enable each bottle to be wirelessly identified and sensed. The resonant frequencies of the various tags embedded in the bottles are detected and transmitted to the computer through the use of a custom designed tag reader board.
RF-ID Tag and Tag Readerboard
Designing the boundaryIntellectual Exploration Data LiFT Hybrid Navigation In between the two elevators, a intricately framed elevator is constructed in existing architecture. By displaying and manipulating the building data, viewers can seamlessly navigate the building virtually before physically walking around. [Jay Lee, Brygg Ullmer | Inter-design Workshop 1999]
Designing the boundaryIntellectual Exploration Suspended Windows Fictitious Space “Window-within-a-Window” provides an impetus in which a second window is built having the same scales and multi-window configuration. While viewers are in the space between two windows, the projected image is broken apart in squares in the corresponding area. [Jay Lee, Bill Keays | Interactive Expression at MIT Center for Advanced Visual Studies, ACM SIGGRAPH 2000]
Designing the boundaryIntellectual Exploration Extruded Windows Illusion Extended “Window-within-a-Window” provides an impetus in which a second window is built having the same scales and multi- window configuration. While viewers are in the space between two windows, the projected image is broken apart in squares in the corresponding area. [Jay Lee, Bill Keays | Interaction 2001, Fourth Biennale of The World Forum for Media and Culture, Ogaky City, Gifu Prefecture, Japan]