Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
FROM TYPING TO SWIPING
A Brief History of Interaction Design
HOW WE TALK TO COMPUTERS
 HOW MACHINES TALK BACK




                           2
FIT THE PERSON TO THE MACHINE




FIT THE MACHINE TO THE PERSON

                                3
WHO’S THE USER?
WHAT’S THE INTERFACE?
HOW WAS IT USED?
WHO BOUGHT THEM?
BEFORE 1945
MECHANICAL TOOLS
Who’s                        What’s
the user?                    the
                        ...
An undetected error in a logarithmic table is
like a sunken rock at sea yet undiscovered,
upon which it is impossible to s...
CHARLES BABBAGE


                                                       “
(1791–1871)

                                  ...
THE DIFFERENCE ENGINE
(1822)




http://upload.wikimedia.org/wikipedia/en/4/45/Difference_engine.JPG
                     ...
THE ANALYTICAL ENGINE
(1833)




                  web.arch.usyd.edu.au/~sriz8189/computing7.html   12
DIFFERENTIAL ANALYZER
(1930–40s)




http://en.wikipedia.org/wiki/File:KayMcNultyAlyseSnyderSisStumpDifferentialAnalyzer.j...
“
VANNEVAR BUSH
(1890 – 1974)

                Vannevar Bush is a great name for
                playing six degrees of se...
1945–1950
THE NEW INVENTION
Who’s                                What’s
the user?                            the
         ...
PRESPER ECKERT & JOHN MAUCHLEY
(1946)




                             16
“
One would think that if a man invented a machine
that revolutionized the world, took out a patent
on that machine, and h...
ENIAC
(1946)




http://mrsec.wisc.edu/Edetc/SlideShow/slides/computer/eniac.html   18
ENIAC
(1946)




http://www.columbia.edu/acis/history/eniac4.png
                                                  19
“
The principle flaw was ENIAC’s inability to hold
easily altered instructions in its memory. Every
time the machine neede...
1950 –1960
THE CALCULATOR
Who’s                                 What’s the
the user?                             interface...
HERMAN HOLLERITH
(1860 – 1929)




http://www.census.gov/history/img/Hollerith.jpg   http://www.columbia.edu/acis/history/...
(1880)
                                                                              THE CENSUS




23




http://upload.w...
HOLLERITH CENSUS TABULATOR
(1890)




http://www.columbia.edu/acis/history/census-tabulator.html   24
READING PUNCH CARDS
        1.     Card reader
        2.     Cups of mercury
        3.     Tabulating dials
        4.  ...
F.W. TAYLOR


                                                “
 (1856 – 1915)

                                          ...
SCIENTIFIC MANAGEMENT




http://images.google.com/hosted/life/l?imgurl=bd5182b00cffc073   27
http://www-03.ibm.com/ibm/history/exhibits/vintage/images/4506VV2015.jpg
                                                 ...
http://www-03.ibm.com/ibm/history/exhibits/vintage/vintage_4506VV9002.html
                                               ...
1925   1933




              http://www-03.ibm.com/ibm/history/
1949   1964
                                            30
“
One place where IBM did succeed was in keeping
viable the basic input medium of the punched
card, and with that the basi...
PUNCHED HOLE FUNCTIONS
1. Adds
2. Subtracts
3. Multiplies
4. Divides
5. Lists itself
6. Reproduces itself
7. Classifies it...
IBM ELECTRONIC CALCULATORS
       (1950s)




http://www.digibarn.com/collections/ads/ibm-50s/index.html
                 ...
1960 –1970
THE GIANT BRAIN
Who’s the                              What’s the
user?                                  interf...
“
MAN-COMPUTER SYMBIOSIS
                The hope is that, in not too
                many years, human brains
           ...
http://www.digibarn.com/collections/ads/univac-50s/stand-alone/index.htm   http://www.digibarn.com/collections/ads/univac-...
37
UNIVAC
(1951)




http://americanhistory.si.edu/collections/comphist/objects/univac.htm
                                  ...
http://www.library.upenn.edu/exhibits/rbm/mauchly/img/unidia.jpg
39
GRACE MURRAY HOPPER


                                                             “
(1906 – 1992)

                      ...
“
Not only would a
programmer hardly
ever see the
computer, he or she
might never even
see the keypunch on
which the progr...
HENRY DREYFUSS


                                                 “
(1904 – 1972)

                                       ...
DESIGNING FOR PEOPLE
(1955)




                       43
44
1970 –1985
PINK COLLAR LABOR
Who’s the                          What’s the
user?                              interface?

...
WHIRLWIND
(1952)




 http://www.computermuseum.li/Testpage/Whirlwind-1949.htm
 http://www.computerhistory.org/collections...
WHIRLWIND




COMMAND LINE   GRAPHICAL USER
                 INTERFACE
                                47
DATA ENTRY




             48
“
By the mid-1960s, data processing computers for
business had become well established. The
commercial computer installati...
WHIRLWIND




COMMAND LINE   GRAPHICAL USER
                 INTERFACE
                                50
BATCH        TIME
PROCESSING   SHARING



                       51
DIRECT MANIPULATION



                      52
IVAN SUTHERLAND


                                    “
(b.1938)

                                                        ...
SKETCHPAD
 (1963)




http://design.osu.edu/carlson/history/images/ivan-sutherland.jpg                                    ...
“
DOUGLAS ENGELBART
(b. 1925)

                                                      By augmenting man's intellect
       ...
X/Y POSITION INDICATOR
ALSO KNOWN AS “THE MOUSE”
(1964)

                             The number of
                      ...
NLS – ONLINE SYSTEM
(60s)




http://www.dougengelbart.org/   57
THE MOTHER OF ALL DEMOS
(1968)




http://blogs.discovermagazine.com/80beats/files/2008/12/engelbart-demo.jpg   http://vid...
1985 –1995
PERSONAL COMPUTING
Who’s                                What’s the
the user?                            interfa...
MITS ALTAIR 8800
(1975)




                   60
ALTAIR BASIC




http://en.wikipedia.org/wiki/File:Altair_Basic_Sign.jpg
                                                 ...
PERSONAL COMPUTING
(1975)
http://upload.wikimedia.org/wikipedia/commons/6/6e/Homebrew_Computer_Club_Sep1976.png
                                    ...
http://upload.wikimedia.org/wikipedia/commons/a/a1/Apple_I_Computer.jpg
                                                  ...
HOME COMPUTERS
 (Late 70s)




Apple II                     IBM 5150




 Commodore PET   Tandy Radio Shack TRS-80   Commo...
APPLICATION INTERFACES
(70s)




Command Line         WordStar




Hierarchical Menus   VisiCalc
XEROX PARC
(1970s)

             _ Laser Printer
             _ Ethernet local area computer
               network
      ...
XEROX ALTO
(1973)




             68
XEROX STAR
(1981)




             69
APPLE LISA
(1983)
APPLE MACINTOSH
(1983)




                  71
WORLD WIDE WEB
(1990s)




                                 Netscape, 1994




First Web Browser/Editor, 1990
            ...
1995 – ?
NETWORKED UBIQUITY
Who’s                           What’s the
the user?                       interface?




    ...
THANKS!

@karenmcgrane
karen@bondartscience.com
www.bondartscience.com
+1 (917) 887-8149
Upcoming SlideShare
Loading in …5
×

“ MAN-COMPUTER SYMBIOSIS The hope From Typing to Swiping: A Brief History of Interaction Design


MAN-COMPUTER SYMBIOSIS
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.C.R. Licklider
Man-Computer Symbiosis
35

×