Nature of Code
These videos accompany The Nature of Code book.
Welcome15 Feb 2020
Welcome to the Nature of Code 2.0! In this video, I give an overview of the playlist and The Nature of Code book (originally published in 2012).
Introduction15 Feb 2020
Welcome again to Nature of Code! Here, I give a quick overview of the “Introduction” section of The Nature of Code.
What is a Vector15 Feb 2020
Welcome to Nature of Code Chapter 1: Vectors! What is a vector? How do they work in p5.js? These questions will all be answered in this first section of this series on p5.Vector.
Getting Started with Vector Math15 Feb 2020
This video covers the very basics of vector math focusing on vector addition and looks at how to apply the concept of velocity to a position vector in the random walker example.
A Random Vector15 Feb 2020
This video covers how to initialize a p5 vector with p5.Vector.random2D().
Static Functions18 Mar 2020
Unit Vector (Normalize)20 Mar 2020
In this video, I explain the concept of a “unit vector,” what it means to “normalize” a vector, and take a look at the p5.js functions: p5.Vector.mag(), p5.Vector.normalize(), p5.Vector.setMag().
Acceleration Vector22 Mar 2020
In this video, I add an “acceleration” vector to the Mover object and create an example where the object accelerates towards the mouse location. This is the foundation on which I will build for implementing forces in the next chapter!
Simulating Forces23 Mar 2020
In this video I introduce Newton’s Laws of Motion, and apply the concept of a “force” to a p5.js sketch with a mover object and two forces: gravity and wind.
Mass and Acceleration31 Mar 2020
In this video, I add a mass property to the Mover class and examine how a mass property impacts gravity and wind forces.
Friction Force07 Apr 2020
In this video, I cover how to read the formula for kinetic friction and incorporate it into a p5.js sketch with the Mover applyForce() function.
Drag Force08 Apr 2020
In this video I implement the formula for a “drag” force with p5.js (also known as air resistance or fluid resistance) and similar objects falling into a liquid.
Gravitational Attraction17 Apr 2020
In this video, I demonstrate how to apply Newton’s Law of Universal Gravitation in p5.js using vectors and forces.
Mutual Attraction28 Mar 2022
Finishing off Chapter 2 on forces, let’s look at an “N-Body Simulation” where all movers experience gravitational attraction with all other movers!
Angles and Rotation24 Jan 2021
Welcome to Chapter 3 of The Nature of Code: Oscillating Motion! I begin in this video by explaining angles, the different units of measurements for angles: degrees and radians, and how to rotate shapes in p5.js.
Angular Motion24 Jan 2021
In this video, I explain how to apply the concepts of vector motion to angles (scalar!). Then I demonstrate how to rotate with angular motion in a p5.js sketch!
Angles and Vectors28 Jan 2021
In this video, I tackle a common question, how do you draw an object pointing in the direction it’s moving? I demonstrate how to calculate the angle associated with the direction vector as well as create an vector from an angle in p5.js.
Polar Coordinates01 Feb 2021
It’s finally time to dive into the trigonometric functions—sine, cosine, tangent—and take a close look at thinking in polar coordinates with p5.js!
Simple Harmonic Motion01 Feb 2021
What is a sine wave? In this video, I demonstrate how to use the sin() function in p5.js to simulate simple harmonic motion.
Graphing Sine Wave01 Feb 2021
What does a sine wave look like? In this video I look at how to graph and animate a sine wave in p5.js varying the period and phase.
Additive Waves08 Feb 2021
This video builds on the previous sine wave visualization in p5.js example. Here, I build a Wave class with variables for period, amplitude, and phase, and demonstrate how to add multiple wave patterns together!
Particle System Simulation01 Mar 2021
Welcome to Chapter 4 of The Nature of Code: Particle Systems! I begin by coding a simple particle system in p5.js. I convert the Mover class into a Particle class, add a lifetime property, and organize a collection of particles into an array.
Many Particle Systems (Emitters!)02 Mar 2021
In this video, I add an Emitter class to further organize the array of particles and allow for multiple particle systems in a p5.js sketch.
Particle Systems with Inheritance02 Mar 2021
Have you ever wondered how the concepts of inheritance and polymorphism fit into the Nature of Code Particle system examples in p5.js?
Particle Systems with Image Textures07 Apr 2021
It’s time to expand beyond grayscale particles! In this video I demonstrate how to make a fire or smoke-like effect by using image textures and additive blending with a particle system.
Steering Agents02 Jun 2021
Seeking a Target08 Jun 2021
More Steering Behaviors! Flee, Pursue, and Evade16 Jun 2021
Arrive Steering Behavior07 Jul 2021
Wander Steering Behavior13 Sep 2021
Vector Dot Product (Scalar Projection)27 Sep 2021
This video covers the dot product and scalar projection with p5.js and vectors, concepts that I’ll need for finding the distance between a point and a line which will lead to the path following steering behavior in the next video!
Path Following12 Oct 2021