SlideShare une entreprise Scribd logo
1  sur  131
Télécharger pour lire hors ligne
Historyof
the Button   Bill DeRouchey
Hello.
This incarnation of the History of the Button was
presented at SXSW on March 12, 2010.

This slide deck is slightly different from the live
presentation. The main difference is that the videos
that were in the presentation have been translated
here to stills as best as possible.

Enjoy.
                                  Also, narration boxes like this are
Bill DeRouchey                    extra notes to help fill in context
                                  where necessary and point out
bill.derouchey@gmail.com          where this version differed from
@billder                          the live presentation.
About the audio.
If you’re listening to the audio, sorry about the bad
quality for the first 12 minutes. SXSW somehow cut
off the first 12 minutes.

To make up for it, I had to slice in the audio from
my FlipCam recording, which was better than
nothing.

If you’re not listening to the audio, then it doesn’t
matter at all. Carry on.
This is astory
     that spans over
           100 years...
As a contrast to SXSW
which focuses so much on
the Now and the Future.
... about how we got from
here         to   here...
buttons
... about how
have changed how
    we understand
  our world...
buttons
... about how
have changed how
   ...
        think.
     we understand
  our world.
Products                            Movies




Advertisements                      Screens



           We’ll take almost an anthropological
           approach by looking at these items
           to examine the history of the button.
1910 1956
          1984 2010



      These were all movies in
      the original presentation.




The simplest motion.
1910 1956
            1984 2010



        These were all movies in
        the original presentation.




is just push the button.
This was a movie in the original
presentation (from Apple.com).




  We’re in a transition....
This was a movie in the original
presentation (from Apple.com).




 a transitiontransition....
 We’re in a to Surface.
Transitions
 are interesting...


because that’s when our
  brains change.
Generations of Interaction

1 Lever
2 Button
                                               now
3 Surface
4 Fluid             We are currently in a transition
                    from a button era to a surface era.
Generations of Interaction

1 Lever                                   1900
2 Button
3 Surface
4 Fluid              We should look to the previous
                     transition to understand today.
We are a bunch of smart
             monkeys. We figured out
             how to use the objects in
             the world around us to
             augment our human motion.
             Bones into shovels. Sticks
             into rakes. Iron into gears.




We love our tools.
For example, a gun can
simply be understood as
throwing a rock, a tiny
rock, much faster and
with greater accuracy.
Pressing on the keys of
a piano simply triggers a
hammer hitting a string.
Motion is augmented.
You can see the
     Action.



    In the mechanical era, you
    can see action happen, see
    how one motion affects
    another. You can follow the
    results from action to result.
Levers
   scale motion.

Scaling
is the mechanical age.
Compressed
Time


Major advances in technology actually
change how we perceive the world.

For example, train travel compressed our
sense of time between faraway places.
The telegraph changed our sense of connection
over distance. Instant communication across
hundreds of miles for the first time.




             Compressed
  Distance
But the button meant for the
first time, the result of a human
motion could be completely
different from the motion itself.




                                     Abstracted
                                    Motion
The motion Push
  does not scale to
the result Light.



       This abstracted interaction with
       technology represented a new
       way to comprehend the world.
Buttons
   abstract motion.

Abstraction
 is the electronic age.
What was the
             first button?

This might be the most common
question people ask me.
The flashlight was the first simple
                  everyday button. It revolutionized
                  our sense of light.

   What was the
       first button?


1898
Buttons
   enter

Daily Life
George Eastman of
Kodak introduced
cameras for regular
people.




                      1890s
Eastman used the
phrase “You Press
the Button, We Do
the Rest” to show
how simple
cameras can be.

Button = easy.




                    1890s
Doorbells replaced
pull ringers in homes.




              1900s
As the electricity grid
expanded, homes
installed lights and
simple pushbuttons to
turn the lights on and off.




                  1910s
Sidenote:
An editorial
cartoon from 1911
depicting a dark
vision of the future.

Surrounded by
technology, lazy,
pushing buttons.

For a similar
dystopian view,
read the 1910
short story
“The Machine
Stops” from
E.M. Forster.




              1911
“The Opera Delivered to Your Door” = Pandora
“The Observascope” = webcams
Of course, all with a robot servant!
The next major tech
             innovation was the
             radio, sending live
             audio from a distance.

             The opera really now
             was delivered to you.




The radio.                 1920s
30 million radios
      sold by 1938.




                This was their Internet boom.
But tuning to your
favorite stations
almost required a
scientist mentality.

Until 1938 when radio
presets (buttons)
exchanged the
emphasis on “tuning”
for “returning.”




                                   1938



                  Radio presets.
Essentially, radio
presets were the first
notion of “saving” in
technology. Save
your favorite station.




                             1938



     First notion of Save.
        Radio presets.
Buttons
  represent

The Future
1939

During the Great
Depression, people
looked to a better
future, capped by the
World’s Fair in 1939.




New York
World’s Fair
1939

Technology was
heralded as the
emancipator of leisure.




A shrine to
the button?
Movie from 1940
depicting a vision of the
future. With robots.
                            1940
Roy’s Robot Repair is
helping this concerned
woman with her robot.
                         1940
She controls her robot
with buttons. Roll-Oh
can even fix a furnace.
                          1940
When fixed, Roll-Oh
fetches the nice
repairman’s hat.
                      1940
1958

Visions of the future
continued, including
this Monsanto home,
promoting both the
wonders of plastics
and pushbuttons.




Monsanto
House of
the Future
Another movie.
                 1958
The happy wife pushes buttons
to access hidden compartments.
                                 1958
The happy wife pushes buttons
to access hidden compartments.
                                 1958
The happy wife pushes buttons
to control her home.
                                1958
Buttons
 represent

Luxury
In the 1950s, the promise of
pushbutton technology became
available to a wide variety of
consumer items, providing a
new luxury for the middle class.
And in nearly every case,
the phrase “pushbutton”
became an adjective
communicating modern,
luxury, advanced, new, easy.




                               1956
1958
1960
1959
1961
Now there’s a woman
in control of her laundry.
                             1959
So easy...
 even a woman
  can do it.
       And also in nearly every case, women
       were used in ads to add the subtle
       message of, this new technology is so
       easy to use, even a woman can use it.
Picture the
                      classic Crossing
                      the Chasm
                      diagram of early
                      adopters vs. late
                      adopters.

                      “Pushbutton”
                      meant that the
                      product was
                      simple enough
                      for late adopters
                      to now buy.




Buttons cross the chasm.
This practice of using “pushbutton”
continues today, but only in the
seamier parts of the web.

Get rich quick!
Lose weight now!
           1959
Join the Push Button Empire!
Returning to the living room,
the remote control has
become the classic example
of this pushbutton era.




                                1959
Because for the first time,
                  regular people could
                  control an object from a
                  distance. No wires!




First control
from a distance                       1956
Buttons
 represent

 Fear
History of the Button
After WWII, we had
                 automated war machinery
                 so much that global
                 nuclear annihilation was
                 perceived to be as easy
                 as pushing a button.

                 And it may have been.




Who has theirfinger
         on the button?
Raising a generation on fear.
                                1950s
Buttons
 represent

Control
At the same time, engineers
were building complex machines
controlled by rows and rows of
switches and buttons. We were
learning to automate.
At the same time, engineers
were building complex machines
controlled by rows and rows of
switches and buttons. We were
learning to automate.
Only a select few could
understand these machines,
could use these buttons, using
a highly specialized language.
Only a select few could
understand these machines,
could use these buttons, using
a highly specialized language.
From “That Touch of Mink.”

Doris Day works at Univac.   1962
She’s fed up at working in
this automation job.         1962
So she slams the machine.   1962
And leaves the machines
running. (Note the Univac in
the background.)               1962
Chaos ensues.   1962
Buttons
 represent

 Play
Humpty Dumpty
pinball machine was
the first to use flippers.
                             1947



      First pinball flippers.
First mechanical game
where you can interact
with the ball in play to
keep it in play. Beginning
of a new era in gaming.
                             1947



First game interaction?
Generational               1977


Icon


               This Atari joystick
               revolutionized
               gaming in the home.
Shape as
                     Play
                          1978




Experimenting
with the shape of
the button itself.
Arcades boomed
in the 1970s
History of the Button
History of the Button
History of the Button
History of the Button
Dexterity in pushing
buttons now became a
prized skill, generating
an entire industry.
Buttons
  become

Metaphor
Before this, buttons were physical things. The
Macintosh in 1984 introduced to the general
public the idea that buttons could be virtual.
The virtual button still needs a physical button.   1964
The virtual button still needs a physical button.   1984
This concept was so new
that Apple needed to
educate people simply
how to use a mouse.

They took out 39 pages
of advertising in
Newsweek to essentially
publish a user’s manual.




Education                  through   Advertising   1984
Notice the incredible detail to communicate
                       the basics of something we take for granted.




Education   through   Advertising                            1984
Notice the incredible detail to communicate
the basics of something we take for granted.




                                      1984
Buttons
  lose

Shape
With the web, “buttons” could
become anything. They didn’t
need a specific shape that said
“I’m a button.” They could be
blue text and underlined.



                         1996
Images, text, anything is now
actionable. As an example, the
next page shows everything
that can be acted upon.
Compare it to this page.
Nearly everything can be acted
upon. This has changed how
we perceive the world around
us. All items can have deeper
connection.
We even understand that
simple gray text is actionable,
simply from its location to its
neighbors. We assume that
“Work” is a link.




                         2010
But would we
assume that here?
Buttons
  go

Touch
Touchscreens are becoming
everyday interactions.
Touchscreens are becoming
everyday interactions.
The poster child of touch.
Now taking orders
History of the Button
Where are we
     now?
Buttons don’t need...
          form
  borders
contour  shape
     words
ornamentation
... and yet, we attribute to them

  ease   process
 magic     control
 play  simplicity
      automation
think about
We now
objects with
depth and time,
 instead of just static things.
We are approaching a time
 when  anything
    is interactive.
Gesture interaction game
designed by Ziba for
Li Ning in China.
Imagine somebody 100
years ago encountering
this device.
Imagine somebody 100
years ago encountering
this device.
Generations of Interaction

1 Lever
2 Button
3 Surface
                                       soon
4 Fluid                The next generation will
                       feature dynamic surfaces.
Dynamic
  tactile surfaces
     will create

disposable
 physical interfaces.
If it was rumored to be in the
iPad, then the technology must
be only a few years away.
Research on dynamic tactile surfaces
from Chris Harrison and Scott Hudson
at Carnegie Mellon University.
When buttons can essentially have a
disposable physical form, we can build
interfaces into any surface.
Meaning our entire surroundings can
be interactable. Imagine the
generation that grows up with that.
And the next
  generation?
Imagine growing up in a world where
touchscreens and interactive gestures are a given.
How does that affect your brain processing?
Imagine growing up in a world where
touchscreens and interactive gestures are a given.
How does that affect your brain processing?
Imagine growing up in a world where
touchscreens and interactive gestures are a given.
How does that affect your brain processing?
The button         has been a
  100 year transition technology
    from the mechanical age
      to the truly electronic age.
The button represents
how we interact with
  the objects we create.
And that’s why the button
    is the most influential
       yet least appreciated
  innovation
      of the 20th Century.
Historyof
the Button

Bill DeRouchey


@billder
bill.derouchey@gmail.com

Contenu connexe

Tendances

Fairmont metaverse sunumu
Fairmont metaverse sunumuFairmont metaverse sunumu
Fairmont metaverse sunumuELİF TÜDEŞ
 
Presentation Virtual Reality and CAD
Presentation Virtual Reality and CADPresentation Virtual Reality and CAD
Presentation Virtual Reality and CADontor omi
 
52497104 seminar-report
52497104 seminar-report52497104 seminar-report
52497104 seminar-reportdhiru8342
 
