One of our teammates was inspired by how the terrain in Minecraft was generated so we wanted to teach about that.

What it does

It features four demos using Perlin noise, the first one using many settings like displaying it as terrain or in rainbow color and using custom noises and octaves, the second and third demos showing how natural movement can look using Perlin noise, and the fourth demo showing an image that progressively gains more layers.

How We built it

We built it using Node.JS as the backend for the server on, and then used the p5.js library to handle how the client rendered their screen. The client was rendered in HTML5, CSS, and JavaScript but mostly used the p5.js library to create graphics and HTML elements that the user can interact with.

Challenges I ran into

Our whole team didn't know how Perlin noise worked at the beginning, and only one out of three of us knew how to use p5.js, the other two not knowing how to program in JavaScript. This made a portion of the process dedicated to learning the language and then learning the p5.js library in order for us to gain a good understanding of what we were doing, and then learning all the concepts behind perlin noise and how to teach other people about it.

Accomplishments that I'm proud of

We created a very compact website with lots of customization to help the user interact with Perlin noise.

What We learned

We learned how to use JavaScript and how the p5.js library worked, as well as the basics of Perlin noise and how we could use Perlin noise for game development later on.

What's next for Perlin Noise Lab

The Perlin Noise Lab will hopefully gain more features to help the user, and maybe eventually a "course" describing how to implement Perlin noise in games.

Share this project: