department of information science and telecommunications interactive systems michael b. spring...

23
partment of Information Science and Telecommunications Interactive Systems Interactive Systems Michael B. Spring Department of Information Science and Telecommunications University of Pittsburgh Pittsburgh, Pa 15260 Email: [email protected] Web: http://www.sis.pitt.edu/~spring Voice: (412) 624-9429 Fax: (412) 624-2788

Post on 19-Dec-2015

214 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

Interactive SystemsInteractive Systems

Michael B. SpringDepartment of Information Science and Telecommunications

University of PittsburghPittsburgh, Pa 15260

Email: [email protected] Web: http://www.sis.pitt.edu/~springVoice: (412) 624-9429 Fax: (412) 624-2788

Page 2: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

OverviewOverview

The value of history The evolution of interactive systems Direct manipulation The Xerox STAR WIMPS programming model

Components and Containers Scrollbars Cursors

The future of interfaces A Challenge

New metaphor New scroll tool

Page 3: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

The Value of HistoryThe Value of History

1950 20502000

1970 Unix 1980

STAR

Community of 3000

14000 NOK

Human1993 Window

s

2000 Good Windows

1995 Mosaic

1981 IBM PC

Page 4: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

The Evolution of Interactive SystemsThe Evolution of Interactive Systems

Command based systems Unix as an example Command line control Effort to develop lexical and syntactic

consistency Basic model is action-object

GUI, WIMP, Direct Manipulation systems Windows, Word as examples Situated controls Complex but simplified interactions Basic Model is object-action

Agents, Virtual Reality, Distributed systems

Page 5: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

The Direct Manipulation ApproachThe Direct Manipulation Approach

Model the process or system User versus designer models Procedural versus structural models

Use metaphors that maximize transfer Desktop metaphor Other metaphors…

Object-action model Drag and drop Universal commands Properties

Knowledge in the world Affordances Mapping

Page 6: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

1972 – The Xerox Alto1972 – The Xerox Alto

Networked Personal

Workstation

Bit Mapped Display

Floppy Disk Drive

Floppy Disk

Mouse

Page 7: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

Star Icon DevelopmentStar Icon Development

Page 8: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

Star Icon DevelopmentStar Icon Development

Page 9: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

1981 – The Xerox Star1981 – The Xerox Star

Page 10: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

Star Screen DetailStar Screen Detail

Page 11: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

Star KeyboardStar Keyboard

Page 12: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

Star Keyboard DetailStar Keyboard Detail

Page 13: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

WIMPS – A Programming ModelWIMPS – A Programming Model

WIMP interfaces are developed within a “sandbox”

The sandbox is an event collector and dispatcher Objects within the sandbox are event generators

Objects exist as a hierarchy of objects Some objects are containers Some objects are components

Objects are capable of generating multiple types of events

Mouse action events Exposure events Mouse motion events Change events Action events

Code fragments may be written to handle events Event handlers register an interest in objects

and event classes

Page 14: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

Common Elements of A User Interface Common Elements of A User Interface TookitTookit

Command Tools Menus Dialog boxes

Selection Tools Command buttons Radio buttons Check boxes Text fields Palettes and choosers

Navigation Tools Scroll bars Hands Murals/Maps

Status Tools Status bars Cursors

Page 15: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

A closer look at ScrollbarsA closer look at Scrollbars

components bar thumb controls

operation bar position relative to thumb controls thumb click versus drag

Page 16: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

How does a scroll bar work?How does a scroll bar work?

Move the paper or the window

Variable or fixed size

How much does it move?What happens if held?

What happens with click?What happens if held

What does sprite show?

Page 17: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

A Digression on the CursorA Digression on the Cursor

How many cursor shapes are there and what do they mean?

Page 18: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

CursorsCursors

Page 19: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

More CursorsMore Cursors

Page 20: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

And More CursorsAnd More Cursors

Page 21: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

And More CursorsAnd More Cursors

Page 22: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

The FutureThe Future

The future of interfaces is no interface Consider the interface to your car Consider the interface to an automatic door

Ubiquitous computing Intelligent devices Sensors and actuators Ubiquitous connectivity

Agents What is an agent in the real world

Doctors Gardeners Travel

Design of an agent “intelligence” “memory” “personality”

Page 23: Department of Information Science and Telecommunications Interactive Systems Michael B. Spring Department of Information Science and Telecommunications

Department of Information Science and Telecommunications

Two challengesTwo challenges

Define a new metaphor for an OS

Define a new tool for “scrolling”