Java programming masterclass course udemy certificate
Java programming masterclass course   udemy certificateJava programming masterclass course   udemy certificate
Java programming masterclass course udemy certificateRhulaniJonesNavela
 
XR and the Future of Immersive Technology
XR and the Future of Immersive TechnologyXR and the Future of Immersive Technology
XR and the Future of Immersive TechnologyVincent Lau
 
The Lorax - Storyboards - Outside Thneedville
The Lorax - Storyboards - Outside ThneedvilleThe Lorax - Storyboards - Outside Thneedville
The Lorax - Storyboards - Outside ThneedvilleDidier Ah Koon
 
Mixed Reality in the Workspace
Mixed Reality in the WorkspaceMixed Reality in the Workspace
Mixed Reality in the WorkspaceMark Billinghurst
 
A Short History of the Metaverse
A Short History of the MetaverseA Short History of the Metaverse
A Short History of the MetaverseBernard Marr
 
2013 426 Lecture 1: Introduction to Augmented Reality
2013 426 Lecture 1: Introduction to Augmented Reality2013 426 Lecture 1: Introduction to Augmented Reality
2013 426 Lecture 1: Introduction to Augmented RealityMark Billinghurst
 
Virtual Reality in Interior and Architectural Design
Virtual Reality in Interior and Architectural DesignVirtual Reality in Interior and Architectural Design
Virtual Reality in Interior and Architectural DesignDmitry Solodovnikov
 
Augmented Reality Presentation
Augmented Reality PresentationAugmented Reality Presentation
Augmented Reality PresentationSJSU
 
Project report on signal jammer
Project report on signal jammerProject report on signal jammer
Project report on signal jammerARYAN KUMAR
 
From gaming to the metaverse
From gaming to the metaverseFrom gaming to the metaverse
From gaming to the metaverseAlison B. Lowndes
 
Metaverse - The Future of Marketing and Web 3.0.pdf
Metaverse - The Future of Marketing and Web 3.0.pdfMetaverse - The Future of Marketing and Web 3.0.pdf
Metaverse - The Future of Marketing and Web 3.0.pdfthetechnologynews
 
Metaverse the future.pptx
Metaverse the future.pptxMetaverse the future.pptx
Metaverse the future.pptxNinaiqbal
 

Tendances (20)

Fairmont metaverse sunumu
Fairmont metaverse sunumuFairmont metaverse sunumu
Fairmont metaverse sunumu
 
Presentation Virtual Reality and CAD
Presentation Virtual Reality and CADPresentation Virtual Reality and CAD
Presentation Virtual Reality and CAD
 
52497104 seminar-report
52497104 seminar-report52497104 seminar-report
52497104 seminar-report
 
Java programming masterclass course udemy certificate
Java programming masterclass course   udemy certificateJava programming masterclass course   udemy certificate
Java programming masterclass course udemy certificate
 
XR and the Future of Immersive Technology
XR and the Future of Immersive TechnologyXR and the Future of Immersive Technology
XR and the Future of Immersive Technology
 
The Lorax - Storyboards - Outside Thneedville
The Lorax - Storyboards - Outside ThneedvilleThe Lorax - Storyboards - Outside Thneedville
The Lorax - Storyboards - Outside Thneedville
 
Mixed Reality in the Workspace
Mixed Reality in the WorkspaceMixed Reality in the Workspace
Mixed Reality in the Workspace
 
A Short History of the Metaverse
A Short History of the MetaverseA Short History of the Metaverse
A Short History of the Metaverse
 
logo presentation pdf
logo presentation pdflogo presentation pdf
logo presentation pdf
 
Kerala Government Orders regarding scheme for the Compassionate Employment of...
Kerala Government Orders regarding scheme for the Compassionate Employment of...Kerala Government Orders regarding scheme for the Compassionate Employment of...
Kerala Government Orders regarding scheme for the Compassionate Employment of...
 
2013 426 Lecture 1: Introduction to Augmented Reality
2013 426 Lecture 1: Introduction to Augmented Reality2013 426 Lecture 1: Introduction to Augmented Reality
2013 426 Lecture 1: Introduction to Augmented Reality
 
Virtual reality
Virtual   realityVirtual   reality
Virtual reality
 
Autonomous Tello Drone ASU
Autonomous Tello Drone ASUAutonomous Tello Drone ASU
Autonomous Tello Drone ASU
 
Virtual Reality in Interior and Architectural Design
Virtual Reality in Interior and Architectural DesignVirtual Reality in Interior and Architectural Design
Virtual Reality in Interior and Architectural Design
 
Augmented Reality Presentation
Augmented Reality PresentationAugmented Reality Presentation
Augmented Reality Presentation
 
Project report on signal jammer
Project report on signal jammerProject report on signal jammer
Project report on signal jammer
 
From gaming to the metaverse
From gaming to the metaverseFrom gaming to the metaverse
From gaming to the metaverse
 
Oculus Rift
Oculus RiftOculus Rift
Oculus Rift
 
Metaverse - The Future of Marketing and Web 3.0.pdf
Metaverse - The Future of Marketing and Web 3.0.pdfMetaverse - The Future of Marketing and Web 3.0.pdf
Metaverse - The Future of Marketing and Web 3.0.pdf
 
Metaverse the future.pptx
Metaverse the future.pptxMetaverse the future.pptx
Metaverse the future.pptx
 

En vedette

What the F**k is Social Media NOW?
What the F**k is Social Media NOW?What the F**k is Social Media NOW?
What the F**k is Social Media NOW?Martafy!
 
SMOKE - The Convenient Truth [1st place Worlds Best Presentation Contest] by ...
SMOKE - The Convenient Truth [1st place Worlds Best Presentation Contest] by ...SMOKE - The Convenient Truth [1st place Worlds Best Presentation Contest] by ...
SMOKE - The Convenient Truth [1st place Worlds Best Presentation Contest] by ...Empowered Presentations
 
