foundations of interaction design
Post on 08-Sep-2014
28 Views
Preview:
DESCRIPTION
TRANSCRIPT
FOUNDATIONS OF INTERACTION DESIGNSmart Experience
Foundations of Interaction DesignSeptember 2007
IN THE SAME WAY THAT INDUSTRIAL DESIGNERS HAVE SHAPED OUR EVERYDAY LIFE THROUGH OBJECTS THEY DESIGN FOR OUR OFFICES AND FOR OUR HOMES, INTERACTION DESIGN IS SHAPING OUR LIFE WITH INTERACTIVE TECHNOLOGIES — COMPUTERS, TELECOMMUNICATIONS, MOBILE PHONES, AND SO ON.
— GILLIAN CRAMPTON SMITHINTERACTION DESIGN INSTITUTE, IVREA
Foundations of Interaction DesignSeptember 2007
MACHINES SHAPE USWE SHAPE THE MACHINES
Interpretation
Execution Perception
THE MACHINE
Goals
Gulf of Execution Gulf of Evaluation
INPUTS DISPLAY
Intention
Action Specification
Evaluation
Cards / Switches
Foundations of Interaction DesignSeptember 2007
1945 1955 1965 1975 1985 1995 2005
Keyboard
Graphical User Interface
Hypertext Networks
Mobility
TIMELINE OF ADOPTION (AND ADAPTATION!)
Professional UsePersonal Use
Cards / Switches
Foundations of Interaction DesignSeptember 2007
1945 1955 1965 1975 1985 1995 2005
Cards / Switches
Keyboard
Graphical User Interface
Hypertext Networks
Mobility
TIMELINE OF ADOPTION (AND ADAPTATION!)
Professional UsePersonal Use
Foundations of Interaction DesignSeptember 2008
WORLD WAR II AVIATION PSYCHOLOGY (1940s)
Foundations of Interaction DesignSeptember 2008
ENIAC (1943)
Foundations of Interaction DesignSeptember 2007
Page
SWITCHES, TAPE & PUNCH CARDS (1940s–1960s)
9
Foundations of Interaction DesignSeptember 2008
“MAN-COMPUTER SYMBIOSIS” (1950s)
“The hope is that, in not too many years, 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 and process data in a way not approached by the information-handling machines we know today.”
— J.R. Licklider
Foundations of Interaction DesignSeptember 2007
Page
BINAC (1949)
11
Foundations of Interaction DesignSeptember 2008
12IBM ELECTRONIC CALCULATORS (1950s)
Foundations of Interaction DesignSeptember 2007
Page
UNIVAC (1956)
13
Cards / Switches
Foundations of Interaction DesignSeptember 2007
1945 1955 1965 1975 1985 1995 2005
Cards / Switches
Keyboard
Graphical User Interface
Hypertext Networks
Mobility
TIMELINE OF ADOPTION (AND ADAPTATION!)
Professional UsePersonal Use
Cards / Switches
Foundations of Interaction DesignSeptember 2007
1945 1955 1965 1975 1985 1995 2005
Cards / Switches
Keyboard
Graphical User Interface
Hypertext Networks
Mobility
TIMELINE OF ADOPTION (AND ADAPTATION!)
Professional UsePersonal Use
?
Foundations of Interaction DesignSeptember 2007
Page
MITS ALTAIR 8800 (1975)
15
Foundations of Interaction DesignSeptember 2007
Page
MITS ALTAIR 8800 (1975)
15
Cards / Switches
Foundations of Interaction DesignSeptember 2007
1945 1955 1965 1975 1985 1995 2005
Keyboard
Graphical User Interface
Hypertext Networks
Mobility
TIMELINE OF ADOPTION (AND ADAPTATION!)
Professional UsePersonal Use
LINC
Apple II
NLS
Xerox ALTO and STAR
IBM PCApple Lisa and Mac
Whirlwind
Windows 3.1
Typing Interaction Pointing Interaction
Foundations of Interaction DesignSeptember 2007
WHIRLWIND (1951)
Foundations of Interaction DesignSeptember 2007
Designer Wesley A. Clark shown with the first Laboratory Instrument Computer (LINC)
LINC (1962)
Foundations of Interaction DesignSeptember 2007
Page
Apple II
Commodore PET Tandy Radio Shack TRS-80
IBM 5150
Commodore VIC-20
HOME COMPUTERS (70s)
20
Foundations of Interaction DesignSeptember 2008
PERSONAL COMPUTING (1975)
Foundations of Interaction DesignSeptember 2007
Command Line
VisiCalc
APPLICATION INTERFACES (70s)
WordStar
Hierarchical Menus
Cards / Switches
Foundations of Interaction DesignSeptember 2007
1945 1955 1965 1975 1985 1995 2005
Keyboard
Graphical User Interface
Hypertext Networks
Mobility
TIMELINE OF ADOPTION (AND ADAPTATION!)
Professional UsePersonal Use
Foundations of Interaction DesignSeptember 2007
Page
GRAPHICAL USER INTERFACES
Windows Icons
Menus Pointers
24
Foundations of Interaction DesignSeptember 2007
Page
WINDOWS
25
Foundations of Interaction DesignSeptember 2008
ICONS26
Foundations of Interaction DesignSeptember 2007
Page
MENUS
27
Foundations of Interaction DesignSeptember 2008
POINTERS28
LINC
Apple II
NLS
Xerox ALTO and STAR
IBM PCApple Lisa and Mac
Whirlwind
Windows 3.1
Typing Interaction Pointing Interaction
Foundations of Interaction DesignSeptember 2007
IVAN SUTHERLAND AND SKETCHPAD (1963)
The Sketchpad system makes it possible for a man and a computer to converse rapidly through the medium of line drawings. Heretofore, most interaction between man and computers has been slowed down by the need to reduce all communication to written statements that can be typed; in the past, we have been writing letters to rather than conferring with our computers. The Sketchpad system, by eliminating typed statements (except for legends) in favor of line drawings, opens up a new area of man-machine communication.
Foundations of Interaction DesignSeptember 2007
“By augmenting man's intellect we mean increasing the capability of a man to approach a complex problem situation, gain comprehension to suit his particular needs, and to derive solutions to problems. One objective is to develop new techniques, procedures, and systems that will better adapt people's basic information-handling capabilities to the needs, problems, and progress of society.”
—Douglas Englebart
X/Y POSITION INDICATOR (THE MOUSE) (1964)
Foundations of Interaction DesignSeptember 2007
NLS – ONLINE SYSTEM (60s)
Foundations of Interaction DesignSeptember 2007
XEROX ALTO (1973)
Foundations of Interaction DesignSeptember 2007
XEROX ALTO (1973)
Foundations of Interaction DesignSeptember 2007
XEROX STAR (1981)
Foundations of Interaction DesignSeptember 2007
APPLE LISA (1983)
Foundations of Interaction DesignSeptember 2007
Page
APPLE MACINTOSH (1983)
39
Foundations of Interaction DesignSeptember 2008
Foundations of Interaction DesignSeptember 2008
MICROSOFT SOFTWARE IN A BOX(1990s)
Cards / Switches
Foundations of Interaction DesignSeptember 2007
1945 1955 1965 1975 1985 1995 2005
Keyboard
Graphical User Interface
Hypertext Networks
Mobility
TIMELINE OF ADOPTION (AND ADAPTATION!)
Professional UsePersonal Use
Foundations of Interaction DesignSeptember 2008
VANNEVAR BUSH AND MEMEX (1945)
43
Foundations of Interaction DesignSeptember 2008
ARPANET AND USENET (1980s)
44
ARPANET 1977 USENET 1980
USENET 1993
Foundations of Interaction DesignSeptember 2008
First Web Browser/Editor, 1990Netscape, 1994
Yahoo, 1994
WORLD WIDE WEB (1990s)
Cards / Switches
Foundations of Interaction DesignSeptember 2007
1945 1955 1965 1975 1985 1995 2005
Keyboard
Graphical User Interface
Hypertext Networks
Mobility
TIMELINE OF ADOPTION (AND ADAPTATION!)
Professional UsePersonal Use
Foundations of Interaction DesignSeptember 2007
XEROX DYNABOOK (1968)
Foundations of Interaction DesignSeptember 2008
MOBILE COMPUTING (1990s)
Osborne 1 (1981) Apple Powerbook (1991)
Foundations of Interaction DesignSeptember 2008
MOBILE DEVICES (2000s)
Foundations of Interaction DesignSeptember 2007
51
Foundations of Interaction DesignSeptember 2007
51
LET’S RECAP.
Foundations of Interaction DesignSeptember 2007
51
LET’S RECAP._Who’s the user?
Foundations of Interaction DesignSeptember 2007
51
LET’S RECAP._Who’s the user?_What’s the interface?
Foundations of Interaction DesignSeptember 2007
51
LET’S RECAP._Who’s the user?_What’s the interface?_How is it used?
Foundations of Interaction DesignSeptember 2007
51
LET’S RECAP._Who’s the user?_What’s the interface?_How is it used?_Who can afford it?
Foundations of Interaction DesignSeptember 2007
BEFORE 1945: THE NEW INVENTION
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
THE INVENTOR HIMSELF
BEFORE 1945: THE NEW INVENTION
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
MOVING CABLES AROUNDTHE INVENTOR HIMSELF
BEFORE 1945: THE NEW INVENTION
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
BRUTE FORCE ARITHMETIC
MOVING CABLES AROUNDTHE INVENTOR HIMSELF
BEFORE 1945: THE NEW INVENTION
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
BRUTE FORCE ARITHMETIC
MOVING CABLES AROUNDTHE INVENTOR HIMSELF
BEFORE 1945: THE NEW INVENTION
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
THE MILITARY
Foundations of Interaction DesignSeptember 2007
1945 –1955: THE CALCULATOR
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
EXPERTS AND PIONEERS
1945 –1955: THE CALCULATOR
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
PUNCH CARDS AND SWITCHESEXPERTS AND PIONEERS
1945 –1955: THE CALCULATOR
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
HIGH SPEED CALCULATIONS
PUNCH CARDS AND SWITCHESEXPERTS AND PIONEERS
1945 –1955: THE CALCULATOR
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
ROCKET SCIENTISTSHIGH SPEED CALCULATIONS
PUNCH CARDS AND SWITCHESEXPERTS AND PIONEERS
1945 –1955: THE CALCULATOR
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
1955 –1965: THE GIANT BRAIN
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
PROFESSIONAL ENGINEERS
1955 –1965: THE GIANT BRAIN
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
TELETYPE AND TERMINAL
Foundations of Interaction DesignSeptember 2007
PROFESSIONAL ENGINEERS
1955 –1965: THE GIANT BRAIN
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
TELETYPE AND TERMINAL
Foundations of Interaction DesignSeptember 2007
COMMAND LINE INTERFACE
PROFESSIONAL ENGINEERS
1955 –1965: THE GIANT BRAIN
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
TELETYPE AND TERMINAL
Foundations of Interaction DesignSeptember 2007
INFORMATION INTENSIVE BUSINESSESCOMMAND LINE INTERFACE
PROFESSIONAL ENGINEERS
1955 –1965: THE GIANT BRAIN
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
1965 –1980: WHITE COLLAR LABOR
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
SPECIALIZED COMPUTER OPERATORS
1965 –1980: WHITE COLLAR LABOR
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
GREEN-SCREEN ALPHANUMERICSPECIALIZED COMPUTER OPERATORS
1965 –1980: WHITE COLLAR LABOR
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
BATCH PROCESSING
GREEN-SCREEN ALPHANUMERICSPECIALIZED COMPUTER OPERATORS
1965 –1980: WHITE COLLAR LABOR
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
MOST LARGE BUSINESSESBATCH PROCESSING
GREEN-SCREEN ALPHANUMERICSPECIALIZED COMPUTER OPERATORS
1965 –1980: WHITE COLLAR LABOR
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
1980 –1995: PRODUCTIVITY TOOL
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
1980 –1995: PRODUCTIVITY TOOL
How is it used?
Who can afford them?
GEEKS
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
GUIs
1980 –1995: PRODUCTIVITY TOOL
How is it used?
Who can afford them?
GEEKS
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
GUIs
SHRINK-WRAPPED SOFTWARE
1980 –1995: PRODUCTIVITY TOOL
How is it used?
Who can afford them?
GEEKS
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
GUIs
SHRINK-WRAPPED SOFTWARE UPWARDLY MOBILE HOME USERS
1980 –1995: PRODUCTIVITY TOOL
How is it used?
Who can afford them?
GEEKS
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
1995 – ?: NETWORKED UBIQUITY
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
EVERYONE.
1995 – ?: NETWORKED UBIQUITY
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
Foundations of Interaction DesignSeptember 2007
EVERYONE.
1995 – ?: NETWORKED UBIQUITY
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
GUIs
Foundations of Interaction DesignSeptember 2007
WEB-ENABLED TOOLS
EVERYONE.
1995 – ?: NETWORKED UBIQUITY
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
GUIs
Foundations of Interaction DesignSeptember 2007
THEY’RE CHEAP! BUY SEVERAL!WEB-ENABLED TOOLS
EVERYONE.
1995 – ?: NETWORKED UBIQUITY
How is it used?
Who can afford them?
Who’s the user?
What’s the interface?
GUIs
Foundations of Interaction DesignSeptember 2007
WHAT NEXT?
Foundations of Interaction DesignSeptember 2007
TOUCHSCREEN INTERFACES BLUR THE LINES
BETWEEN INPUT AND DISPLAY
Foundations of Interaction DesignSeptember 2008
NEW “VERBS” ARE A REALITY60
Voice Recognition
Bi-touch
Gestures
Pinch
Foundations of Interaction DesignSeptember 2007
APPLICATIONS, DATA, CONTENT AND PROFILES ARE MOVING TO THE
CLOUD.
Foundations of Interaction DesignSeptember 2007
APPLICATIONS, DATA, CONTENT AND PROFILES ARE MOVING TO THE
CLOUD.
Foundations of Interaction DesignSeptember 2008
“The application model is constraining to users who have integrated tasks that require multiple applications to solve.”
—Jakob Nielsen
62
Foundations of Interaction DesignSeptember 2007
64
WHAT DO YOU THINK IS NEXT?
Foundations of Interaction DesignSeptember 2008
THANKS TO:65
Michael Wesch, “The Machine is Us/ing Us”
Mike Tuck, “The Real History of the GUI”
Jakob Nielsen, “Noncommand User Interfaces”
Richard T. Griffiths, “History of the Internet for Historians (and just about everyone else)”
Brad Myers, “A Brief History of Human Computer Interaction Technology”
Saul Greenberg, “History of Human Computer Interaction”
Mark Rettig, “Interaction Design History In A Teeny Little Nutshell”
Bill Moggridge, Designing Interactions
Donald Norman, The Design of Everyday Things
Digibarn Computer Museum
Wikipedia
Google Images
38 West 21st Street3rd FloorNew York, NY 10010
212-226-6344 main212-898-0369 fax
www.bondartscience.cominfo@bondartscience.com
THANKS!
top related