Toolglasses and Magic Lenses. 2 Reading: Eric A. Bier, Maureen C. Stone, Ken Pier, William Buxton and Tony D. DeRose, “Toolglass and magic lenses: the.

Slides:



Advertisements
Similar presentations
JustinMind: Dynamic Panels
Advertisements

DT Coursework By D. Henwood.
ORGANIZING THE CONTENT Physical Structure
Programming Paradigms and languages
Yingcai Xiao Chapter 4 The Visualization Pipeline.
Magic Lenses for Interactive Database Visualization Ken Fishkin SoftBook Press, Inc.
Dynamic Queries for Visual Information Seeking Ben Shneiderman Jin Tong Hyunmo Kang Cmsc838 Sep. 28, 1999.
Going Beyond Conventional GUIs. 2 Changing the assumptions n What happens when we step outside the conventional GUI / desktop / widgets framework? – Topic.
Computer Science 1000 LOGO I. LOGO a computer programming language, typically used for education an old language (1967) the basics are simple: move a.
SIMS 213: User Interface Design & Development Marti Hearst Thurs, March 6, 2003.
1 COMP 206: Computer Architecture and Implementation Montek Singh Mon., Sep 5, 2005 Lecture 2.
1 Model View Controller. 2 Outline Review Definitions of MVC Why do we need it? Administiriva Changing the display Event flow Dragging at interactive.
SIMS 213: User Interface Design & Development Marti Hearst Tues, March 5, 2002.
Magic Lenses for Interactive Database Visualization Ken Fishkin SoftBook Press, Inc.
SIMS 213: User Interface Design & Development Marti Hearst Tues, Feb
SIMS 213: User Interface Design & Development Marti Hearst Thurs Feb 22, 2001.
Systems Analysis I Data Flow Diagrams
Unified Modeling Language
The Unified Modeling Language (UML) Class Diagrams.
Interaction Jing Li CPSC 533C March 3, Overview Toolglass and Magic Lenses: The See- Through Interface (1993) by Eric A. Bier, Maureen C. Stone,
Lecture Set 3 Introduction to Visual Basic Concepts Part A – User Interfaces and Windows Forms – The Toolbox.
Tutorial for Arrays and Lists By Ruthie Tucker. Description This presentation will cover the basics of using Arrays and Lists in an Alice world This presentation.
Welcome to CIS 083 ! Events CIS 068.
User Interface Elements of User Interface Group View.
Computing & Information Sciences Kansas State University Lecture 20 of 42CIS 636/736: (Introduction to) Computer Graphics Lecture 21 of 42 William H. Hsu.
PowerPoint Basics Tutorial 3: Graphics In this tutorial we’ll be looking at graphics, and the various types of illustrations that can be included in a.
© 2008 The McGraw-Hill Companies, Inc. All rights reserved. M I C R O S O F T ® Refining Original Illustrations Lesson 9.
Problem of the Day  Why are manhole covers round?
CS 275Tidwell Course NotesPage 16 Chapter 2: Organizing The Content There are two primary ways to organize the planned content of your software application’s.
Summer Student Program 15 August 2007 Cluster visualization using parallel coordinates representation Bastien Dalla Piazza Supervisor: Olivier Couet.
PowerPoint Basics Tutorial 3: Graphics In this tutorial we’ll be looking at graphics, and the various types of illustrations that can be included in a.
Graphics Concepts CS 2302, Fall /17/20142 Drawing in Android.
Balancing the scales: Inequalities By Melissa Dalis Professor Susan Rodger Duke University June 2011.
Summer Computing Workshop. Session 3 Conditional Branching  Conditional branching is used to alter the normal flow of execution depending on the value.
File Systems cs550 Operating Systems David Monismith.
Tutorial for Arrays and Lists. Description This presentation will cover the basics of using Arrays and Lists in an Alice world It uses a set of chickens.
1 Lecture 5: Interactive Tools: Prototypers (HyperCard, Director, Visual Basic), Interface Builders Brad Myers Advanced User Interface Software.
Introduction to OOP CPS235: Introduction.
Class Diagrams. Terms and Concepts A class diagram is a diagram that shows a set of classes, interfaces, and collaborations and their relationships.
Chapter – 8 Software Tools.
Basic Organization of UI Software. 2 The User Interface n Typically want to think of “UI” as only one component of an overall system – The part that “deals.
Introduction to System Analysis and Design MADE BY: SIR NASEEM AHMED KHAN DOW VOCATIONAL & TECHNICAL TRAINING CENTRE.
12-Jun-16 Event loops. 2 Programming in prehistoric times Earliest programs were all “batch” processing There was no interaction with the user Input Output.
 Problem Analysis  Coding  Debugging  Testing.