Doctor's Orders - Burn Your PowerPoints
Doctor's Orders - Burn Your PowerPointsDoctor's Orders - Burn Your PowerPoints
Doctor's Orders - Burn Your PowerPointsNathan Cashion
 
The Brand Gap
The Brand GapThe Brand Gap
The Brand Gapcoolstuff
 
Directory Game Connection@GDC 2011
Directory Game Connection@GDC 2011Directory Game Connection@GDC 2011
Directory Game Connection@GDC 2011Connection Events
 
Rod and Yoke Connection
Rod and Yoke ConnectionRod and Yoke Connection
Rod and Yoke ConnectionAsif Lemon
 
Sweden Game Arena presentation for Game Connection 2015
Sweden Game Arena presentation for Game Connection 2015Sweden Game Arena presentation for Game Connection 2015
Sweden Game Arena presentation for Game Connection 2015Laura Bularca
 
OEPS Project Overview for SUALL Council
OEPS Project Overview for SUALL Council OEPS Project Overview for SUALL Council
OEPS Project Overview for SUALL Council OEPScotland
 
An Actor Model in Go
An Actor Model in GoAn Actor Model in Go
An Actor Model in GoWeaveworks
 
2013 | ThirsT event bars and catering | Company presentation (Dutch)
2013  | ThirsT event bars and catering | Company presentation (Dutch)2013  | ThirsT event bars and catering | Company presentation (Dutch)
2013 | ThirsT event bars and catering | Company presentation (Dutch)Pieter Lathouwers
 
Death By Powerpoint4344
Death By Powerpoint4344Death By Powerpoint4344
Death By Powerpoint4344mjmartinezx
 
General Drupal presentation in Dutch
General Drupal  presentation in DutchGeneral Drupal  presentation in Dutch
General Drupal presentation in DutchRoel Meester
 
4 Ways to Make your Brain More Vibrant with Visuals
4 Ways to Make your Brain More Vibrant with Visuals4 Ways to Make your Brain More Vibrant with Visuals
4 Ways to Make your Brain More Vibrant with VisualsImageThink
 
Stop the Intranet Schizophrenia (and Succeed with IBM Connections)
Stop the Intranet Schizophrenia (and Succeed with IBM Connections)Stop the Intranet Schizophrenia (and Succeed with IBM Connections)
Stop the Intranet Schizophrenia (and Succeed with IBM Connections)LetsConnect
 
Chart Your Path to Product Leadership
Chart Your Path to Product LeadershipChart Your Path to Product Leadership
Chart Your Path to Product LeadershipBill DeRouchey
 
India quiz connect
India quiz connectIndia quiz connect
India quiz connectKaushik Saha
 

En vedette (20)

History of the Button
History of the ButtonHistory of the Button
History of the Button
 
THIRST
THIRSTTHIRST
THIRST
 
What the F**k is Social Media NOW?
What the F**k is Social Media NOW?What the F**k is Social Media NOW?
What the F**k is Social Media NOW?
 
SMOKE - The Convenient Truth [1st place Worlds Best Presentation Contest] by ...
SMOKE - The Convenient Truth [1st place Worlds Best Presentation Contest] by ...SMOKE - The Convenient Truth [1st place Worlds Best Presentation Contest] by ...
SMOKE - The Convenient Truth [1st place Worlds Best Presentation Contest] by ...
 
Doctor's Orders - Burn Your PowerPoints
Doctor's Orders - Burn Your PowerPointsDoctor's Orders - Burn Your PowerPoints
Doctor's Orders - Burn Your PowerPoints
 
The Brand Gap
The Brand GapThe Brand Gap
The Brand Gap
 
Directory Game Connection@GDC 2011
Directory Game Connection@GDC 2011Directory Game Connection@GDC 2011
Directory Game Connection@GDC 2011
 
Rod and Yoke Connection
Rod and Yoke ConnectionRod and Yoke Connection
Rod and Yoke Connection
 
Sweden Game Arena presentation for Game Connection 2015
Sweden Game Arena presentation for Game Connection 2015Sweden Game Arena presentation for Game Connection 2015
Sweden Game Arena presentation for Game Connection 2015
 
OEPS Project Overview for SUALL Council
OEPS Project Overview for SUALL Council OEPS Project Overview for SUALL Council
OEPS Project Overview for SUALL Council
 
An Actor Model in Go
An Actor Model in GoAn Actor Model in Go
An Actor Model in Go
 
2013 | ThirsT event bars and catering | Company presentation (Dutch)
2013  | ThirsT event bars and catering | Company presentation (Dutch)2013  | ThirsT event bars and catering | Company presentation (Dutch)
2013 | ThirsT event bars and catering | Company presentation (Dutch)
 
Death By Powerpoint4344
Death By Powerpoint4344Death By Powerpoint4344
Death By Powerpoint4344
 
Doodsoorzaak Pp
Doodsoorzaak PpDoodsoorzaak Pp
Doodsoorzaak Pp
 
Harry Potter Boekbespreking
Harry Potter BoekbesprekingHarry Potter Boekbespreking
Harry Potter Boekbespreking
 
General Drupal presentation in Dutch
General Drupal  presentation in DutchGeneral Drupal  presentation in Dutch
General Drupal presentation in Dutch
 
4 Ways to Make your Brain More Vibrant with Visuals
4 Ways to Make your Brain More Vibrant with Visuals4 Ways to Make your Brain More Vibrant with Visuals
4 Ways to Make your Brain More Vibrant with Visuals
 
Stop the Intranet Schizophrenia (and Succeed with IBM Connections)
Stop the Intranet Schizophrenia (and Succeed with IBM Connections)Stop the Intranet Schizophrenia (and Succeed with IBM Connections)
Stop the Intranet Schizophrenia (and Succeed with IBM Connections)
 
Chart Your Path to Product Leadership
Chart Your Path to Product LeadershipChart Your Path to Product Leadership
Chart Your Path to Product Leadership
 
India quiz connect
India quiz connectIndia quiz connect
India quiz connect
 

Similaire à History of the Button

