[TRAIN WHISTLE]
All aboard.
Here we are.
Welcome to a new coding challenge.
This coding challenge is part of my spring 2017
course, Nature of Code.
I'm teaching it at New York University,
and I have most of the materials for this course
already online through videos.
You can find the links to all those videos and the materials
for the course in this video's description.
But what I'm going to do periodically
is do some coding challenges that
fit with the material for that course week to week,
and what I'm going to start with today is this thing called
a random walk.
What is a random walk?
I'm going to diagram it for you on the whiteboard in a moment.
But ultimately, a random walk, as you can see here,
is visualized as this thing that moves around randomly.
It's a random walk.
And so I actually already have the program running here
that I made in the coding challenge
because I'm recording this after it,
and it's being edited together through the magic
of video editing technology.
And so what I'm going to start with here
is the very basic, traditional, simple random walk,
a little dot moving around the screen,
every frame of animation picking a random direction to move.
From there, it's up to you to do something
more creative with this.
To think about this, what kinds of behaviors and ideas
from nature or the world can you simulate with this?
What types of visual outcomes can you get with this?
At the end of the video, I'll give you some context and ideas
about that.
And this is just the first in a series of short experiments
about random walks, and I'll do some variations on it
in terms of moving this from 2D to 3D,
thinking about the step size, thinking about vectors,
object-oriented programming.
But this video is going to be the most basic, simple, drop
singing.
I just want to say drop dead for some reason, but a very simple,
just basic random walk.
I hope you enjoy looking at the code for this
and you make something creative out of it and you let me know.
So I'm going to leave.
I'm going to take the train to the past, my time travel train,
to do this coding challenge.
OK.
I am here to get started with this coding challenge,
the random walk.
So the first thing I want to do is--
oh, you're over here now, I'm over here--
Is talk about what a random walk is.
So a random walk is a stochastic--
stochastic being another word for random,
that sounds about right--
a process where there is a value that changes with each time
step randomly in one direction or another.
And this is the kind of thing that
can be used to model the way an animal forages for food
or the stock price fluctuates, perhaps,
or a kind of way a gambler makes decisions playing blackjack.
There are a lot of processes by which this idea of a random
walk--
and a random walk could be in one dimension
or two dimensions or three dimensions--
are used in various kinds of scientific simulations.
This is also related to something
called Brownian motion, which maybe I'll
come back on a separate video and kind of connect
these two things more.
But the kind of random walk I want to talk about
is the random walk that happens in a two-dimensional graphic
space.
And in a future video, a couple videos from now,
I'm going to do couple of variations on it,
and we'll do a 3D random walk as well,
and we'll see how that works.
So the idea here is that there is a dot
in this two-dimensional canvas.
Maybe it's in the middle of the canvas.
The dot has an x and y position.
And every frame of animation, there are only four choices.
Option number 1 is move to the right.
Option number 2-- the order of these doesn't matter--
move to the left.
Option number 3, move up.
Option number 4, move down.
So every frame of animation, one of these is randomly picked.
So we might move to the right and then move up, then move
to the left, then move up, then move to the left,
then move down, then move to the left,
then move down, then move down, then move to the right,
then move up.
You can imagine how this would work.
Now, I in a weird sort of way created a pattern there
because I'm a human being, flawed in so many ways.
You have no idea.
But you know what the things I can't do,
as most human beings can't do, is
produce an actual random sequence of numbers
because my brain is just pattern, pattern, pattern this,
pattern this, pattern this.
But computers can produce what's known as pseudorandom numbers,
meaning there's a mathematical formula that's
operating behind the scenes that generates a sequence of numbers
that when looked at over time have an essentially
random probability.
Now, these are pseudorandom because it's not
like we're actually measuring.
And incidentally, a random walk is also
related to measuring movements of particles moving around
in the gas.
I had this moment where I felt like I needed to burp.
That was very strange.
Everything is coming together in my brain.
But there was a point to what I was saying,
which is that if you really wanted to achieve true-- first
of all, random numbers itself is something
that lots of people study, a lifetime of study, or write PhD
dissertations about getting a really good random number
generator.
The way that I can get random numbers with this pseudorandom
number generator is with a function in P5 called random.
And the key thing about this function
is, well, first of all, it takes a minimum and a maximum
as arguments.
So I want to get random numbers between 4 and 10
or 0 and 5 or negative 5 and positive 5.
But the key thing about this function
is it gives you a uniform distribution, meaning
you have the same likelihood as picking the number 1
as you have the picking the number 3
as you beginning of the 4, picking the number 2.
And one thing I really want to look
at as part of this little series about random walks
is, what happens what I want a different distribution?
What if I want to move down more often than I want to move up?
Or what if I want to move towards the mouse?
I want to have a 50% chance of moving
toward the mouse and a 50% chance of picking
something else random.
Or what if I want to have a distribution of random numbers
that follows something called the bell curve,
or a normal distribution or a Gaussian distribution?
And I have some videos about that.
So I'm going to connect some of these themes
in these videos about random walks.
So all I need to do is have a program with an x and a y.
I need to have the random function that picks--
and really, my random function is not
going to pick 1, 2, 3, or 4.
I could make it do that, but that's not really how numbers
are ever picked on a computer.
So I'm going to pick 0, 1, 2, or 3,
because I'm going to look for a range starting with 0.
And then whichever one of those I
pick I'm going to adjust the x or the y position
and move my random walker around on the screen.
So come over here with me.
Let's take the train over to the computer.
OK, here we are.
So let's start implementing this.
I'm actually going to do this in a non-object-oriented manner,
and I'll come back in another video
and maybe add objects to this.
But just in the most the simplest way,
I'm going to have an x variable and a y variable.
And I'm going to start it in the middle of the screen,
y equals 200.
And I'm going to just draw a point at x and y.
I'm going to say stroke 255, and I'm also
going to say stroke weight 2 just so it's
a little bit more visible.
And if I now refresh the page, we can see, there it is.
There's my random walker.
It hasn't gone anywhere yet.
So now I need to pick a random number.
So that random number could be--
so I'm going to do that here in draw.
I'll do it after I draw the point.
And I'm going to say var r equals random 0 to 4.
So this is what I'm going to start with.
Now, first of all, I don't actually
have to give a minimum and a maximum if my minimum is 0.
So by definition, if I only give the random function
a single argument, that's the maximum.
So I want a random number between 0 and 4.
Now, the issue with this is the random function in P5,
by definition, will give me a random between 0 and 4
that has decimals, so 1.23, 3.5, 4.7, 0.3, 4.1--
no, not 4.1.
Actually, the highest number it will give me is
3.99999999999999999--
I can go on.
I lost my train of thought there.
So it's never actually going to give me 4.
But I can do something to this, which
is I can put this function floor around it.
And what the floor function does,
there are a bunch of functions that I can use--
where's my marker, here it is--
in P5 to take a floating point number like 3.4
and convert it to an integer.
If I use the floor function, it will make that number 3.
If I use the ceiling function, C-E-I-L,
it will make that number 4.
If I use the round function, it will make that number 3.
So floor, even if it's even if it's 3.999999,
lops off the decimal place and makes it 3.
If ceiling, no matter what it is,
whether it's 3.9 or 3.1 or 3.2, goes up to the nearest integer.
So floor goes down to the nearest integer,
[? ceil ?] goes up to the nearest integer,
and then round rounds it.
So 3.4 becomes 3.
3.6 becomes 4.
So it goes up or down, depending on which is closer.
It rounds the number.
So floor is going to be useful for me here.
And now here's the thing.
You know what it would make sense for me
to use in this video that I hear a lot of people on YouTube
asking me to use, and say, what's wrong with you?
How come you never use a switch statement?
And I'll tell you the reason.
I got a thing in my brain.
I can't ever remember the syntax for it.
So what I want to do right now, which
is more comfortable for me, is just say, if r equals 0,
do something.
Otherwise, if r equals 1--
and by the way, I also want to talk about,
someday, the difference being triple equals and double
equals, that's not really a part of this video.
Somebody remind me.
I'll come back to that somewhere else.
But let's try to add a switch statement.
Let's do it in this video.
It's a the kind of conditional statement, like an if
statement, where you can say, hey, there are some cases here.
I've got this value.
And if this value is equal to this, do this.
If it's equal to this-- but it looks more condensed syntax.
So I'm going to have to look up the syntax
because I can freely admit that I can ever remember this.
Case statement JavaScript.
Let's see where we get.
Let's go to switch here.
So you can see here this is this statement.
This is the syntax.
Switch expression, expression meaning,
in this case, a particular variable.
The case of when this variable has this value, do this stuff.
Otherwise, do this stuff.
And then I need a break statement
so that I get out of it once it's found a particular value.
So I can only do one.
So I should be able to do-- let me a copy this in.
Let's copy this.
And I can do switch r case 0 case 1.
Look at me.
I'm all grown up.
Case 2.
This is very stressful.
This is going to work.
Case 3 break.
And how did I do?
So now the thing is, what do I want to do?
Well, if we look back to here, I have
to say, case 0, move to the right.
Case 1, move to the left.
Case 2, move up.
Case 3, move down.
Again, the order doesn't actually matter.
So that's a long way to walk from there
to here, this new space.
So I'm going to say, x equals x plus 1 here.
I'm going to say, x equals x minus 1 here,
to move to the left.
To move down is y equals y plus 1, and to move up
is equals y minus 1.
So we now have this switch statement
where I'm picking one of these four options.
And here we go.
Let's go back to our code, run it, and look at that.
There's our random walk.
Now, interestingly enough, this doesn't
look like some of the images I showed you in the intro
to this video that I haven't actually
made yet because that's going to happen after.
What I want to do is I want to see
the path of this random walker just in terms
of this sort of classic way to visualize
the random walk in a 2D space.
And the easiest way I can do that is just
take the background function and move that into setup.
So I'm drawing the background just once at the beginning,
and then--
I'm drawing the background just once at the beginning
so that when the dot moves I don't I'm
not erasing the previous dots.
And now if I do this again, we can see--
look at this.
There's are random walker.
So I now propose to you, at the end--
I'm going to do a couple more videos with some variations
on this theme.
But this is a really simple concept.
But you would be amazed if you Google random walk art,
random walk 2D, random walk 3D, and you do an image search,
you're going to find a lot of beautiful examples of people
trying different styles.
What if this random walk, for example,
color played a role in it?
What if you had multiple random walks,
and when they intersected each other
they combined colors or gave birth to a new random walk?
What if you thought about different ways
to do probability so that the way that it moved
has some sort of pattern or logic to it?
And I will make some videos with some kind of known techniques.
There's a technique called the Levy flight,
which is a different kind of walk
where the step size varies.
Right now I'm only ever moving by one other things
you might try and think about is,
what if the random walk never was
allowed to go where it had previously been?
This is known as a self-avoiding walk.
This is a pretty tricky problem, but you might think
about trying to solve that.
I think I said 3D already.
So there's a lot of things.
Oh, and here's the thing that's even more important.
This is just a pure visual example of the random walk.
But what if you don't think about the outcome
of the random walk being just a dot moving in a 2D space?
What if it's a random walk that's actually changing notes
in a melody, a musical composition, or a dance
performance?
What are some other ways you can take this random walk idea
and make it into a project that has
some kind of creative expression associated with it?
Or also, even in the land of computer graphics, what
if the random walk are actually vertices of a polygon,
and each one of those vertices are doing a random walk?
Or after random walk goes for while, it sets [INAUDIBLE]??
How could you control a design?
What if your random walk through color space?
There are so many possible ways you
could think about what the random walk is
besides this sort of traditional view of it.
So if you're following along this Nature of Code course
that I'm sort of teaching online through this YouTube channel
and you make an example, please tweet it to me @shiffman.
You can share it in this Slack channel
if you're part of the Patreon group.
Or you can certainly link to your work
that you made in the comments, and I'll
try to come back in future videos
and show some random walk examples that people
from the community have made.
OK?
Thanks for watching this tutorial.
And if you stick around and watch of the other videos,
there'll be more random walk examples to come.
[BELL]
[MUSIC PLAYING]