Alan Kay CS1 talk at UCLA (2010)

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