The New Nothing (with notes) – Analog/Digital: Opposition or Continuum?
The New Nothing (with notes) – Analog/Digital: Opposition or Continuum?The New Nothing (with notes) – Analog/Digital: Opposition or Continuum?
The New Nothing (with notes) – Analog/Digital: Opposition or Continuum?Axel Quack
 
Interaction 13 - The Dream of the 90s Is Alive
Interaction 13 - The Dream of the 90s Is AliveInteraction 13 - The Dream of the 90s Is Alive
Interaction 13 - The Dream of the 90s Is Alivejasonbrush
 
The Dehumanising Effects Of The Computer Revolution
The Dehumanising Effects Of The Computer RevolutionThe Dehumanising Effects Of The Computer Revolution
The Dehumanising Effects Of The Computer RevolutionSara Rouse
 
Top 10 Best Gadgets Ever Invented
Top 10 Best Gadgets Ever InventedTop 10 Best Gadgets Ever Invented
Top 10 Best Gadgets Ever Inventedbensonwvdbrsiivy
 
Difference Between Western And Western Animation
Difference Between Western And Western AnimationDifference Between Western And Western Animation
Difference Between Western And Western AnimationLindsey Jones
 
Typewriter Apush Timeline
Typewriter Apush TimelineTypewriter Apush Timeline
Typewriter Apush TimelineCheryl Brown
 
A Day In The Life Of A Dj
A Day In The Life Of A DjA Day In The Life Of A Dj
A Day In The Life Of A DjKrystal Ellison
 
Animation time line presentation
Animation time line presentationAnimation time line presentation
Animation time line presentationhammodbz
 
Essay On Effects Of Technology In The 1940’S
Essay On Effects Of Technology In The 1940’SEssay On Effects Of Technology In The 1940’S
Essay On Effects Of Technology In The 1940’SMarie Smith
 
Technology by stefan allmark
Technology by stefan allmarkTechnology by stefan allmark
Technology by stefan allmarkhawesside
 
Life In The 1940S
Life In The 1940SLife In The 1940S
Life In The 1940SSue Ganguli
 
Alan Turing and the Programmable Universe (lite version)
Alan Turing and the Programmable Universe (lite version)Alan Turing and the Programmable Universe (lite version)
Alan Turing and the Programmable Universe (lite version)piero scaruffi
 
French New Wave And Poetic Realism Essay
French New Wave And Poetic Realism EssayFrench New Wave And Poetic Realism Essay
French New Wave And Poetic Realism EssayHolly Vega
 
Progression And Effect Of Photographic Abilities
Progression And Effect Of Photographic AbilitiesProgression And Effect Of Photographic Abilities
Progression And Effect Of Photographic AbilitiesSusan Kennedy
 
As media timeline. (1)
As media timeline. (1)As media timeline. (1)
As media timeline. (1)Joy Brett
 
What Is John Harrison Legends And Legacies
What Is John Harrison Legends And LegaciesWhat Is John Harrison Legends And Legacies
What Is John Harrison Legends And LegaciesMary Gregory
 

Similaire à History of the Button (20)

The New Nothing (with notes) – Analog/Digital: Opposition or Continuum?
The New Nothing (with notes) – Analog/Digital: Opposition or Continuum?The New Nothing (with notes) – Analog/Digital: Opposition or Continuum?
The New Nothing (with notes) – Analog/Digital: Opposition or Continuum?
 
Interaction 13 - The Dream of the 90s Is Alive
Interaction 13 - The Dream of the 90s Is AliveInteraction 13 - The Dream of the 90s Is Alive
Interaction 13 - The Dream of the 90s Is Alive
 
The Dehumanising Effects Of The Computer Revolution
The Dehumanising Effects Of The Computer RevolutionThe Dehumanising Effects Of The Computer Revolution
The Dehumanising Effects Of The Computer Revolution
 
The Art Of Art
The Art Of ArtThe Art Of Art
The Art Of Art
 
Top 10 Best Gadgets Ever Invented
Top 10 Best Gadgets Ever InventedTop 10 Best Gadgets Ever Invented
Top 10 Best Gadgets Ever Invented
 
Difference Between Western And Western Animation
Difference Between Western And Western AnimationDifference Between Western And Western Animation
Difference Between Western And Western Animation
 
Storia dell'informatica
Storia dell'informaticaStoria dell'informatica
Storia dell'informatica
 
Typewriter Apush Timeline
Typewriter Apush TimelineTypewriter Apush Timeline
Typewriter Apush Timeline
 
A Day In The Life Of A Dj
A Day In The Life Of A DjA Day In The Life Of A Dj
A Day In The Life Of A Dj
 
Animation time line presentation
Animation time line presentationAnimation time line presentation
Animation time line presentation
 
Essay On Effects Of Technology In The 1940’S
Essay On Effects Of Technology In The 1940’SEssay On Effects Of Technology In The 1940’S
Essay On Effects Of Technology In The 1940’S
 
Technology by stefan allmark
Technology by stefan allmarkTechnology by stefan allmark
Technology by stefan allmark
 
Me and media
Me and mediaMe and media
Me and media
 
Life In The 1940S
Life In The 1940SLife In The 1940S
Life In The 1940S
 
Alan Turing and the Programmable Universe (lite version)
Alan Turing and the Programmable Universe (lite version)Alan Turing and the Programmable Universe (lite version)
Alan Turing and the Programmable Universe (lite version)
 
French New Wave And Poetic Realism Essay
French New Wave And Poetic Realism EssayFrench New Wave And Poetic Realism Essay
French New Wave And Poetic Realism Essay
 
Most Influential Invention In History
Most Influential Invention In HistoryMost Influential Invention In History
Most Influential Invention In History
 
Progression And Effect Of Photographic Abilities
Progression And Effect Of Photographic AbilitiesProgression And Effect Of Photographic Abilities
Progression And Effect Of Photographic Abilities
 
As media timeline. (1)
As media timeline. (1)As media timeline. (1)
As media timeline. (1)
 