Lesson 8 – Communication and Interaction Objectives I n this lesson we will: ● learn how and why to use the Discussion or Talk pages, ● discuss the my.
Functions / Blocks.
Development Environment
CUS POWERPOINT PRESENTATION
Visit for more Learning Resources
Event loops 16-Jun-18.
Models of Interaction What are They?
Prototyping.
Introduction to Events
Chapter 16 – Programming your App’s Memory
Learning Java with Alice 3.0 Game Design Kathy Bierscheid
Better Design Understand how to incorporate key design concepts to the entire site Guidelines for site design Use color, balance, alignment, and other.
Event loops.
Lesson 5: Building an App: Clicker Game
GRAPHICAL USER INTERFACE
(c) 2002 University of Wisconsin, CS 559
Dynamic Queries for Visual Information Seeking Ben Shneiderman
Event loops 17-Jan-19.
Event loops 17-Jan-19.
Event loops 8-Apr-19.
Tutorial for Arrays and Lists
Event loops.
Event loops.
Event loops 19-Aug-19.
Brown Bag Seminar Summer 2007
Presentation transcript:

Toolglasses and Magic Lenses

2 Reading: Eric A. Bier, Maureen C. Stone, Ken Pier, William Buxton and Tony D. DeRose, “Toolglass and magic lenses: the see- through interface”, Proceedings of the 20th Annual Conference on Computer Graphics, 1993, Pages

3 Note... n These techniques are patented by Xerox n Don’t know scope of patent, but its likely you would need to license to use them commercially

4 Demonstration Video (CHI 94)...

5 Toolglasses and magic lenses n I will just lump these together as “lenses” n Lots of uses n A number of advantages

6 Advantages of lenses n In context interaction – Little or no shift in focus of attention F tool is at/near action point – Alternate views in context and on demand F can compare in context F useful for “detail + context” visualization techniques

7 Detail + context visualization n Broad category of information visualization techniques – Present more detail in area of interest F More than you could typically afford to show everywhere F Details may be very targetted – Present in context of larger visualization

8 Advantages of lenses n Two handed interaction – Structured well for 2 handed input F non-dominant hand does course positioning (of the lens) examples also use scroll wheel with non-dominant hand –scaling: again a course task F dominant hand does fine work

9 Advantages of lenses n Spatial modes – Alternative to more traditional modes – Use “where you click through” to establish meaning – Typically has a clear affordance for the meaning F lens provides a “place to put” this affordance (and other things)

10 Examples n Lots of possible uses, quite a few given in paper and video n Property palettes – Click through interaction – Again: no context shift + spatial mode

11 Examples n Clipboards – Visible F invisibility of typical clipboard is a problem – Lots of interesting variations F multiple clipboards F “rubbings” – Can do variations, because we have a place to represent them & can do multiple specialized lenses

12 Examples n Previewing lenses – Very useful for what-if – Can place controls for parameters on lens n Selection tools – Can filter out details and/or modify picture to make selection a lot easier

13 Examples n Grids – Note that grids are aligned with respect to the object space not the lens

14 Implementation of lenses n Done in a shared memory system – All “applications” are in one address space – Like one giant interactor tree – Also assumes a common command language that all applications respond to

15 Implementation of lenses n Lens is an additional object “over the top” – Drawn last – Can leave output from below and add to it (draw over top) – Can completely overwrite output from below F can do things like “draw behind” Root Lens App

16 Implementation of lenses n Input side – Changed way they did input F originally used simple top-down dispatch mechanisms F now lens gets events first can modify (e.g., x,y) or consume F possibly modified events then go back to root for “normal dispatch

17 Implementation of lenses n Input side – Special mechanism to avoid sending events back to lens – Also has mechanism for attaching “commands” to events assumes unified command lang F command executed when event delivered

18 Implementation of lenses n Output side n Damage management – Lenses need to be notified of all damage F Lens may need to modify area due to manipulation of output (e.g. mag)

19 Implementation of lenses n Output side n Redraw – Several different types of lenses F Ambush F Model-in / model-out F Reparameterize and clip

20 Types of lens drawing n Ambush – catch the low level drawing calls F typically a wrapper around the equivalent of the drawable – and modify them F e.g. turn all colors to “red” – Works transparently across all apps – But somewhat limited

21 Types of lens drawing n Reparameterize & clip – similar to ambush – modify global parameters to drawing – redraw, but clipped to lens – best example: scaling

22 Types of lens drawing n Model-in / model-out – create new objects and transform them F transforms of transforms for composition – very powerful, but… F cross application is an issue F incremental update is as issue

23 Lenses in subArctic n Implemented with special “lens parent” & lens interactors n Input – Don’t need to modify input dispatch – Lens may need to change results of picking (only positional is affected) F in collusion with lens parent Lens Parent Lens Root

24 Lenses in subArctic n Damage management – Lens parent forwards all damage to all lenses – Lenses typically change any damage that overlaps them into damage of whole lens area

25 Lenses in subArctic n Replace vs. draw-over just a matter of clearing before drawing lens or not n Two kinds of output support – Ambush F Via wrappers on drawable F Extra features in drawable make ambush more powerful – Traversal based (similar to MIMO)

26 Ambush features in drawable n boolean start_interactor_draw() n end_interactor_draw() – called at start/end of interactor draw – allows tracking of what is being drawn – drawing skipped if returns false n allows MIMO effects in ambush – isolated drawing – predicate selected drawing

27 Lenses in subArctic n Also support for doing specialized traversal – walk down tree and produce specialized output – can do typical MIMO effects

28 Example: Debugging Lens

29