Alan Kay CS1 talk at UCLA (2010)

From Viewpoints Intelligent Archive
Revision as of 21:59, 6 December 2017 by Ohshima (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search
let me introduce professor LDK professor  LMK is best known for pioneering
work on  object-oriented programming language
we've done graphical user interface  design and
for coining the phrase the  best way to predict
the future is can be  invented into
in 2003 prevention Allen  can receive
receive a ACM Turing award
it considered to be the Nobel Prize of  computing
from work on object-oriented  programming that is welcome
question ok  thank you
ok the ground
rules here are  asked questions
whenever you have one  because
these classes go quickly just
hink of all the money you're paying for  hardly getting any
thing in a in an hour
  so programming languages in
programming  one of the problems of talking
about  this in general especially in one class  is
that there have been several thousand
  programming languages designed and
  implemented over the years at any given  time since
the early 60s
there have been  somewhere between 150 to
200 languages  in standard use and
these languages are
  rather different from each other in
  certain ways and rather similar to each  other in
other ways and so it's very  hard to come up with interesting
  generalizations and
what we're really  talking about
here is programming and  programming
is the simplest
thing to  describe its we do something in the  computer
does something and if it does  what we wanted
it to do both of us are  successful
programming languages are  usually the vehicle
for this and you
can  think of user interfaces
as kind of an  impoverished
kind of programming  language
they used to be  richer and
that the
you did in the user interface who are  part and parcel
of the kinds of  programming you could do and I'm going
to show you a few of those things today  so I thought
what I do is first to
just  look at a couple of ideas in programming
  and programming languages and be able to  do
it so I don't have to explain
some  programming language you've never seen  before
I'm going to take a programming  language that
is currently in use by  about 3 million children
called etoys  it's the
parent of another widely
used  programming language for children called
  scratch and
some of the same people  worked on both of those
and so I'll  first take a look at what that
  experience is like and so
the basic idea  in this
style of doing programming it's
  now has a name called
live coding but  fact
live coding goes all the way back  to the early
60s it just never was in  the style of
the punch card unix  approach
black screen
by terminal way of  doing things so
the idea is that you
  just make
things in a variety of ways  and the computer responds
to them  there's no no visible compiling or
we're  editing so pick
up some paint one of the  things
that kids like is to
do things  that adults do so
you can ask
them why  don't you draw a car
from the top view
  put on some headlights
and we were a disney for
a while and so  the thing we learned at disney is you  must
always put on some specular  reflections
like that and
this this  gives you a graphical object
and it does  the kind of things you'd expect with a
graphical object I can give it a name  here i'll call
it car and what's  interesting about this object
is it has  another view this is the symbolic
view  of this object and
so here's a
property  of it called the heading of it says
the  heading is 0 and if i
rotate the car you  can see it's showing
me two degrees from  north minus
and plus and this is  interface is
reflexive so if i go in  here and
right so everything is by
  connected here and also
here here's a  behavior
of the car turn by five if i  click it
it turns the car if i drag it  out
it makes me a little script if
i get  the script is now just infinitely
  looping and
if
i pull
out another thing  each time I'm doing
this is the there's  a compilation
going on but it's  sub-second so
it's actually compiling  code underneath
it and I can
actually  even drive my little car
the zero makes  it go straight
but in
fact it's hard to  drive the car this way
and it's a little  bit like kissing your sisters
we really  want to have a
steering wheel so
we'll just
make a steering wheel
and  we'll
call it wheel and
again we look  inside here we see
same kind of audit it's just got a  different costume
on it and again it has  a
heading and
I get
the same behavior  from it but notice that
we got the car  to turn by
changing this number here
and  that's kind of an invitation of picking  up this value
and dropping it into the  script and
now
we get to do this
so  you're just starting out
here but let
ell you if you program in the language  here at UCLA that
doesn't allow you to  do this little demo right
off the bat  something is wrong because
we're looking  at something that goes back 40 years
  this is just because you don't know
what  you're getting into here I'm just
o show you that there doesn't have to  be a compile
phase it doesn't have to be  edits of files can
all be done  lickety-split
okay so I've got a little  car
there and the other thing I can do  is
make lots of them
so I'm going to  play a game
got a red car and a blue car  and
I'm going to make them small
can you  see
them blue guy and the red guy there  and
the two programs i'm going to run  here
this little kids system has  automatic
multitasking as many tasks as  you want
so I'm going to say
go forward  by one and turn randomly
and this one  says
do this guy and
  if a
blue guy sees touches a red guy  then
make the blue guy red so this is  like an infection
programming and so if  i say go
at the top here i'm plotting  the
infected against the non-infected  you
can see that the big
open space here  that the village is is kind
of like a long time constant the
probability that the two guys are going  to hit is fairly
low so i'm going to get  that behavior but
what
about a thousand
all
of a sudden I get that so it's  another thing
language doesn't allow me to make  objects
by the hundreds of thousands and  run them in parallel then
worry about what kind of language you're  programming it
so the kids with this  little program that they wrote
there's  no mystery here they
wrote this program  so now they can
explore by saying well  okay
how about 200
and again the
  sparseness acts like a longer time  constant
between infections but
eventually
they all died
and
we get this
longer thing so the kids will say okay  well
how about 80
so now they're starting to root for
the  ones that are maybe
nope
so this is kind of an experiment in  system
dynamics for 10 year olds
and  it's
something that many parts the world  don't
actually understand on any terms  because
this first curve that i showed  the
one that went up rapidly is like  typhoid and
so if this last one was a  disease what
would it be like what these  things would it be
blurt it out
let's
ee it's a disease that's already killed  100 million people
yeah come on
remember  you're in it you're right UCLA now
yeah  so
why does it kill that many people  when
typhoid is much much more virulent  the
answer is unless you know
that a  contagious
incurable deadly disease is  always
going to kill everybody off no  matter
what the time constant is you're  not going to do
anything when it doesn't  look like anything's going on
remember  people are also being born so
for a  while when AIDS is doing its work the
  population is actually still rising and
  if you don't happen to know this
feature  of system dynamics you
might just ignore  it or say it's
just for minorities or  something like that then
all of a sudden  you've got a majority
of your population  infected okay so that's a
little thought  experiment that children can do
it's
important because if you think  about what is it that we need
to know  today it's not so much knowing
that two  plus two equals four or how
to compute a  tip
for a waiter actually has to do
systems dynamics because the world  particularly
biologically is more  connected in more ways
than it ever has  been before and also
our
people in  Congress in Washington could
do well to  do a few of these experiments because
  they'd actually have some sense of how
  unstable systems are
and you shouldn't  monkey with them
okay so back back here  we'll we'll
turn this guy off and I got
  to two other quick little experiments
  here first one
is to make a little robot  car now that we made one that can be
  driven and for that I will need a track
  so I get
sort of a brown track
here and
robots
need sensors so I need to put a  sensor
on this guy
so I'll just draw one  in here
like this
we'll use this to track
where  are we where we actually are and now
we  need to make a program we can think out
  this program first so one of
do with children is get them to go  around the wall over their classroom
  with their eyes closed and
the way to do  that they soon find out
is you go until  you hit the wall and then you turn
but as soon as you lose the wall you  have to go back
into it you keep on  going
if you don't do that right away  you
may lose where the wall actually is  so
right that that little
program we
  want the car car is always going to go  forward
so I can get that we're going to  test whether we're
touching the wall or  not here's
a test that will test
let's
  see how about the
cars blue
color sees  the walls brown
color and then we have  to figure out which
way to turn here
ok  I'm going to
put in two turns by fives  but let's think it through
so if we  don't have the wall here
which way do we  want to turn
five or minus
55 ok
so  that's no and so for
yes we'll just take  a guess and try minus 5
here and we'll
okay who can see what
the flaw with this  program it is
somebody tell
me
well  don't worry about efficiency
we aren't  humans
aren't efficient but we're smart
what's the condition under which it can  lose this
wall
it's going to do with the  Sun but
if I made a sharp turn right
  it's got a fixed radius to get back
so  probably when I lose the wall I
might  even want to stop the car slowed it way  way
down to give me a real chance of  contacting
the wall again okay
so that's
  a little experiment in making
a feedback  thing now what I want to do is to
turn
  this thing into a wriggly worm and to
do  that I
want to make a script that is  going to change
its
shape so here's my  little thing
it says car look like  something but
I don't have anything to  make it look like
so I will
somebody
now somebody isn't talking
ok
so now I'm  going to draw
a couple of pictures for  the wriggly worm part of
this
will
make  a blue top and
maybe a brown bottom
here  and just
to test this out
this one is  called sketch one so
if I say do it okay  so that worked
and but I
need another  one in order to make it wriggle
so i  will
make
a twin to it right here
go  with the wriggle the other way
ok
now i  need to move back and forth between each
one of these and to choose which one of  these i'm
going to need something that  we might call a little data
structure  here i'm going to
now i'm
going to look again see all of  the objects here
have the same kind of  user interface
and going to look down  here and see oh yeah
here's here's the  cursor here's one that
says the holders  player at the cursor
so i'm going to put  that in there and
here's the cursor
  control so i'm going to toss that
in  there and I'm going to say what I want
o do is just increase the cursor over  and over again and
so now I'll start  this
script up and you see what it's  doing
here ok now we could have put
that  in as a feature for the children but
hen
the children wouldn't understand  how to do animation so
trying to teach somebody something you  don't want too many features
you want  them to actually do the programming
  themselves it meanwhile the children  have
forgotten about these other scripts  that are
there so I could turn on
this  one and drive the
drives a little worm  around
or
what
about this one
okay so
okay so that's
kind of simple  programming and
the other thing that you  want to be able
to get a handle on  pretty early in your programming
career  as meta programming and
meta programming  in this case
means I want to I want to  make another language other
than etoys  and I'm
going to do it for the particle
  system kinds of stuff
so here's the
  these are now eat I objects in
there  these are the scripts
for the whole  interpreter I'm going to
use the animate  remember the animation thing so
if you  know a little bit about program counters  the anime
animation system is rather  like running a program counter
along  when you're doing animations what you're  doing
is saying display the the guy
  that's that's there in this case
we're  going to execute instructions and so
I'm  actually going to turn on the eval
here  you can see it
may be a little quivering  a little bit here it's dying
for some  input and then the
the instructions are  going
to be implemented using these  scripts which have already
written and  now I just have to build
the instruction  and
so this one's is a test that
says if  you can move this
one says then move  okay so
now it's executing that  construction and this
one says if
a blue  guy hits a
red guy then make them both  red
let's see if we're lucky here
yep  okay
so programming it and again
when  you're when you're taking that java  class
and you spent the first couple of
weeks not really writing a program yet  think
about what's like to write another  programming language in
java should be  really
easy  but it isn't okay
so
so
f the theories about designing  programming languages
is because
  children are part of our world
and  children grow up in to be being us
we  should be able to have them be able
to  start learning how to program this
is  we're learning how to program and
then  if you do that well the
stuff that  children find easy
and powerful or  actually clues for
how to design a  programming language yourself
okay and  so what we've been looking at
here is  here's computer memory and
down a
  flyspeck in
the machine is actually some
  logic gates on a chip
one corner of the  chip
and
round it is nano code
microcode  on
the chip itself and
that might be an  86
architecture kind of chip but most of  the chips are done
the same way there's  some
simple logic like this is the  arithmetic is
our registers the  arithmetic unit and
so forth then it's  made into
a slightly more complicated  processor by putting
a lowest level of  programming they're
in pretty elemental  terms that's not always easy to
write  these low-level
programs and then
nobody  wants to program in that
so in this case
what we're looking at is a virtual  machine
coated
ultimately in these terms
  that makes the computer
look like a  small talk machine and at
this level  there's an area on there
manifested where the display is going to  go
  and then in that
we write a development  system
you still haven't seen yes
I'm  not going to
but thank you for the  thought that's
too complicated small  talk is a programming language that's
  all we need to know it has a development  system
that's written in itself
and the
  e toya system that you saw which
is  putting up this slide here
is written in  small talk and
then I just
made a little  interpreter in the
etoys machine for  doing the rule-based particle
system  stuff and this is a very typical
way of  going about handling
problems it's not
  the only way some
people like to program  down here and write tons
of programs to  deal with the very same problems another
  way of doing it is fine languages that
  fit the problems gracefully and then the  amount
of code you have to write to get  to the next level is
not that large and  all
of this is kind of an example of
Turing's idea of
being able to simulate  any kind of mechanism on
a relatively  simple mechanism
that has a few pieces  of logic in a fair
amount of memory okay  so
that's the kitty world
now let's
a look at the adult world where we're  going to go from
programs that have tens
of lines in the kiddie world but can  still do interesting things
to adult  programs which tend to have
zillions of  lines and are
surprisingly weak and in
order to come up with a metric for this  I'm going
to use a metric of lines of  code
it's not the only metric you could  use but a
line of code is something that  a programmer has to write so
it is one  kind of unit of work and it's also unit
of space  so
a 400-page book has 20,000
could
be English but it could be code
  could be in machine
code it could be and  see it could be in Java and
a foot of  books is about
300,000 lines and a meter  of
books stacked up like this is a  million
line so that's a good metric  million lines of
code per meter and  stacked up books and
the Empire State
  Building is twenty-two
thousand books  high and
440 million lines of code
right  so
if you've ever heard anybody heard of  any programming systems
that have 400  million lines of code
yes though come on
yeah yeah take a look
at our government  sometime in
fact if you look at your own  little
only the laptop
if you happen to  be running Microsoft the operating
  system is about 120 million lines of
code remember there's just the operating  system it hasn't
done anything for you  yet just sitting
there and then  Microsoft Office is over
a hundred  million lines of code
so that's
220  million lines of code it's about
seven  eleven thousand books of code
anybody
  ever read all that code no way
very few  people who read
it all have read eleven  thousand books of anything I
can  guarantee you if you read it all
not going to read eleven thousand books  of code so
most of the code has never  been over
viewed by any single person or  even any single
group in fact much of  the code in there
is code that isn't  even run but
out because they don't know whether it's  run or not
and this is it this
is a  problem on the other hand
the looking at  it from
the standpoint of writing code  the
when you look at the actual features
  you get for this 220
million lines of  code it doesn't seem like it should be
  should take 220 million lines of code
  just shouldn't back the first time  around it
was done it Xerox PARC did  about
half of this and it only took ten  thousand lines of code
so something  happened some
kind of explosion of  complications
and complexity and here
  just to make you feel better I located a
  large financial products company whose  name
I will not put here that has more
  than 400 million lines of code in its
  primary offerings to its customers so
  this is what they are actually  maintained
  and you can tell they're a little  old-fashioned
because their user  interface is given in terms
of screens  which harks back to the
mainframes they have a hundred and  seventy thousand
screens they have to  deal with and
that's about 20,000 books  or
almost an empire state building
worth  of code
however if you're looking
for a  job you came to UCLA to learn to
program  and get a job it's just this kind of  stuff that
you actually have to learn  about because that is what
business is  mired in right now this is
hiring people this is why they're crying  for programmers
not to do better
but  just to take care of the mess that is
  already there think about that
okay
so  I'm going to stick
to I'll show you a  couple
of examples in the time that's  left of what might be done
part of personal competed these several  hundred
millions of lines of code
okay  so let's take a look at
this problem  from a slightly different perspective
over
here we've got some gates
over here  we've got a
problem this is what
we need  we need to do something over
here and  the question is is what is it going to  take us to get
from there to there these  days and
so in terms of machine code
  lots of the kinds of things I'm
about or literally billions of lines of  code because
machine code is written one  instruction per line of code
and maybe
  see gives
eight to ten machine
code  instructions per line of code so maybe  something
that would be billions would
  be hundreds of millions in C
  and we can imagine
a higher level  language
than C not
the job is that much  higher level language
higher level in C  but could
imagine something higher level  you can imagine something
higher level  imagine something it might do a lot
of  these tasks in just thousands of lines  of
code and the question is why
do
we  stay here down at the gear level for
  most of the programmatic that is still  done today
and there's
hot not a lot of  the organization
of code at this level  which is a little bit more like
the way  biology organizes itself
almost none of  this still
being done
ok so the
  programming effort comes down as we go  to higher and
higher level languages
but  computer
science has not actually been
  up to the challenge of
putting in the  amount of invention that's necessary
to  make programming systems that do this  amount
of work for us so we can think of  and in
between is just a lot of work for  any kind of
because there's packaging this  documentation
there's debuggers there's  an
enormous amount of work that has to  be done and
the idea is that with more
  work which gets tougher as you come this
  way you actually reduce the general  programming
effort so this is not  popular so virtually
all of the  programming in business in the u.s.
  today is done at this level still and
this is a level that is really not  different from the
level of programming  in the 60s almost
nothing has changed  new languages
have come along but they  have not up their level in
any  significant way
but
  just to go against the tide here even
though you're going to be studying a lot  of this stuff here
I just want to make  you aware of these
ideas down here which  if you're interested in research
and in  making things better you might poke
your  head in two now
what's funny about  history is
that there are people who are  absolute
geniuses who transcend
the time  in which they live so
50 years ago
there  was no computer graphics
this is the guy  who invented computer graphics
and he  also invented
object-oriented design
  systems so
he actually did the work in  62 and
wrote it up in 63 so this is  still
the 50th anniversary of this I  thought you'd like to see
what this very  first
interactive graphic system looked
  like and what it could do now the first  thing you have to
visualize is this guy  is sitting
here with a pointer in his  hand a
light pen but he's in a computer  that is about
eight times maybe 10 times  the
size of this room it
was close to  the size of at least the first franz
  hall building it
had its own roof it was  the
building and it was
computer and from three o'clock in the  morning to six o'clock
in the morning  they let this one guy play
around with  it and so
here's what he did and by the  way this is not actually a computer
  display it just was an oscilloscope that
  put up spots so the first thing he had  to
do was to write programs that would  make lines
and arcs and and so forth
and  about a third of the capacity
of this  enormous machine was used just to make
a  simulated graphics display because there  were
no graphics this place okay so
this  will give you an idea
  so it gets
some ink
and
he just sketches in this flange  because look at he's pointing
at it now  and he's giving it a constraint
to make  everybody mutually perpendicular and
  what you saw there was sketchpad solving  the problem
for him all
right so this  way you program this system
was by  telling it what you wanted
to have true  and sketchpad and figure out how to have
it be true same idea here make these two  guys parallel
now the constraint is
  collinearity put
these lines down these  dashes I'm putting in here
down on top  of
the guidelines
now he says
okay let's make the  guidelines transparent and
now we've got  a hole in the flange and
you notice it  has continued
assuming the first  clipping window ever
done is that  actually the drawing is
done on a sheet  of virtual paper about a third
of a mile  square now he wants
to make a rivet
he's  going to use the center here for
and now he's going to do the same trick
  he's going to say to these guys take
these guys to make them all mutually  poopin perpendicular
that's going to  drag the crosspieces
that's going to  drag the
top of the rivet now he's going  to show
I'll
start off with different  initial starting conditions
till get something that obeys the  constraints
that i gave it now i could  have put in absolute numbers in
there  you could have putted ratios
this is why  it's called sketch pad
the idea is you  should be able to work
quickly get a  rough idea of it
and then tell the  computer the rules that if
they were  solved was completed
okay now he's
  showing that what he drew is
not just a  rivet
but it what it's what we call
class in an object-oriented language  which
he called a master so what he
there was the master drawing of a rivet  and
what he's manipulating here is an  instance of
so
now he's showing yeah
I can make more  instances of the rivet
and I can make  them different
sizes and so forth
but he  forgot that cross P
so he goes to the  master makes those guys transparent and  we
can see the rivet feels the instances  of
the rivet feels those things then
the  last part of this demo
is
that he can  take
anything that he is
constructed and  make it into a master so
now this is a  master drawing of a flange
with a rivet  in it and now
he's
making instances of  those
ok so
this is a yes go ahead
yeah yeah
in fact on the larger movie  which you can find online
you can see  the sheet is populated with lots
of  different things on it yes oh
okay okay  so
so
you have to realize this is a PhD  thesis this is done in
one year by one  person and
what the contributions
were  is first interactive
computer graphics  object-oriented
design structures
  constraints for
programming so you  didn't program it using
sequential code  at all and
one
of the great final
things  he did was to show how you could make a
  bridge simulation without
sketchpad  knowing about bridges ahead of time
because the whole point of this thing  was that sketch pad
know ahead of time what you were going  to try and do in
it the ideas you should  be able to do everything in
fact the all
of these drawings were made by sketch  pad and the
the text here these each
text figure is actually a drawing and  sketch pad so
there's a master for f and  everywhere
there's an F there's an  instance of it so the whole system
was  done and this thing and I wants to ask
  ivan how could you have done computer
  graphics object oriented design and
constraint based programming
all by  yourself in one year and he said well I  didn't know
it was hard since
then ok so  the bridge there's
no movie of the  bridge because it took the
supercomputer  back in 1962
about 20 seconds for each  time step
on it because of the computer
power of this computer the size of a  building was about
card  today
but
to
celebrate the anniversary  of
this system a couple of the guys at  viewpoints
Burke freudenberg and Yoshi  Yoshi ki o Shiva
made a version of this
  of this bridge
sketch n and
we put in  the twinkling there
so it looked like  the display back then and
move
things in you can turn on gravity
ou can hang
away from it
even when it  settles down
it has
a really settle down  if I turn on the decimal points here
see  if still wiggling
just like wheel  bridges
do and
I can tenderize
me to  watch what happens when I stick
this  beam in here take a look
at the numbers  of the stress and strain around it
when  I drop this guy in here and
notice the  sky over on the
Left felt that ripple  across
yeah
so one
of the main things that's  got people
going from sketchpad most it  was too
hard for people to really know  what to do
with but one thing they were  sure about was they
needed better  looking display so here's the very
thing rendered with them with a modern  display and we
can do a few more tricks  like
we can give letters wait
okay
and we programmed this a little bit  differently than
fact we've done this  several times now one of the
students in  this class last year Matthew Goldberg
  what did
an internship with us and
did a  different version of
this did a nice job  of
it we programmed it
up in terms of  three
constraints not
constraints that Ivan used but a  different kind
of constraint for  instance this one looks suspiciously  like it
might have something to do with  gravity so
this is way to think of is  this the three line
program here so if I  turn this off
so all we've got left is  the spring
tension here should
all know  laut which it does so we'll turn
gravity  back on again
and this
bottom guy is the constraint  for
these pins so
this bridge is pinned  together and if I turn
off the pin  constraint that's holding everything
  together in this simulation
yeah so remember
all those costumes  that's all that bridge
was and we can  repurpose those costumes
into something  else like the
user interface of this  system I'm giving
the right so this is a
  system that we programmed ourselves at  viewpoints
and it's a system
I'm giving  this talking I'm not obviously not using  PowerPoint
because you can't program in  PowerPoint and
I'm using it to show you  i'm
going to show you one example  because that's all I have time
for
and  that is how the graphics in this
we're programmed now
usually the  graphics in your personal computer are
about half a million to a million lines  of code to
do all of the
compositing and  so forth
and what we're going to look at  here is just take a look
at the  rendering part
of this a render of being
  able to paint a pixel with the right
  shade so Dan a meringue here is a  graduate
student at UC San Diego works  with us came
up with this formula so  it's a nice little piece of math
to  represent it here's a
programming  language that is as close to the formula  as
possible it's about twice the size of  the
math but it actually runs and it  handles all rendering
stuff done like
  this and
I'll just to give you
now we have this
flow of stuff with this  programming
graphics language sets up  and
what we what we wind up getting is
  something that's very complex to look at
  and debug but Bret Victor look them
up  on Google did this visualizer
that's  created automatically from the
code i  just showed you and this
is a live  system so
here's a tourney i'm going to  turn
a addy into a
be here
and if i want  to know where
this pixel and the  rendering comes from i
can just put the  mouse on it and
touches this if i want  to see where this guy
is handled in the  code if i want
to see how the pipeline
  that's set up here of these
five small  programs
here i can just go here if I  want it where did this pixel come from
what
happens if I turn this
so when  you're doing languages of
the future the  system is going to have to also produce
  the debuggers along with the languages
  themselves okay I think I
think it's a  hard stop at ten of so
I won't put any  strain on you but if
you're interested  hang around and ask some questions and  with