This week is going to have the same basic 
structure of previous weeks. 
First we're going to learn a mechanism 
that supports interactive programs, that 
mechanism is called Big Bang. 
And no surprise, there's kind of a bad 
pun involved in the name of Big Bang. 
We'll talk about that later. 
So first we're going to learn that 
mechanism, and then later in the week 
we'll start learning how to design with 
it. 
To explain the Big Bang mechanism, what 
I'm going to do is I'm going to start by 
looking at a couple example interactive 
programs. 
And just kind of reason from first 
principles about what has to be going on 
inside those programs, the inherant 
structure of those programs. 
Then I'll explain how big bang works and 
how it supports that structure. 
So imagine that we have two fairly boring 
interactive programs. 
So the one on the left is just counting 
down, 8, 7, 6, 5, 4 and so on. 
And the one on the right just has a cat 
walking very slowly across the screen. 
And I'm going to say these programs are 
interactive because if I press the Space 
key they both reset back to the 
beginning. 
And start running again. 
So that's the sense in which they're 
interactive. 
These two programs have classical 
interactive behavior. 
Some underlying state is changing, the 
number in the countdown or the position 
of the cat. 
There's a changing image on the screen 
and pressing the key does something or 
perhaps clicking the mouse might do 
something. 
So there's two simple interactive 
programs. 
Now let's think about what's going on 
behind the scenes, starting with the 
countdown program. 
There's the current number in the 
countdown, which is the middle column in 
this table. 
It starts at ten and then it goes to nine 
and so on. 
And there's the currently displayed 
image, which is the image of the number 
of 10, the image of the number 9, and so 
on. 
And what's happening is that once a 
second, n gets decreased by one, and the 
image gets updated to be the image 
corresponding to the current n. 
So there's kind of this behavior of the 
clock ticking tick, tick, tick and each 
time an and the image are both updated. 
Now if we look at the cat program the 
same kind of thing just inherently has to 
be going on inside of it. 
In this case the changing state is the 
cat's exposition it starts at 0 and then 
it goes to 3 and then it goes to 6. 
The idea is that the cat is moving three 
units per tick. 
In this case the image is an image of a 
cat at that position rather than an image 
of the numeral. 
And in this case the ticks are also 
counting up, 0, 1, 2, 3, 4, but they're 
counting much faster in this case. 
Let's just say for now they're ticking 28 
times per second, whereas in the 
countdown program we wanted it to tick 
one time per second. 
Now, continuing with this exercise and 
thinking about what just has to 
inherently be inside this program, let's 
think in terms of information and data 
for a second. 
We've got these numbers, 0, 3, 6, that 
are representing the x position of the 
cat. 
So when we do something like that, what 
we use is a data definition. 
We use a data definition to tell us how 
we're going to represent domain 
information using data. 
So here's a data definition for that. 
We're going to say that cat is a number, 
and we're going to interpret that number 
to be the x coordinate with a cat. 
And the rest of this data defintion is 
fairly straightforward. 
Now it's simple atomic data. 
Looking back at our table, we see that at 
each clock tick. 
What happens is that the representation 
of the cats x-coordinate increases by 
it's speed each time, so it goes from 0 
to 3 to 6 to 9. 
So here's a function that does that for 
us. 
It's signature is cat to cat, so it takes 
a cat and produces at cat. 
And it increases that position by the 
cats speed. 
And there's some check expects. 
And if we look at the body of the 
function we can see what we expect. 
It takes the current cat, the current 
x-coordinate of the cat and increased it 
by speed. 
Going back to the table again. 
And still thinking about just what 
inherently had to be inside this program. 
We see that, at each clock tick, we need 
to produce an image based on the cat's 
current x-coordinate, that shows the 
actual cat. 
Farther and farther across the image of 
some background scene. 
In this case the background scene is 
white. 
So here's a function that does that. 
Function consumes a cat and produces an 
image. 
And we're using a primitive here that you 
haven't seen before called place image. 
But the way place image works is it takes 
an image and then it takes an 
x-coordinate, a y-coordinate. 
And a second image and it places the 
first image at the given x, y coordinate 
on the second image. 
So what this function's doing here is 
it's placing the image of the cat, which 
happens to be the value of a constant 
called cat image. 
At the appropriate x coordinate in the 
middle of the background image,which 
happens to be called MTS. 
So there's a data definition and two 
functions. 
One function, next cat, can take us from 
one cat to the next-cat. 
In other words, it can advance the cat's 
exposition by three each time. 
0, 3, 6, and so on. 
The other function can take us from a cat 
to an image of the cat. 
In other words, the image of the cat at 
the appropriate position on the 
background called MTS. 
Now we need to understand how those two 
functions need to dance together, in 
order for the cat to move across the 
screen the way we want it to. 
Suppose the cat starts at 0. 
We need to call render-cat to get the 
appropriate image and display that. 
Then we need to call next-cat with 0 to 
get 3. 
Then we need to call render-cat with 3 to 
get the image and display it. 
The next-cat with 3 to get 6. 
Then render-cat we call with 6 to get the 
next image, and display that. 
Then we call next-cat with 6 to get 9, 
then render-cat with 9 to get the image 
and display it. 
Next-cat with 9 to get 12, render-cat 
with 12, next-cat with 12, 15, and so on, 
and so on, and so on. 
And all we need to do is do that 28 times 
a second which I can't talk that fast. 
To do that, to wire render-cat, and 
next-cat together that way, Dr Ragi gives 
us a special expression called a Big-Bang 
Expression. 
And here's an example of how we would use 
big-bang, to make the cat walk. 
First argument to big-bang is an 
expression that evaluates to what 
big-bang calls the initial world state. 
The initial state of this whole 
interactive world. 
In this case the state of the interactive 
world is represented by the cat tight, 
and so we're going to give it an 
expression that produces a cat. 
So zero is the initial position of the 
cat. 
After its first argument, big-bang takes 
a number of options. 
And it takes so many that the way it does 
it is to take them by name, that way you 
can give it only the options you want to 
give it each time. 
The way to read this first option is, it 
says, each time the clock ticks, call the 
next-cat function. 
Pass it as an argument, the current state 
of the world and it will give you back 
the next state of the world. 
Because in this particular big-bang 
expression the state of the world is 
represented by cat. 
I've put a comment here saying that the 
type of the first argument to big-bang in 
this case is cat. 
And another comment here that says that 
the signature of the next-cat function is 
that is consumes cat and produces cat. 
The second option to big-bang in this 
case is called two draw. 
And you should read this use of true draw 
as saying that what big-bang's going to 
do is on each clock tick it's going to 
call render-cat. 
Passing render-cat as its first argument 
the current world state, in other words a 
cat. 
And render-cat will produce an image and 
big-bang will display that image. 
And I made a note here, off to the side, 
that the signature of render-cat is that 
it consumes cat and produces image. 
So, what big-bang is doing for us is, 
it's taking all the little pieces of our 
world, the initial world state, the tick 
function, the draw function. 
And it's combining all those pieces 
together to get a world. 
Do you see the joke behind the name now. 
It squeezes the pieces together, big-bang 
it produces a world. 
Whether you like that joke about the name 
or not that is the name I didn't come up 
with it. 
One other point to make about big-bang is 
that it's what computer scientists like 
to call polymorphic. 
It can work for any type of world state. 
So big-bang doesn't just work with cats, 
it can work for, for example, if you have 
an interactive world program that has to 
do with fireworks then. 
The world state could be firework. 
Or if you have an interactive program 
that has to do with lots of fireworks 
then the world state could be list of 
firework. 
The world state can be anything you want 
to be so actually here where we've, where 
we've noted cat and cat to cat and cat to 
image as far as big-bang's concerned it 
can be anything. 
So really it could be, X, X to X, and X 
to image. 
All big-bang wants is for you to give it 
an initial world state. 
And then for on-tick you've gotta give it 
a function that consumes a world state of 
that type and produces a world state of 
that type. 
And then for to-draw, you have to give it 
a function that consumes a world state of 
that type, whatever it is, and produces 
image. 
The key thing is, in any one use of 
big-bang, all the Xs have to be the same 
type, they all have to be consistent, 
that's what matters to big-bang. 
So, there's big-bang. 
It's without a doubt the most complicated 
single-primitive we're going to use this 
term. 
It's a user interface framework. 
And user interface frameworks, in other 
words tools that integrate a bunch of 
functionality together. 
To get an entire user interface, user 
interface frameworks are always somewhat 
complicated. 
This one is simpler than most. 
Don't worry about it, we're going to 
spend the whole week on it. 
You get a lot more chances at it. 
But the basic thing to understand is, 
this picture up here in the upper right, 
that's what big-bang is doing. 
It's starting with an initial world 
state. 
And then it's coordinating calling 
functions like render- cat and next-cat, 
to produce the combined behavior of the 
interactive program that we want to have. 
We'll also see starting in the next video 
that there's more options. 
So for example, big-bang has an option 
called on key. 
And you can imagine that the way that 
works is on key wants a function that it 
will call when a key is pressed on the 
keyboard. 
And that function should process the key 
properly and produce the next world 
state. 
What we'll also see in the next video is 
we're going to introduce a design recipe 
for designing interactive programs using 
big-bang. 
And that design recipe is going to help 
make it a lot easier to write programs 
that use big-bang.