Coding Challenge 11: 3D Terrain Generation with Perlin Noise in Processing
Вставка
- Опубліковано 22 тра 2024
- In this coding challenge, I create a 3D procedural terrain using Perlin Noise and the beginShape() function in Processing. Code: thecodingtrain.com/challenges...
🕹️ p5.js Web Editor Sketch: editor.p5js.org/codingtrain/s...
🎥 Previous video: • Coding Challenge #10.1...
🎥 Next video: • Coding Challenge #12: ...
🎥 All videos: • Coding Challenges
References:
💾 beginShape() reference: processing.org/reference/begi...
💾 noise() reference: processing.org/reference/nois...
Videos:
🚂 What is Perlin Noise?: thecodingtrain.com/tracks/the...
🔴 Coding Train Live 37: • Coding Train Live 37: ...
Related Coding Challenges:
🚂 #18 3D Fractal Trees: • Coding Challenge #18: ...
🚂 #24 Perlin Noise Flow Field: • Coding Challenge #24: ...
🚂 #112 3D Rendering with Rotation and Projection: • Coding Challenge #112:...
Timestamps:
00:00 Introduction to the Challenge
00:46 What do we need to do?
02:14 Draw a rectangular grid!
04:13 Create a flat triangle strip mesh!
06:51 Rotate the surface in 3D!
08:47 Set the z-values of the vertices randomly!
11:04 Create a 2D array to store the z values!
13:31 How do we make the terrain infinite? What is Perlin Noise?
17:03 How do we make the terrain smooth?
17:43 Reduce offsets to get smoother z values
19:17 How do we make it appear as if we are moving over the terrain?
20:30 Change y-offset per frame to create the illusion of flying!
22:05 Thanks for watching!
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: / discord
💖 Membership: ua-cam.com/users/thecodingtrainjoin
🛒 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...
#perlinnoise #terraingeneration #procedural #processing
thank u for existing
RM Gmzorz Your comment is on point
why on earth do i have 108 likes
RM Gmzorz incorrect you have 127 likes hahaha
SP4RK MAKER incorrect he has 140 likes hahahahahahahahahaahahahahahahahahahahahahaahahahahahahahaahahahahahahahahahahahahahahaahahahahahahaahahaaaaaaaaaaaaaaaaaha...
220 so far
You might be the Bob Ross of programming
For sure!
yes it's real
@Jacob Morris It's almost 2 years later
He is - si eh
Yes
Dudes 100 times better than any of my university comp sci lecturers
That's for damn sure 😂
Daniel Seed Seconded
lolol
Yeah but here he only uses JS and doesn't really talk about Pointers, Memory Registers, Use of OOP Libraries/Methods, etc.. We all remember making our first GUI and having to teach ourselves Layout Managers, but that's what made us great at programming
Julian A he's not using is, he's using processing. And he has tutorials going over the basics of programming. This isn't meant to be computer science.
I really appreciate how you're not just speed coding but also explaining and voicing out your train of thought. I think your videos are really entertaining and impressive and I am glad to have discovered your channel!
train of thought, train, get it?
Wow it has been.... 4 years? The nostalgia hits back again!! You are an amazing programmer and communicator! Loved your videos
its been 7 years haha
I learn more things watching these videos then I did doing a games development course at college
Thanks for the nice feedback!
Like seriously, what takes him 1 minute takes my teachers more than an hour to explain
Probably just ur college. I study Game Engineering in university and made a ton of progress within a year.
+Richy Same
Same, my programming course is like: 15 minutes theory, small demo to show how an Array works. Now make Pong. 3h+ of trying things out without having the extended knowledge to do so.
It's crazy how every fascinating thing about coding that's caught my line of thought is something you have already made a video on. Reliably awesome work
Another brilliant, enthusiastic lesson. I added this line:
stroke(map(y,0,rows,0,255));
into the first part of the drawShape loop and it looks nice!
I swear you are the best teacher ever. I am also currently reading your book which is amazingly well explained.
my mind was truly blown with this one.. it looks insane!
and actually, it seems to me that, with the low increment it can also be used to generate water surface, that is gently moving.
I don't understand any of your coding challenge videos (because I don't know coding to any extent), yet I find them so entertaining to watch and see the mental thought process behind what goes on to create coding. Keep up the awesome work!
This channel is an absolute blessing to the world of creativity as a whole.
Dude, these challenges are awesome. I learned a lot from this one! I had no idea I could do all this :| Thanks!
So glad to hear!
This would take me at least a whole day programming this code and you did it in just 22 minutes, without explaining the code you could probably do it in 12 minutes... damn
Yeah he is good at what he's doing, but don't think he is doing it for the first time, each video is prepared before he records it, that's why his videos are great;
Vapor Wave - sama I In 1 Minute ... Copy and Paste
+Typex96 But This Is A Coding *Challenge,* So He Should Not Prepare Before Doing !
I like how he breaks the 'challenge' down to it's smallest compartments and builds and extends on them step by step.
I recently started reading Nature of Code and your work has helped reignite my love for programming. Thank you so much.
And that trick with perlin noise, just genius!
Not only really informative, but is just a joy to watch. So much enthusiasm! Thanks!
Hey bud, frameRate() in setup() works - I think you were writing it in draw() :)
The presenter seems so happy when the flying effect runs live that it spread on me and I am now 1/ subscribing 2/ planning on the very little free time I have left to enjoy implementing this...
Current Status:
☑ Flying
☐ Not flying
I’m from Chemical engineering background with 3 years of experience. For me coding was always a non existent entity.
Coming to Silicon Valley, realized the importance of coding in everyday life. Started following this guy holistically. This dude made it fun. Thank you for such wonderful videos. You have earned a loyal fan.
Dude that was freaking AWESOME. I loved the way you iterated on your code; I love your pacing; and the result is RIPE for experimentation. THANK YOU.
Best programming tutorials I've found yet...nice to see some not-for-noobs tutorials that explain stuff...
@@ocdy-gk9pw not-for-noobs doesn't always mean advanced, beyond 'hello world' can still be called not-for-noobs, despite not as advance as using low-level tools or even making a new processor architecture
@@ocdy-gk9pw Assembly? Really? Nobody, literally nobody, needs Assembly nowadays.
@@privateger nope
@@ekremdincel1505 are you agreeing or disagreeing?
@@privateger I dont agree because some peoples need assembly, and I think they will too
you're such an energetic guy, love it!
This, my friends, is a great example of being in the flow state. I love being in the flow state.
THIS RIGHT HERE, is the reason I might even consider it possible for me to start coding. This is what I need. I love watching your process and seeing how you break down and analyze problems and solve it. Very pedagogical and educational. Thank you for existing. When the time comes, I will gladly pay for this kind of content.
You are a good teacher and i enjoy these challenges a lot. Thanks
dude, your mind works at staggering speeds, hence the tripping and clumsiness lol. Fascinating!
I just discovered the channel. You are now officially the Bob Ross of generative art. Very nice!
Edit: Well, I have seen your intro video now, so I guess you already knew about your Bob Ross situation. I can't stop watching these coding challenges, really cool stuff!
The way he teaches the concept truly creates an intuitive understanding of the topic.
i don't know how you got on my youtube recommended...but i thank you for doing this
I'm not sure either, but glad you watched, thank you!
#HappyRabbitHole you explain it so well thank you.
Yeah I have same. Great work Dan!
great tutorial! and it's really nice to see you use stuff like P3D and 2D arrays :)
+Xeronimo74 Thanks so much!
You’re incredible! It’s 4 in the morning and I can’t stop watching these
I followed this one step at a time and I'm absolutely new at this stuff. I must say that I kinda understood at times but I also felt lost AF, but the final result was awesome and it gave me a great starting point to mess with this code. THANK YOU.
Wow! Never knew such channel existed. Subscribed!!!
ua-cam.com/video/tjJM0iEeyNQ/v-deo.html
Have you notice how the quality drops when drawing random Z at 10:20? Tom Scott has a nice video talking about that.
"Why Snow and Confetti Ruin UA-cam Video Quality"
I was actually searching for this comment when the quality dropped and thought the same thing, nice
Wow! The use of perlin noise to simulate movement is very creative. Amazing!
This channel is just pure gold. I feel awful for not finding out about this earlier.
coool love this effect. i made a couple of these in max before but i like knowing i can do this in 22 min in processing aswell
Thanks for watching!
Thank you for the tutorial Daniel!!! You are epic!
+Andrei-Ducu Predescu Thank you!
Your videos are so entertaining I watch them even when I know over 5 programming languages.
Define know. Are we talking you can code an OS in any of them, or something more like hello world? Points in between are valid.
Oh, I'm so glad to hear!
you could have just left it at "your videos are so entertaining" lol
Know as in can code fluently. Some examples are Python bots, C# Windows apps, JS scripts, Lua scripts, and PHP scripts.
Second part is unnecessary
Subbed because of this video, simply for the idea of moving the y value to simulate flying instead of actually generating more terrain and moving the camera
well done!
First of all: great content and great channel overall!
Secondly: what drugs are you on and how can I get them?
+rock3tcat (ⵙⴰⵔⵓⵅ) chamomile tea!
how do you remember all of this?
hhHHhhAAHAH
Where i can order the camomile tea????
At 0:21 turn on subtitles
7:03 It looks like that thing was green.
I was so happy to see that you solved this camera movement problem exactly how I thought I would do it. I'm learning so much!
Man, english isn't my first language (actually is portuguese), and you're the best teacher I've ever had. Thanks, really thanks for all your work.
Still better than No man's sky
Tamim Al-suwaidi top comment XD
Tamim Al-suwaidi not anymore lol
@gonna darude sandstorm ya all It's a game
@gonna darude sandstorm ya all you dont know what it is
Stfu no man's sky is a terribly underrated game way too ahead of it's time. go home and play Fortnite.
Thank you so much for inspiring and guiding through, i would like to see videos on meshes like Voronoi,Delaunay,Quadtrees and Octrees . :)
+sridhar mamidala Adding to my list!
Yes, learning about quadtrees would be fabulous!
I love your energy in these videos. you make programming seem the way I think about it, fun :)
i found your channel through purple rain and must say i absolutely LOVE your videos! keep up the hard work
This looks amazing. I am a synthwave performer/amateur coder and I would love to use this as live visuals for my show. The one thing this is missing is being able to adjust the parameters in real time. Would there be a way for me to control noise amount, color, height, etc with something like a midi controller? Thanks!
Yes, look into midi libraries for Processing!
Wonderful. Will do that! Thank you!
I had to come back to this project but I found the MidiBus library and am now able to control all of the values with my synths! I am going to experiment with your other video lessons. Thanks for all the help!
You're awesome.
Thx.
This is really helpfull vid.This helped me to understand what is the Perlin noise better.Thanks.
I learned more from this guy, then from my teachers in past 4-5 years, thanks for exsisting! !
you are awesome!
This must be the tutorial they have used at Hello Games for No Man's sky...
i JUST found ur channel. i can now say i love how u talk, how hyper u r and just ur explanation :P keep it up
your tutorial is too neat that even beginners can understand this!!!
I can't believe you're 43! Only giveaway despite the fact that you look like you're 25, is that you act like a 40 year old and have gray hair. (Had to google due to my suspicions) :P
+Eivind Ludviksen haha. I thought I act like a 5 year old.
Daniel Shiffman I'll say you do act childishly (which I think is a good thing), but you have one of those slight qualities that remind me of my dad, which really thew me off and made me check.
Your videos are really entertaining and I love how you teach coding! I studied IT at high school and am now planning to study computer/information technology in university and your videos are a huge inspiration. When I started coding I had to pretty much teach most of it myself as my teacher wasn't the best, but I really like coding due to the linguistics of it. My favorite subjects have usually been foreign languages and more recently math and physics, so I can see myself in IT very comfortably. Keep up the great work! :)
Welcome to Minecraft people!
Eivind Ludviksen what's one of those qualities...
answerOfstupids I honestly don't know. I was pretty much 80% sure he was less than 30 years old until I checked. Maybe it's just a sum of all the puns and dad jokes over time that made me suspend my disbelief. There is also the fact that he grows a magnificent beard, which isn't super common with guys around 25 yeas old.
have you done a live show?
So east to understand and follo WOW! After reading and watching other procesing videos, you show and explain, the how & why. Usually one vets the how big not why it does or why one does it. Brilliant. Thank you so much. Got to look for you book someone mentioned.
Only recently came across this channel, and now watching everything xD. Have not learned Java yet but i feel like your videos make it so simple its going to be a breeze.
if you put the xoff and yoff = 0.05 and flying -= 0.01 will be like water.
+André Bardini oh! Great tip! 👍
Why has this channel been kept hidden from me? AWESOME!!!!
ua-cam.com/video/tjJM0iEeyNQ/v-deo.html
My favorite little thing about this channel is, the clicking sound of the button that he uses to change camera to whiteboard. Just love it
Oh I'm so sad I don't use it anymore!! (Switched to a StreamDeck)
Thanks for sharing your knowledge Daniel. Great work! Pure inspiration.
frameRate has to be inside setup() not draw() to work. ;)
You are great, you videos are getting better everyday, Shiffman :)
+Westis96 Ah yes, thanks for the tip!
+William Antônio Siqueira Thanks for the nice feedback!
Hey! Just found you. Fun videos :) Would you ever do a Haskell Challenge? :D
+t3hKazy I don't have any experience with Haskell but I will think about it!
Oh please do! I've recently started reading an excellent book about, and studying Haskell. Coming from Java and such, it's a really different experience!
You've got a lot of skills to be able to memorize all of these functions and just what numbers need to go where. Nice job and keep working.
Watching you never gets old, cool stuff!
9:50 Welcome to quantum mechanics ._.
Mobin92 can you elaborate?
he knows not
lol
What he probably means, is that the example program being run looks similar to how physicists imagine the quantum foam of the universe looks like.
Vacuum fluctuations, particles popping in and out of existence.
At 18:27 you could have divided X and Y by 10 instead of creating 2 more variable.
Doctor Cereal Was thinking the same thing but it later made sense when he added flying. He isn't doing a new project on the fly. He is just recreating something he has done before which is why sometimes the choices he makes aren't obvious until later.
Pravin Dahal
how come when I go to run it theirs just a white box that pops up with an error?
i think you should start on something easier Ian
Nat Bradz no, it was just a spelling error, the code was right.
thats a sign of a good coder you envision an end result and let the means meet the ends even if its not what the viewer thinks is happening
Wow, watched one of your videos a week back, that was my first video on fourier series,, not sure how I got so late getting this coding train! Covered most of your videos and enjoyed doing many of them :-) You are an excellent tutor and the boss in coding, content is well placed in all videos !! I am one very excited passenger :-D
I've updated code to move sideways, forward, backward and planning to fill the color based on current noise parameter
I'm using an arduino with an ultrasone sensor. The arduino is comunicating with my laptop by serial communication. That's how i'm getting the ego's back from the sensor. I'm trying to create a 3D image with these ego's. My question is: Is this possible using this principle?
I can get x,y,z coördinates but cant map them, can you help me?
Have you tried taking them out of the freezer?
similar to mr. doob's three.js webgl clouds
this might be my favorite channel rn i literally dont know javascript this guys just funny lmao
It's always nice watching something by someone who enjoys it.. whole different level of education and understanding.. THANK YOU !
still better than no mans sky
Kevin Blanks Not an impressive feat
+Kevin Blanks
So let's say No Man's Sky would cost like 10-20$ (which is much less than No Man's Sky is worth IMO) you would rather buy this script for the same amount of money?
I'm impressed.
YA actually lol
Kevin Blanks So you would rather buy a script for 20$ which was made in less than 20 min than a game made for many months doing the same world generation, just much more complex and with much more features. I guess that's logical.
ThePhoenix107 Yes we heard you
Now I know how minecraft works
Oooh, I'd love to do more videos about procedural terrain generation like in minecraft!
GreatMCGamer yes he is
dandeil1003 You are replying to the wrong person dandeil
sorry :P
this was awesome!
thanks for diving into vertex so fast! :)
You are how I learned and started to code! thank you for all you have done! I'm 13 and programming robots for my middle school all because of you, thank you!
So glad to hear!
why didnt u add a spaceship?
+timowthie oh I wish I had!
Please don't use variable names like "scl". "scale" or even "terrainScale" are better. Letters don't cost anything, modern screens are wide enough and your code also gets documented.
I agree, it's a good point.
Mobin92 in JavaScript there are built in Global Variables with names like 'scale' so he uses shorter language to avoid errors
i herd about perlin noise, i was so confused on how to make a array to hold the data. i didnt know about 2d arrays, thank you.
you make java so much easier to learn, thank you, you're like a virtual teacher
You lost me at Java
Hello Daniel, I never thought I would be wtching coding videos as entertainment. You made me understand ! keep up !!!
your videos are so wholesome, keep up doing this forever
this is a very good introduction for people interrested in coding shaders since i didnt really find many interresting things when i started , id recommend this for anyone that want to start with Shader coding and understand its basics :)
Ok this is a late reply. This is not really shader coding, because shaders are the part of the program that run on the GPU. In this program no gpu code is written at all. But of course this could be implemented as a shader.
Pretty Glad I found this channel. Energy is awesome.
You're my idol. Programming it's second nature to you, i love it!
im not in coding, but im love watching your videos, you have a good vibe and a great way of explaining. Thanks from switzerland ^^
Absolutely amazing. Thank you so much for a direct and understandable tutorial. Keep it going!
This is creative coding gold! Thanks Dan!
This is so impressive speed. I like high speed learning and this is it.
This is really awesome! My mind just blew up. You know what I was thinking? You can apply the Spherical Geometry thing of Coding Challenge 25 to make look like a planet. It would be very sick!
Loving the videos. Keep them coming!
Thanks for watching!
you're a freaking wizard dude, I love this
I love all the math that is involved with this!
this is awesome!! I am amazed at the things I didn't know that I didn't know!
never would've thought to use animate the "flying" like that!!
+endofmysteries I'm so glad to hear!
You have so much talent it is unreal.. I hope to be able to have a mastery like this
I love all ur vids man!!!
great vids! and TQ so much for ur great tutorials and great personality man! :)
thanks for watching!