What Is John Harrison Legends And Legacies
What Is John Harrison Legends And LegaciesWhat Is John Harrison Legends And Legacies
What Is John Harrison Legends And Legacies
 

Plus de Bill DeRouchey

Design Careers in the Science Fiction Future
Design Careers in the Science Fiction FutureDesign Careers in the Science Fiction Future
Design Careers in the Science Fiction FutureBill DeRouchey
 
Designing Humanity into Your Products
Designing Humanity into Your ProductsDesigning Humanity into Your Products
Designing Humanity into Your ProductsBill DeRouchey
 
Language of Interaction IDEA08
Language of Interaction IDEA08Language of Interaction IDEA08
Language of Interaction IDEA08Bill DeRouchey
 
The Language of Interaction
The Language of InteractionThe Language of Interaction
The Language of InteractionBill DeRouchey
 
Conversations With Everyday Objects
Conversations With Everyday ObjectsConversations With Everyday Objects
Conversations With Everyday ObjectsBill DeRouchey
 
Learning IxD From Everyday Objects
Learning IxD From Everyday ObjectsLearning IxD From Everyday Objects
Learning IxD From Everyday ObjectsBill DeRouchey
 

Plus de Bill DeRouchey (7)

Design Careers in the Science Fiction Future
Design Careers in the Science Fiction FutureDesign Careers in the Science Fiction Future
Design Careers in the Science Fiction Future
 
Power of Why
Power of WhyPower of Why
Power of Why
 
Designing Humanity into Your Products
Designing Humanity into Your ProductsDesigning Humanity into Your Products
Designing Humanity into Your Products
 
Language of Interaction IDEA08
Language of Interaction IDEA08Language of Interaction IDEA08
Language of Interaction IDEA08
 
The Language of Interaction
The Language of InteractionThe Language of Interaction
The Language of Interaction
 
Conversations With Everyday Objects
Conversations With Everyday ObjectsConversations With Everyday Objects
Conversations With Everyday Objects
 
Learning IxD From Everyday Objects
Learning IxD From Everyday ObjectsLearning IxD From Everyday Objects
Learning IxD From Everyday Objects
 

Dernier

Central-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposesCentral-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposesmilalabial
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...Pranav Subramanian
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdfINTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdfphriedaoyigada
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
Materi dasar prototype dan figma .pdf
Materi dasar prototype dan figma    .pdfMateri dasar prototype dan figma    .pdf
Materi dasar prototype dan figma .pdfardanaadam1
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...Yantram Animation Studio Corporation
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 

Dernier (20)

Central-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposesCentral-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposes
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdfINTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
Materi dasar prototype dan figma .pdf
Materi dasar prototype dan figma    .pdfMateri dasar prototype dan figma    .pdf
Materi dasar prototype dan figma .pdf
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 

