In this multi-part coding challenge I show how to use a noise field and polar coordinates to create a perfect GIF loop. Code: thecodingtrain.com/challenges...
p5.js Web Editor Sketches:
🕹️ Polar Perlin Noise Loops: editor.p5js.org/codingtrain/s...
🕹️ Perlin Noise GIF Loops: editor.p5js.org/codingtrain/s...
Other Parts of this Challenge:
📺 Perlin Noise GIF Loops: • Coding Challenge #136....
🎥 Previous video: • Coding Challenge #135:...
🎥 Next video: • Coding Challenge #137:...
🎥 All videos: • Coding Challenges
References:
🖋️ Étienne Jacob's tweet: / 1096403588069425152
📓 Étienne Jacob's Blog Post: necessarydisorder.wordpress.c...
🔗 noise() reference: processing.org/reference/nois...
💻 ffmpeg: ffmpeg.org/
🗄 Perlin Noise: en.wikipedia.org/wiki/Perlin_...
Videos:
🚂 Blobby!: • Coding Challenge #36: ...
🚂 Drawing with Fourier Transform and Epicycles: • Coding Challenge #130....
🚂 Heart Curve: • Coding Challenge #134....
🚂 GIF Loop: • Coding Challenge #135:...
🎥 Perlin Noise: • 13: What is Perlin Noise?
🔴 Coding Train Live 169: • Coding Train Live 169:...
Related Coding Challenges:
🚂 #36 Blobby!: • Coding Challenge #36: ...
🚂 #130 Drawing with Fourier Transform and Epicycles: • Coding Challenge #130....
🚂 #134 Heart Curve: • Coding Challenge #134....
🚂 #135 Making a GIF Loop in Processing: • Coding Challenge #135:...
Timestamps:
0:00 Introduce coding challenge
1:35 Let's code
1:45 Recreate coding challenge 'Blobby'
4:18 Add Perlin noise
5:25 Highlight the artifact in the blobby shape
6:30 Illustrate Perlin noise in one dimension
7:18 Explain Perlin noise in two dimensions
8:24 Walk noise space in a loop
9:20 Visualize noise space in two dimensions
10:16 Implement noise in two dimensions
11:41 Refine how noise values change over time
12:21 Experiment with different parameters
14:28 Update how noise values change
17:25 Consider creative possibilities
19:04 Additional notes on the noise space
19:21 Explain noise seed
19:47 Introduce noise in higher dimensions
21:28 Conclude coding challenge
Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound
🚂 Website: thecodingtrain.com/
👾 Share Your Creation! thecodingtrain.com/guides/pas...
🚩 Suggest Topics: github.com/CodingTrain/Sugges...
💡 GitHub: github.com/CodingTrain
💬 Discord: thecodingtrain.com/discord
💖 Membership: ru-vid.comjoin
🛒 Store: standard.tv/codingtrain
🖋️ Twitter: / thecodingtrain
📸 Instagram: / the.coding.train
🎥 Coding Challenges: • Coding Challenges
🎥 Intro to Programming: • Start learning here!
🔗 p5.js: p5js.org
🔗 p5.js Web Editor: editor.p5js.org/
🔗 Processing: processing.org
📄 Code of Conduct: github.com/CodingTrain/Code-o...
This description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecod...
#gifloop #perlinnoise #polarcoordinates #p5js #processing
10 июл 2024