How to Code a 4D World from Scratch with P5js
Vložit
- čas přidán 11. 07. 2024
- Code from video: editor.p5js.org/BarneyCodes/s...
I used Perlin Noise to make a mesmerising breathing landscape with JavaScript and P5js. Perlin Noise is a great way to get started with generating terrain and in this video I take it a step further and add in a 4th dimension of time.
I hope you enjoy the video!
Follow me:
Support the channel: www.youtube.com/@BarneyCodes/...
Twitter: / barneycodes
Reddit: / barneycodes
Chapters:
0:00 Overview
0:40 Starting with 2D
2:03 3D Terrain
3:18 Boxes vs Mesh
3:32 All 4 dimensions
#creativecoding #p5js #javascript
If you'd like to see what else I'm working on, it would be great if you could wishlist my game Star Mining Co. on Steam! s.team/a/2584800/
Excellent work! I love the idea that it's breathing.
Thanks Steve!
Actually good video, well explained and calming to watch.
Keep it up!
Thanks so much, calming is exactly what I was going for! I could watch it all day hahaha
Amazing work and concept!! Offers soo much possibility!
Thank you!
amazing video, amazing concepts... thanks 👍
Wow, thank you so much! Glad you enjoyed it!
Bro, crazy🎉
Thanks!
wow you are the second person after Daniel shiffman to learn me p5js
I learnt a lot from Dan Shiffman too, he's the best! Glad you're liking my videos
I wonder if you made a video about the camera because I want to see it 😂
I didn't sorry! You can check out the basics of it all here though: p5js.org/reference/#/p5/createCamera
From memory, in this video I just set the camera position in a circle around the centre of the scene, and then use the lookAt function to make it point at the centre. Hope that helps!
good video, make me spin!👍👍👍👍👍👍👍👍
Can I make this on replit p5js?
I'm not really sure what replit is but I had a quick look. It definitely looks like you can use p5js on there, so this sketch should work fine. If you're going to put it on though, maybe leave a link to this video or my original code on the online p5 editor, cheers!
Using time is just cheating. That's like saying "I just made a 3D render using paint" and it's just a gif. Sure technically you added dimensionality to it but we all know when someone says 4D colloquially they're speaking spacial dimensions.
I'd argue you didn't even do that because it's an animation/interactive space that was already happening over time so instead of adding a dimension you simply repurposed another one making it unusable (eg you cannot animate this "4D" terrain because youve pinched time to express the fourth dimension).
This is great! You might like trying this with opensimplexnoise which will have less oscillating noise patterns! editor.p5js.org/codingtrain/sketches/MPqnctIGg
Thank you so much! That sounds great, I'll have to check out opensimplexnoise, thanks for linking that sketch!
Perlin noise is so accessible from P5/Processing that I pretty much always use it, it would be great if they had Simplex noise built in too!
Thanks again!