Computer Supported Collaborative Work - 

People  working/playing/interacting together through the use of computers

Focused partnership

Lecture/Demo

Conference

E- Commerce

Online Community / Game

Collaboratory (Lab)

Telepresence

Who are the participatnts?

What can participants do?

Where do participants interact?

When do participants interact?

How do participant interact?

How are participants represented?

Computer Mediated Communication

- Speech, Typing

Movement in 3D Space

Coordination

Awareness

Privacy

Appeareance and Perception

Action

History

Communicativek Signals, Pauses, Assertiveness

Context: Real, Virtual

Visibility

Communities of Interest:

Communities that focus on shared interests,.

Communities of Practice:

Communities whose focus is professional.

Chat, Instant Messaging, and Texting

Audio and Video Conferencing

Same Time, Same Space:

What is EMS?

More information - a group as a whole has more info than any one member.

Synergy - a member uses info in a way that the original holder did not because that member has different info/skills

More objective evaluation - Groups are better at catching errors than individuals who proposed ideas.

Stimulation - Working as part of a group may stimulate/encourage performance

Learning - Members may learn from/imitate more skilled members to improve

Air Time Fragmentation - Time broken up among participants.

Attentuation Blocking - Members kept from contributing when comment is fresh, forget/suppress later

Concentration Blocking - Members concentrate on remembering comments until they can contribute

Attention blocking - new comments not generated because listening to others

Failure to Remember, Conformance Pressure, Evaluation Apprehension, Free Riding, Cognitive Inertia, Socializing, Domination, Information Overload, Coordination Problems, Incomplete use of Information Incomplete Task Analysis.

Grip - Stylus vs Mouse

Time to Pick up

Active vs Passive Stylus

Mouse Tracking Technology

A mouse-like pointing device that works in mid-air.

Optical Mouse Internals repackaged in lozenge-shaped plastic "core" and surrounded by cloth "hull"

Manipulated like "Joystick", "Belt", "Soap"

A predictive model of time MT to move a distance A to target of width W.

MT increases with increasing A, decreasing with increasing W

Farther/Smaller Target Takes Longer Time to Reach

Closer/Bigger Target Takes Shorter Time to Reach

MT = DeviceDependentConstant1 + DeviceDependentConstant2*Index of Difficulty

ID is a function of A and W.

MT = C1 + ID / IP

MT = C1 + C2 log2(A/W + 1)

1 / C2

Measure in bits per second

How quickly can the user steer through a 2D tunnel (free-hand tracing, sketching, constrained motion)?

Cursor must remain in the tunnel.

MT = a + b (A / W)

A is path length

W is path width

a and b are constants

Scientific Visualization,

Information Visualization,

Visual Analytics

The use of 3D Graphics to visualize data from fields other than science to exploit the human perceptual.

Present data that is not inherently spatial.

Not just visual but audio, haptic, ..

Analytical reasoning techniques - enabling users to obtain deep insights that directly support assessment, planning, and decision making.

Visual representations and interaction techniques - that take advantage of the human eye's broad bandwidth pathway into the mind to allow users to see, explore, and understand large amounts of information at once.

Data Representations and Transformations - that convert all types of conflicting and dynamic data in ways that support visualization and analysis.

Techniques to support Production, presentation and dissemination of the results of an analysis to communicate information in the appropriate context to a variety of audiences.

Text:

Documents, Source Code, Lists

In designing the advanced interface, a five-stage framework may help to coordinate design practices and satisfy the needs of first-time, intermittent, and frequent users.

What are the five stages of action?

1. Formulation - expressing the search

2. Initiation of action - launching the search

3. Review of Results - reading messages and outcomes

4. Refinement - formulating the next step

5. Use - compiling or disseminating insight

The specification of field's values can sometimes be simplified by using specialized visual representations of possible values.

For example selecting dates on calendars or using an airplane layout to selet among available seats is useful.

Filtering with Booleans

Automatic Filtering

Dynamic Queries

Faceted Metadata Search

Query by Example

Implicit Search

Collaborative Filtering

Multilingual Searches

Visual Field Specification

1D Linear

2D Map

3D World

Multidimensional

Temporal

Tree

Network

Overview

Zoom

Filter

Details-on-Demand

Relate

History

Extract

Means changing representation when zooming.

Not just geometric magnification

Photoshop History

Automated Generated Tutorials

Degree of Interest

DOI = API - D

Unimanual - using a mous

Bimanual - symmetric, in phase eg jumping rope

symmetric, out phase. eg: rope climbing

Bimanual - Asymmetric, eg: playing a stringed instrument

Prefered to Non-Prefered Spatial Reference

Non-Preferred -- Preferred contrast in spatiotemporal scale of motion

Non-Preferred Takes Precedence over Preferred in Action

P hand finds spatial reference in the motion of the N hand

Example:

Right hand writing on paper stabilized by Left Hand

N: Lower spatial and temporal frequencies

P: Higher spatial and temporal frequencies

N moves earlier than P

- Defines spatial reference frame first

- Performs macro before micro actions

