Notion - Update docs

This commit is contained in:
shiffman 2024-03-05 18:03:45 +00:00 committed by GitHub
parent 773472c478
commit b68ea4f282
3 changed files with 4 additions and 7 deletions

View file

@ -15,10 +15,7 @@
<p>All the examples in this book have been tested with p5.js version 1.9.0, but for the most part they should also work with earlier versions. Ill be keeping them up to date with the latest version. The most <a href="https://natureofcode.com/">recent code can always be found on this books website</a> and <a href="https://github.com/nature-of-code">its associated GitHub repository</a>.</p>
<h2 id="what-do-you-need-to-know">What Do You Need to Know?</h2>
<p>The prerequisites for understanding the material in this book could be stated as “one semester of programming instruction with p5.js, Processing, or any other creative coding environment.” That said, theres no reason you couldnt read this book having learned programming with a different language or development environment.</p>
<p>
If youve never written any code before, while you could read the book for the concepts and inspiration, youll likely struggle with the code because Im assuming knowledge of the fundamentals: variables, conditionals, loops, functions, objects, and arrays. If these concepts are new to you, my <a href="https://thecodingtrain.com/p5js">“Code! Programming with p5.js”</a> and <a href="https://thecodingtrain.com/processing">“Learning Processing”</a> video courses provide the fundamentals of what you need
to know.
</p>
<p>If youve never written any code before, while you could read the book for the concepts and inspiration, youll likely struggle with the code because Im assuming knowledge of the fundamentals: variables, conditionals, loops, functions, objects, and arrays. If these concepts are new to you, my <a href="https://thecodingtrain.com/p5js">“Code! Programming with p5.js”</a> and <a href="https://thecodingtrain.com/processing">“Learning Processing”</a> video courses provide the fundamentals of what you need<br>to know.</p>
<p>If youre an experienced programmer but havent worked with p5.js, you can probably pick it up by <a href="https://p5js.org/">checking out the p5.js documentation</a>, poking through the examples, and <a href="https://p5js.org/get-started">reading through the librarys “Get Started” page</a>.</p>
<p>I should also point out that experience with object-oriented programming is fairly critical. Ill review some of the basics in Chapter 0, but if classes and objects are unfamiliar to you, I suggest watching <a href="https://thecodingtrain.com/oop">my p5.js and Processing object-oriented video tutorials, both also available at the Coding Train</a>.</p>
<h2 id="how-are-you-reading-this-book">How Are You Reading This Book?</h2>
@ -42,7 +39,7 @@
<p>You draw a shape at position <code>x</code>. With each frame of animation, you increment the value of <code>x</code>, redraw the shape, and voilà—the illusion of motion! Maybe you took it a step or two further and included a <code>y</code> position, as well as variables for speed along the x- and y-axes:</p>
<pre class="codesplit" data-code-language="javascript">x = x + xspeed;
y = y + yspeed;</pre>
<p style="letter-spacing : 0.1">Part 1 of this story will take this idea even further. After exploring how to use different flavors of randomness to drive an objects motion (<strong>Chapter 0</strong>), Im going to take these <code>xspeed</code> and <code>yspeed</code> variables and demonstrate how together they form a vector (<strong>Chapter 1</strong>). You wont get any new functionality out of this, but it will build a solid foundation for programming motion in the rest of the book.</p>
<p>Part 1 of this story will take this idea even further. After exploring how to use different flavors of randomness to drive an objects motion (<strong>Chapter 0</strong>), Im going to take these <code>xspeed</code> and <code>yspeed</code> variables and demonstrate how together they form a vector (<strong>Chapter 1</strong>). You wont get any new functionality out of this, but it will build a solid foundation for programming motion in the rest of<br>the book.</p>
<p>Once you know a little something about vectors, youre going to quickly realize that a force (<strong>Chapter 2</strong>) is a vector. Kick a soccer ball and youre applying a force. What does a force cause an object to do? According to Sir Isaac Newton, force equals mass times acceleration, so that force causes an object to accelerate. Modeling forces will allow you to create systems with dynamic motion, in which objects move according to a variety of rules.</p>
<p>Now, that soccer ball to which you applied a force might have also been spinning. If an object moves according to its <em>linear</em> acceleration, it can spin according to its <em>angular</em> acceleration (<strong>Chapter 3</strong>). Understanding the basics of angles and trigonometry will allow you to model rotating objects as well as grasp the principles behind oscillating motion, like a pendulum swinging or a spring bouncing.</p>
<p>Once youve tackled the basics of motion and forces for an individual inanimate object, Ill show you how to make thousands upon thousands of those objects and manage them as a single unit called a <em>particle system</em> (<strong>Chapter 4</strong>). Particle systems are also a good excuse to look at some additional features of object-oriented programming—namely, inheritance and polymorphism.</p>

