Interaction

Mater of Arts in Communication Design

WEB DESIGN
Interaction

Interaction

WEB DESIGN NABA 2014 Roberto DADDA

2

1960

Jan

Dec
1966

Nov
1973

Oct
1980

Sep
1987

Aug
1994

Jul
2001

Jun
2008

2015
Today

Teletype
Video terminal

PC
Tablet & Smartphone
Browser e cloud
Augmented reality

Interaction


3

Interaction


4

Interaction


5

Interaction


6

Interaction


7

Like in volley!

Interaction


8

Paradigms
• User’s has control
• Command languages
• Query languages
• Line editors
• Adventure game

• Computer has control
• Q&A
• Advisory system

• Conversations
• Eliza
Interaction


9

Command languages
$pwd
/usr/roberto
$ls
filea fileb filec
$rm filea
$
(Unix)

Interaction


10

Query languages
GIVE THE NAMES OF ALL EMPLOYEES WHO HAVE
JOBS WORKING AS A SECRETARY IN THE CITY OF
CHICAGO.
PRINT THE NAME OF ANY EMPLOYEE WITH
CITY=CHICAGO AND JOB=SECRETARY
THE NUMBER OF RECORDS TO RETRIEVE IS 30
SMITH
JONES
BROWN
...

Interaction


11

Adventure games
You are standing at the end of a road before a
small brick building. Around you is a forest.
A small stream flows down a gully.
ENTER BUILDING
You are inside a building, a well house for a
large spring. There are some keys on the
ground here. There is a shiny brass lamp
nearby. There is a bottle of water here.
GET WATER
Okay
GET KEYS
Okay
(Adventure, 1975)

Interaction


12

Expert systems
(1) Patient’s name: (first-last)
**FRED SMITH
(2) Sex:
**MALE
(3) Age:
**55
(4) Have you been able to obtain positive
cultures
from a site at which Fred
Smith has an infection?
**YES
(5) What is the infection?
**PRIMARY-BACTEREMIA
(6) Please give the date and approximate time
when signs of symptoms first appeared

(Mycin)
Interaction


13

Eliza (anni ’70)

Interaction


14

Interaction, a definition
Mutual and simultaneous
activity on the part of both
participants usually
working towards some goal
but not necessarily.

Andy Lippman, MIT

Stewart Brand, The Media Lab: Inventing the Future at M.I.T. (Penguin, 1988), p. 46

Interaction


15

Interaction


16

Lippman on Interactivity, corollaries
• Interruptibility
• Graceful degradation
• Limited look ahead
• No default
• Impression of infinite database

Interaction


17

Interruptibility
• Lippman contrasts the ability of any
participant to interrupt the others with
alternating (turn taking). He proposes a
model of interaction closer to a conversation
than a lecture. He refers to the granularity of
the interactive system to raise the question
of the human interval where participants
understand they are not being ignored (e.g.
word, sentence, paragraph). See phatic
function in Jakobson's model of
communication.
Interaction


18

Graceful degradation
• Something the system cannot
handle crops up. An example:
a system responds to a
question without an
immediate answer with a
promise to come back to the
point later. The interaction
continues; it does not
collapse. Lippman asks "in
what manner does it degrade,
productively or not?"
Interaction


19

Limited look ahead
• Everything is not precomputed. Related concept "on the fly."

Interaction


20

No default
• Lippman suggests avoiding default paths. He considers them boring.

Interaction


21

Impression of infinite database
• The distinction between "interactive and selective" gets looped back
into that of "granularity".

Interaction


22

Eliza
GOOD MORNING MY NAME IS GAINES AND I WISH TO
TALK TO YOU
I AM NOT INTERESTED IN NAMES
SORRY PERHAPS YOU COULD LET ME KNOW YOUR
INTERESTS
PLEASE DON’T APOLOGIZE
THANK YOU WHAT INTEREST YOU MOST?
WHY DO YOU ASK?
BECAUSE I HAVE TO DEMONSTRATE YOUR INEFFABLE
CAPABILITIES
IS THAT THE REAL REASON?
YES YOUR CAPABILITIES INTEREST ME
YOU SEEM QUITE POSITIVE
...

(Wizenbaum, 1966)

http://www-ai.ijs.si/eliza/eliza.html
Interaction


23

1960

Jan

Dec
1966

Nov
1973

Oct
1980

Sep
1987

Aug
1994

Jul
2001

Jun
2008

2015
Today

