akomiqaia / nature-of-code

Nature of Code

The coding train explores topics ranging from basic mathematics and physics concepts to more advanced simulations of complex systems. Subjects covered include physics simulation, trigonometry, self-organization, genetic algorithms, and neural networks. Examples are demonstrated in JavaScript using p5.js.

Introduction in Perlin Noise

• noise() vs random()
• Graphing 1D Perlin Noise
• 2D Noise# Nature of Code The coding train explores topics ranging from basic mathematics and physics concepts to more advanced simulations of complex systems. Subjects covered include physics simulation, trigonometry, self-organization, genetic algorithms, and neural networks. Examples are demonstrated in JavaScript using p5.js.

Introduction

• noise() vs random()
• Graphing 1D Perlin Noise
• 2D Noise
• noiseDetail()
• Coding Chalange: Random Walker

---

noise()

It was invented By Ken Perlin in the 1980s is mostly used in graphical applications to produce textures, natural motion, shapes, terrains etc.

Perlin Noise returns Perlin noise value at specific coordinates.

Perlin Noise is a random sequence generator producing a more natural ordered, harmonic succession of numbers compared to random() funciton.

noise() and random() visualisation in 1D

random()

noise()

1D Perlin noise drawing

noise() function adding for loop and vertex function from p5js library

Default 2D Perlin noise visulisation.

2D perlin noise visulisation can be used for producing textures or terrains for different purposses. the picture from bellow is reult of implementing 2 dimensional Perlin noise. Since perlin noise is 'smooth randomness' and we are giving values to each pixel from gray to black we get cloudy texture look like drawing.

noiseDetail() in perlin noise

what does noiseDeatil() do?

• noiseDetail() takes two arguments.
• first argument is controling number of octives.the higher the number the finer details get on teh canvas.
• Lower octaves contribute more to the output signal and as such define the overall intensity of the noise, whereas higher octaves create finer grained details in the noise sequence.
• By default, noise is computed over 4 octaves with each octave contributing exactly half than its predecessor, starting at 50% strength for the 1st octave.
• second argument is usually is reffered as falloff
• This falloff amount can be changed by adding an additional function parameter.
  • Eg. a falloff factor of 0.75 means each octave will now have 75% impact (25% less) of the previous lower octave. Any value between 0.0 and 1.0 is valid, however note that values greater than 0.5 might result in greater than 1.0 values returned by noise().
• By changing these parameters, the signal created by the noise() function can be adapted to fit very specific needs and characteristics.

---

Challenge - random walk

Basic Setup

• the point randomly chooses between for directions(up, down, left and right)

Colored the points

• the point gets collored randomly using perlin noise algorithm

Two points mirroring

50% chance that point will move towards the mouse

• Create a random walker with dynamic probabilities.

For example, it has a 50% chance of moving in the direction of the mouse

Challenge - Perlin Noise Flow Field

• instead of pixels we should use vectors.
• Instead of giving each pixel a vector we are gonna give a vector to every 20th pixel
• noiseDetail()