-Positions in place object being manipulated

Local Telescpe is portal to remote Target.

User can change position or size of telescope or target

Pan telescope and target together

Move objects between local and remote displays using transfer channels.

User starts to drag object

System creates proxies for potential targets in desired directions.

Connected by Rubber Band

Faster than drag and drop when more than 1 bezels crossed on multi-monitor wall

Warped targets are bunched up

Instant warp can be confusing

User starts to drag object

System creates stable grid of potential proxy targets in all directions

User selects desired proxy

Faster than drag and pop in some multi-bezel configurations

Line up arcs over seams

Don't split nodes across seams

To indicate off-screen objects, surround object with circular "halo" arc just big enough to be visible

Halo location & curvature make it easy for user to infer object position

Later work replaces the arc with a wedge whose off-screen tip is at the object.

Wedges can be automatically rotated to avoid overlap, unlike arcs

Helps disambiguate close objects

Fitt's Law,

Metropolis based on digram pair using random walk simulated annealing.

Each character has a unique zone around a circle's perimeter

Strokes start in first character's zone

Fluid stroke defined by entering and exiting the zone of each letter.

Strokes start at the screen center

Zones are clustered around screen edge

Strokes defined by:

first zone entered after leaving center

laster zone left before reentering cneter

Faster than graffiti

Use of nine compass directions eliminates need to look at screen for trained users.

aka Swype

Shorthand-Aided Rapid Keyboarding

Stroke between keys approximating words in dictionary

Recognition software resolves ambiguity, including missed keys

Finger release - lifting both fingers off the screen ends the word

Space-required key ends the word

User preferreed finger release

Both approaches theoretically more efficient than unimanual but users were faster with unimanual

Pen Input Strokes

Unistroke: One stroke per character

Enter characters by traversing edges and diagonals of a square hole in a plastic template

Only sequence of corners traversed matters

Square hole enforces (easy-to-make) cardinal-direction gestures.

Crossing based Interfaces replace pointing at a target with crossing a goal. They are especially good for selecting thin objects.

What is MT

MT = C1 + C2 * log2(A / W  +  1)

Prelude to Steering Law

Importing and Cleaning Data - Getting Data in the Correct Format

Combining Visual Representations with Textual Labels - Labels should be visible without overwhelming the display or confusing users.

Finding Related Information - Integration of Data from Multiple Sources

Viewing Large Volumes of Data - Dealing with large numbers of items, difficult maintaining real-time interactivity. 

Itegrating Data Mining -  Visual Systems used to lead towards Hypotheses and Insight

Integrating with Analytical Reasoning Techniques - Use of data to support or disclaim competing hypotheses.

Collaborating with Others - social interaction with visualizations

Achieving Universal Usability - Making visualization tools available to diverse users regardless of technical disadvantages or disabilities.

Evaluation - How to process the data once visualized. How is the data evaluated based on its visualization

Customizatoin of application performance by end users: regular (typically "non-programmer") users

Emphasis on application behavior that is conventionally accomplished by progrogramming new or modified "commands"

Preferences

Scripting Languages

Macro Readers

Programming by Demonstration

User chooses among alternative behaviors

Choices are limited and predefined

Often used for defining layout

(e.g., windows in an IDE)

Describe End User Programming Approaches -

Scripting Languages

User writes code in special-purpose language customized for the application (e.g. shell script, elisp)

User needs to program.

Describe End User Programming Approaches -

Macro Recorders

User turns on macro recording, interacts with the application, and stops recording

System records interactions and makes it possible to re-execute them (e.g., GNU Emacs macros, Microsoft Visual Basic macros)

Too Literal: Use exact positions, keystrokes

Generalizing or fixing macros requires "real" programming

Programming by Example (AKA Example-based Programming)

-User provides one or more concrete examples of the behavior or effect of a more general program.

- System infers intent

Programming by Demonstration

(AKA Demonstrational Programming)

PBE in which the user demonstrates actions on example data

Programming in the User Interface

PBD, emphasizing the use of existing UI commands

Introduced Icons!

First PBD system

Designed to work as "Blackboard"

Programmer Demonstrates Algorithm with an Example

No Inferencing

Many Relationships not Visible

Reimplementation of Xerox Star Subset to Support PBD of desktop operations

Approach:

User performs a specific set of tasks.

System records tasks to create a program (at this point, a macro)

System determines data description of any object selected by user (picks one arbitrarily if ambiguous), reuses it throughout program (i.e., no inferencing)

User can view data description of any object with "properties"

User must edit program to:

Modify data descriptions

Create Flow of Control

Programming by example for real-time interface design obviating typing

Creates new GUI widgets - User defined look and feel

One of earliest uses of inferencing for PBD

Inferencing for Graphical Constraints (User gives one example)

Iteration (User gives two examples

Example-based Graphical Editing

Editable Graphical Histories

-Comic-strip/storyboard metaphor

Inspect to review

Revert to Undo

Edit to Change/Redo

Select, Parameterize, Generalize to Create "Macros by Example"

Graphical History can be used to select past actions