History of the Button

  • 1. Historyof the Button Bill DeRouchey
  • 2. Hello. This incarnation of the History of the Button was presented at SXSW on March 12, 2010. This slide deck is slightly different from the live presentation. The main difference is that the videos that were in the presentation have been translated here to stills as best as possible. Enjoy. Also, narration boxes like this are Bill DeRouchey extra notes to help fill in context where necessary and point out bill.derouchey@gmail.com where this version differed from @billder the live presentation.
  • 3. About the audio. If you’re listening to the audio, sorry about the bad quality for the first 12 minutes. SXSW somehow cut off the first 12 minutes. To make up for it, I had to slice in the audio from my FlipCam recording, which was better than nothing. If you’re not listening to the audio, then it doesn’t matter at all. Carry on.
  • 4. This is astory that spans over 100 years... As a contrast to SXSW which focuses so much on the Now and the Future.
  • 5. ... about how we got from here to here...
  • 6. buttons ... about how have changed how we understand our world...
  • 7. buttons ... about how have changed how ... think. we understand our world.
  • 8. Products Movies Advertisements Screens We’ll take almost an anthropological approach by looking at these items to examine the history of the button.
  • 9. 1910 1956 1984 2010 These were all movies in the original presentation. The simplest motion.
  • 10. 1910 1956 1984 2010 These were all movies in the original presentation. is just push the button.
  • 11. This was a movie in the original presentation (from Apple.com). We’re in a transition....
  • 12. This was a movie in the original presentation (from Apple.com). a transitiontransition.... We’re in a to Surface.
  • 13. Transitions are interesting... because that’s when our brains change.
  • 14. Generations of Interaction 1 Lever 2 Button now 3 Surface 4 Fluid We are currently in a transition from a button era to a surface era.
  • 15. Generations of Interaction 1 Lever 1900 2 Button 3 Surface 4 Fluid We should look to the previous transition to understand today.
  • 16. We are a bunch of smart monkeys. We figured out how to use the objects in the world around us to augment our human motion. Bones into shovels. Sticks into rakes. Iron into gears. We love our tools.
  • 17. For example, a gun can simply be understood as throwing a rock, a tiny rock, much faster and with greater accuracy.
  • 18. Pressing on the keys of a piano simply triggers a hammer hitting a string. Motion is augmented.
  • 19. You can see the Action. In the mechanical era, you can see action happen, see how one motion affects another. You can follow the results from action to result.
  • 20. Levers scale motion. Scaling is the mechanical age.
  • 21. Compressed Time Major advances in technology actually change how we perceive the world. For example, train travel compressed our sense of time between faraway places.
  • 22. The telegraph changed our sense of connection over distance. Instant communication across hundreds of miles for the first time. Compressed Distance
  • 23. But the button meant for the first time, the result of a human motion could be completely different from the motion itself. Abstracted Motion
  • 24. The motion Push does not scale to the result Light. This abstracted interaction with technology represented a new way to comprehend the world.
  • 25. Buttons abstract motion. Abstraction is the electronic age.
  • 26. What was the first button? This might be the most common question people ask me.
  • 27. The flashlight was the first simple everyday button. It revolutionized our sense of light. What was the first button? 1898
  • 28. Buttons enter Daily Life
  • 29. George Eastman of Kodak introduced cameras for regular people. 1890s
  • 30. Eastman used the phrase “You Press the Button, We Do the Rest” to show how simple cameras can be. Button = easy. 1890s
  • 32. As the electricity grid expanded, homes installed lights and simple pushbuttons to turn the lights on and off. 1910s
  • 33. Sidenote: An editorial cartoon from 1911 depicting a dark vision of the future. Surrounded by technology, lazy, pushing buttons. For a similar dystopian view, read the 1910 short story “The Machine Stops” from E.M. Forster. 1911
  • 34. “The Opera Delivered to Your Door” = Pandora “The Observascope” = webcams Of course, all with a robot servant!
  • 35. The next major tech innovation was the radio, sending live audio from a distance. The opera really now was delivered to you. The radio. 1920s
  • 36. 30 million radios sold by 1938. This was their Internet boom.
  • 37. But tuning to your favorite stations almost required a scientist mentality. Until 1938 when radio presets (buttons) exchanged the emphasis on “tuning” for “returning.” 1938 Radio presets.
  • 38. Essentially, radio presets were the first notion of “saving” in technology. Save your favorite station. 1938 First notion of Save. Radio presets.
  • 40. 1939 During the Great Depression, people looked to a better future, capped by the World’s Fair in 1939. New York World’s Fair
  • 41. 1939 Technology was heralded as the emancipator of leisure. A shrine to the button?
  • 42. Movie from 1940 depicting a vision of the future. With robots. 1940
  • 43. Roy’s Robot Repair is helping this concerned woman with her robot. 1940
  • 44. She controls her robot with buttons. Roll-Oh can even fix a furnace. 1940
  • 45. When fixed, Roll-Oh fetches the nice repairman’s hat. 1940
  • 46. 1958 Visions of the future continued, including this Monsanto home, promoting both the wonders of plastics and pushbuttons. Monsanto House of the Future
  • 48. The happy wife pushes buttons to access hidden compartments. 1958
  • 49. The happy wife pushes buttons to access hidden compartments. 1958
  • 50. The happy wife pushes buttons to control her home. 1958
  • 52. In the 1950s, the promise of pushbutton technology became available to a wide variety of consumer items, providing a new luxury for the middle class.
  • 53. And in nearly every case, the phrase “pushbutton” became an adjective communicating modern, luxury, advanced, new, easy. 1956
  • 54. 1958
  • 55. 1960
  • 56. 1959
  • 57. 1961
  • 58. Now there’s a woman in control of her laundry. 1959
  • 59. So easy... even a woman can do it. And also in nearly every case, women were used in ads to add the subtle message of, this new technology is so easy to use, even a woman can use it.
  • 60. Picture the classic Crossing the Chasm diagram of early adopters vs. late adopters. “Pushbutton” meant that the product was simple enough for late adopters to now buy. Buttons cross the chasm.
  • 61. This practice of using “pushbutton” continues today, but only in the seamier parts of the web. Get rich quick!
  • 63. Join the Push Button Empire!
  • 64. Returning to the living room, the remote control has become the classic example of this pushbutton era. 1959
  • 65. Because for the first time, regular people could control an object from a distance. No wires! First control from a distance 1956
  • 68. After WWII, we had automated war machinery so much that global nuclear annihilation was perceived to be as easy as pushing a button. And it may have been. Who has theirfinger on the button?
  • 69. Raising a generation on fear. 1950s
  • 71. At the same time, engineers were building complex machines controlled by rows and rows of switches and buttons. We were learning to automate.
  • 72. At the same time, engineers were building complex machines controlled by rows and rows of switches and buttons. We were learning to automate.
  • 73. Only a select few could understand these machines, could use these buttons, using a highly specialized language.
  • 74. Only a select few could understand these machines, could use these buttons, using a highly specialized language.
  • 75. From “That Touch of Mink.” Doris Day works at Univac. 1962
  • 76. She’s fed up at working in this automation job. 1962
  • 77. So she slams the machine. 1962
  • 78. And leaves the machines running. (Note the Univac in the background.) 1962
  • 81. Humpty Dumpty pinball machine was the first to use flippers. 1947 First pinball flippers.
  • 82. First mechanical game where you can interact with the ball in play to keep it in play. Beginning of a new era in gaming. 1947 First game interaction?
  • 83. Generational 1977 Icon This Atari joystick revolutionized gaming in the home.
  • 84. Shape as Play 1978 Experimenting with the shape of the button itself.
  • 90. Dexterity in pushing buttons now became a prized skill, generating an entire industry.
  • 92. Before this, buttons were physical things. The Macintosh in 1984 introduced to the general public the idea that buttons could be virtual.
  • 93. The virtual button still needs a physical button. 1964
  • 94. The virtual button still needs a physical button. 1984
  • 95. This concept was so new that Apple needed to educate people simply how to use a mouse. They took out 39 pages of advertising in Newsweek to essentially publish a user’s manual. Education through Advertising 1984
  • 96. Notice the incredible detail to communicate the basics of something we take for granted. Education through Advertising 1984
  • 97. Notice the incredible detail to communicate the basics of something we take for granted. 1984
  • 99. With the web, “buttons” could become anything. They didn’t need a specific shape that said “I’m a button.” They could be blue text and underlined. 1996
  • 100. Images, text, anything is now actionable. As an example, the next page shows everything that can be acted upon. Compare it to this page.
  • 101. Nearly everything can be acted upon. This has changed how we perceive the world around us. All items can have deeper connection.
  • 102. We even understand that simple gray text is actionable, simply from its location to its neighbors. We assume that “Work” is a link. 2010
  • 103. But would we assume that here?
  • 107. The poster child of touch.
  • 110. Where are we now?
  • 111. Buttons don’t need... form borders contour shape words ornamentation
  • 112. ... and yet, we attribute to them ease process magic control play simplicity automation
  • 113. think about We now objects with depth and time, instead of just static things.
  • 114. We are approaching a time when anything is interactive.
  • 115. Gesture interaction game designed by Ziba for Li Ning in China.
  • 116. Imagine somebody 100 years ago encountering this device.
  • 117. Imagine somebody 100 years ago encountering this device.
  • 118. Generations of Interaction 1 Lever 2 Button 3 Surface soon 4 Fluid The next generation will feature dynamic surfaces.
  • 119. Dynamic tactile surfaces will create disposable physical interfaces.
  • 120. If it was rumored to be in the iPad, then the technology must be only a few years away.
  • 121. Research on dynamic tactile surfaces from Chris Harrison and Scott Hudson at Carnegie Mellon University.
  • 122. When buttons can essentially have a disposable physical form, we can build interfaces into any surface.
  • 123. Meaning our entire surroundings can be interactable. Imagine the generation that grows up with that.
  • 124. And the next generation?
  • 125. Imagine growing up in a world where touchscreens and interactive gestures are a given. How does that affect your brain processing?
  • 126. Imagine growing up in a world where touchscreens and interactive gestures are a given. How does that affect your brain processing?
  • 127. Imagine growing up in a world where touchscreens and interactive gestures are a given. How does that affect your brain processing?
  • 128. The button has been a 100 year transition technology from the mechanical age to the truly electronic age.
  • 129. The button represents how we interact with the objects we create.
  • 130. And that’s why the button is the most influential yet least appreciated innovation of the 20th Century.