Teletype
Video terminal

PC
Tablet & Smartphone
Browser e cloud
Augmented reality

Interaction


24

Interaction


25

IBM 3270

Interaction


26

Keyboard

Interaction


27

IBM CUA Common User Access

Interaction


28

1960

Jan

Dec
1966

Nov
1973

Oct
1980

Sep
1987

Aug
1994

Jul
2001

Jun
2008

2015
Today

Teletype
Video terminal

PC
Tablet & Smartphone
Browser e cloud
Augmented reality

Interaction


29

Interaction


30

Olivetti Programma 101
1965!

Interaction


31

1960

Jan

Dec
1966

Nov
1973

Oct
1980

Sep
1987

Aug
1994

Jul
2001

Jun
2008

2015
Today

Teletype
Video terminal

PC
Tablet & Smartphone
Browser e cloud
Augmented reality

Interaction


32

Interaction


33

Interaction


34

Interaction


35

Interaction


36

IBM PC (1981)

•
•
•
•
•
Interaction

Low cost standard components
Low cost
MS DOS
Huge commercial success
Command line interface

37

Interaction


38

Interaction


39

Xerox
Star (1981)
Double page WYSIWYGET
Direct manipulation
Desktop metaphor

mouse

Interaction


41

WYSIWYG
Same image on
screen and
printed pages
For the first time!
• Square pixels
• Good video resolution (72 dpi)
• Even better printers
(300, 600, 1200 dpi)

Interaction


42

Interaction


43

Interaction


44

Interaction


45

Xerox star: the philosophy.
Familiar user’s conceptual model
Seeing and pointing versus remembering and typing
What you see is what you get
Universal commands
Consistency
Simplicity
Modeless interaction
User Tailorability
(Smith et al., Designing the Star User Intreface, 1982)

Interaction


46

• Pointing
• Selecting
• Dragging

Interaction


47

Mouse and Fitts law

d
t 1,03 0,96 * log 2(
s

0,5)

t Time in second to position mouse
D Distance from object in pixels
S Object dimension in pixels

Constants (1.03 and 0.96) are almost the same of manual movements.
The mouse is a optimal pointing device

Interaction


48

D. Enghelbart (1964)

(D.Engelbart)
Interaction


49

Interaction


50

Direct Manipulation
• Visibility of Object and Actions
• Rapid, reversible, incremental
actions
• Replacement of complex commandlanguage syntax with direct, visual
manipulation of the object of
interest.
Schneiderman (1983)

Interaction


51

Interaction


52

Desktop metaphor

Interaction


53

Interaction


54

Apple Macintosh (1984)

“The computer for the rest of us”
Interaction


55

Interaction


56

Interaction


57

Interaction


58

Windows (1985)

Interaction


59

1.0

Interaction


60

2.0

Interaction


61

3.1

Interaction


62

95

Interaction


63

7

Interaction


64

8

Interaction


65

1960

Jan

Dec
1966

Nov
1973

Oct
1980

Sep
1987

Aug
1994

Jul
2001

Jun
2008

2015
Today

Teletype
Video terminal

PC
Tablet & Smartphone
Browser e cloud
Augmented reality

Interaction


66

Interaction


67

August 6, 1991

Interaction


68

Interaction


69

Interaction


70

WEB: point and click
• Hypertext
• Active text, bottons, links
• Forms
• Multimedia

Interaction


71

Vannevar Bush (July 1945)

Interaction


72

Hypertext: link

Interaction


73

Interaction


74

Talmud

Interaction


75

Interaction


76

Interaction


77

Interaction


78

Interaction


79

Interaction


80

Interaction


81

Interaction


82

Interaction


83

Interaction


84

1960

Jan

Dec
1966

Nov
1973

Oct
1980

Sep
1987

Aug
1994

Jul
2001

Jun
2008

2015
Today

Teletype
Video terminal

PC
Tablet & Smartphone
Browser e cloud
Augmented reality

Interaction


85

Interaction


86

Interaction


87

Interaction


88

Interaction


89

Interaction


90

Interaction


91

Interaction


92

Roberto Dadda
www.dadda.it
roberto@dadda.it
+39 338 775 22 03
Twitter, facebook, linkedin: robertodadda

Interaction


93

Interaction

Recommended

Recommended

More Related Content

Similar to Interaction

Similar to Interaction (20)

More from Roberto Dadda

More from Roberto Dadda (20)

Recently uploaded

Recently uploaded (20)

Interaction