View file

@ -309,7 +309,7 @@ if (num &#x3C; 0.6) {
</div>
<figcaption>Figure 0.2: Two example bell curves of a normal distribution, with a low (left) and high (right) standard deviation</figcaption>
</figure>
<p>On the left is a distribution with a very low standard deviation, with the majority of the values piling up around the mean (they dont deviate much from the standard). The version on the right has a higher standard deviation, so the values are more evenly spread out from the average (they deviate more).</p>
<p>On the left is a distribution with a very low standard deviation, with the majority of the values piling up around the mean (they dont deviate much from the standard). The version on the right has a higher standard deviation, so the values are more evenly spread out from the average (they<br>deviate more).</p>
<p>The numbers work out as follows: given a population, 68 percent of its members will have values in the range of one standard deviation from the mean, 95 percent within two standard deviations, and 99.7 percent within three standard deviations. Given a standard deviation of 5 pixels, only 0.3 percent of the monkey heights will be less than 235 pixels (three standard deviations below the mean of 250) or greater than 265 pixels (three standard deviations above the mean of 250). Meanwhile, 68 percent of the monkey heights will be from 245 to 255 pixels.</p>
<p>Luckily, to use a normal distribution of random numbers in a p5.js sketch, you dont have to do any of these calculations manually. Instead, the <code>randomGaussian()</code> function takes care of the math and returns random numbers with a normal distribution:</p>
<pre class="codesplit" data-code-language="javascript">function draw() {

View file

@ -884,7 +884,7 @@ function draw() {
</figure>
</div>
<p>Instead of using <em>linear</em> acceleration and velocity, Im going to describe the motion of the pendulum in terms of <em>angular</em> acceleration and <em>angular </em>velocity, which refer to the change of the arms angle <span data-type="equation">\theta</span> relative to the pendulums resting position. I should first warn you, especially if youre a seasoned physicist, that Im going to conveniently ignore several important concepts here: conservation of energy, momentum, centripetal force, and more. This isnt intended to be a comprehensive description of pendulum physics. My goal is to offer you an opportunity to practice your new skills in trigonometry and further explore the relationship between forces and angles through a concrete example.</p>
<p>To calculate the pendulums angular acceleration, Im going to use Newtons second law of motion but with a little trigonometric twist. Take a look at Figure 3.19 and tilt your head so that the pendulums arm becomes the vertical axis. The force of gravity suddenly points askew, a little to the left—its at an angle with respect to your tilted head. If this is starting to hurt your neck, dont worry. Ill redraw the tilted figure and relabel the forces <span data-type="equation">F_g</span> for gravity and <span data-type="equation">T</span> for tension (Figure 3.20, left).</p>
<p>To calculate the pendulums angular acceleration, Im going to use Newtons second law of motion but with a little trigonometric twist. Take a look at Figure 3.19 and tilt your head so that the pendulums arm becomes the vertical axis. The force of gravity suddenly points askew, a little to the left—its at an angle with respect to your tilted head. If this is starting to hurt your neck, dont worry. Ill redraw the tilted figure and relabel the forces <span data-type="equation">F_g</span> for gravity and <span data-type="equation">T</span> for tension (Figure<br>3.20, left).</p>
<p>Lets now take the force of gravity and divide its vector into x- and y-components, with the arm as the new y-axis<em>.</em> These components form a right triangle, with the force of gravity as the hypotenuse (Figure 3.20, right). Ill call them <span data-type="equation">F_{gx}</span> and <span data-type="equation">F_{gy}</span>, but what do these components mean? Well, the <span data-type="equation">F_{gy}</span> component represents the force thats opposite to <span data-type="equation">T</span>, the tension force. Remember, the tension force is what keeps the bob from falling off.</p>
<p>The other component, <span data-type="equation">F_{gx}</span>, is perpendicular to the arm of the pendulum, and its the force Ive been looking for all along! It causes the pendulum to rotate. As the pendulum swings, the y-axis (the arm) will always be perpendicular to the direction of motion. Therefore, I can ignore the tension and <span data-type="equation">F_{gy}</span> forces and focus on <span data-type="equation">F_{gx}</span>, which is the <strong>net force</strong> in the direction of motion. And because this force is part of a right triangle, I can calculate it with . . . you guessed it, trigonometry!</p>
<figure>