Notes de l'éditeur

  1. Researching for the last four years or so. The result of moving from working on web to working on products.
  2. SXSW mostly web. Why look back? We need to reach back into our history. This is where all of our interface conventions were born. We owe our careers to buttons.
  3. SXSW mostly web. Why look back? We need to reach back into our history. This is where all of our interface conventions were born. We owe our careers to buttons.
  4. SXSW mostly web. Why look back? We need to reach back into our history. This is where all of our interface conventions were born. We owe our careers to buttons.
  5. How did we evolve from the crudest interactions to products like the iPad in a little over 100 years?
  6. how we cognitively understand objects, interactions and the space around us
  7. blah
  8. And how we’re going to do this is take an anthropology approach by looking at items from the last 100 years.
  9. blah
  10. blah
  11. blah
  12. blah
  13. blah
  14. To understand our current transition, it’s helpful to look back to the last major transition, which took place about 1900 when we first made the leap from the mechanical world to the electrical world. But first, let’s step way back.
  15. We are a bunch of smart monkeys. We figured out how to use the objects in the world around us to augment our human motion. Sticks into rakes. Bones into shovels. Iron into gears.
  16. Shooting a gun is nothing more than throwing a tiny rock really really hard with much better accuracy.
  17. Pushing a piano key is really just hitting a string. It’s all about scaling.
  18. With machinery, you can see the action happening. You can follow the action to the results.
  19. But some pretty interesting developments happened that changed how we think about the world around us.
  20. Railroads compressed our sense of time. Travel that use to take months could now take days.
  21. Telegraphs compressed our sense of distance. We could communicate from afar for the first time. The Crimean War was the first war fought remotely in 1853.
  22. But buttons did something different. They abstracted motion. They helped us made the cognitive leap that the action we take can lead to a radically different type of reaction. The motion that we put into an interaction leads to a categorically different result. This tweaked our sense of meatspace.
  23. The opera comes to your door. The observoscope. Home News Service. Events as they transpire.
  24. The opera comes to your door. The observoscope. Home News Service. Events as they transpire.
  25. The opera really did come to your door.
  26. The opera really did come to your door.
  27. Roy’s Robot Repair
  28. Roy’s Robot Repair
  29. Roy’s Robot Repair
  30. Roy’s Robot Repair
  31. blah
  32. Gold before chloride?
  33. “That Touch of Mink.”
  34. “That Touch of Mink.”
  35. “That Touch of Mink.”
  36. “That Touch of Mink.”
  37. “That Touch of Mink.”
  38. Before this point, buttons had all been about serious business. Getting work done. But of course that changed too.
  39. Humpty Dumpty. Pinball Hall of Fame in Las Vegas. Tim Arnold.
  40. This is the era where I lost a lot of quarters.
  41. Dexterity is a prized skill. Pushing buttons for entertainment has become an industry all on its own. Design schools. Competitions. Movies based on games. ScreenBurn here at SXSW.
  42. Along another track, buttons lost their physical nature and become more of a concept than a physical thing. They went virtual.
  43. Douglas Engelbart invented the mouse.
  44. 20 years later, Apple introduced the mouse into the mainstream.
  45. Apple bought all 39 pages of advertising in November issue of Newsweek.
  46. This is only 26 years ago.
  47. Look at how much effort they are making to describe what a button is, how to use it.
  48. The idea of what’s interactable breaks down even further with the web.
  49. Doesn’t matter if it’s a word, a box, an image, something floating. Essentially anything now can be a button. In fact, let’s hide what ISN’T a button on this screen.
  50. A LOT of instruction for physical interaction. Coins In. Coins Out. Cash In. Cash Out.
  51. blah
  52. blah
  53. Imagine someone encountering this device 100 years ago. This was designed by Ziba for a Li-Ning flagship store in Shanghai.
  54. Imagine someone encountering this device 100 years ago. This was designed by Ziba for a Li-Ning flagship store in Shanghai.
  55. Imagine someone encountering this device 100 years ago. This was designed by Ziba for a Li-Ning flagship store in Shanghai.
  56. blah
  57. blah
  58. blah
  59. When I was this age, interactive still meant putting baseball cards in your bicycle spokes. Pong came out when I was 7. Imagine the worldview this kid will have when that is the new normal.
  60. When I was this age, interactive still meant putting baseball cards in your bicycle spokes. Pong came out when I was 7. Imagine the worldview this kid will have when that is the new normal.
  61. When I was this age, interactive still meant putting baseball cards in your bicycle spokes. Pong came out when I was 7. Imagine the worldview this kid will have when that is the new normal.