by NERDDISCO
nd-landscape-001
IPFS
16 October 2022•TEZOS•IPFS
After reading [Building a Vaporwave scene with Three.js](https://blog.maximeheckel.com/posts/vaporwave-3d-scene-with-threejs/) by [Maxime Heckel](https://twitter.com/MaximeHeckel) I was super inspired to generate a pseudo random landscape based on a single plane in ThreeJS.
The mountains and the road in the middle are sculpted out of the plane by using OffscreenCanvas to generate a low resolution grayscale displacement map: A dark color means no change to the plane = small mountains / flat road, where a light color means that the vertices are elevated = high mountains / road.
The colourful grid texture is also generated with OffscreenCanvas: It has the same size as the displacement map, so that the lines match the displaced vertices. Just the resolution is much higher.
The last part is a bloom effect (which is based on a shader) that lets the landscape glow... sometimes even too much.
The piece has 8 different features and there is a very small chance to receive a **starlight**.
This was the first time that I used a [pseudo random number generator](https://en.wikipedia.org/wiki/Pseudorandom_number_generator) combined with a seed from [fxhash](https://www.fxhash.xyz/doc/artist/guide-publish-generative-token#fxhash-code-snippet) to create a random artwork, that looks the same for a specific iteration. It was super much fun to enter this new realm of possibilities, especially because I love random AND parameterised visual experiences.
What is generative art for NERDDISCO? Let's find out!
## Interactive
- Use mouse or touch to zoom in/out and rotate the landscape.
- Press 's' on your keyboard to download a screenshot
## License
[MIT](https://nerddis.co/mit-license)
----
https://nerddis.co/nd-landscape-001
The mountains and the road in the middle are sculpted out of the plane by using OffscreenCanvas to generate a low resolution grayscale displacement map: A dark color means no change to the plane = small mountains / flat road, where a light color means that the vertices are elevated = high mountains / road.
The colourful grid texture is also generated with OffscreenCanvas: It has the same size as the displacement map, so that the lines match the displaced vertices. Just the resolution is much higher.
The last part is a bloom effect (which is based on a shader) that lets the landscape glow... sometimes even too much.
The piece has 8 different features and there is a very small chance to receive a **starlight**.
This was the first time that I used a [pseudo random number generator](https://en.wikipedia.org/wiki/Pseudorandom_number_generator) combined with a seed from [fxhash](https://www.fxhash.xyz/doc/artist/guide-publish-generative-token#fxhash-code-snippet) to create a random artwork, that looks the same for a specific iteration. It was super much fun to enter this new realm of possibilities, especially because I love random AND parameterised visual experiences.
What is generative art for NERDDISCO? Let's find out!
## Interactive
- Use mouse or touch to zoom in/out and rotate the landscape.
- Press 's' on your keyboard to download a screenshot
## License
[MIT](https://nerddis.co/mit-license)
----
https://nerddis.co/nd-landscape-001
digital artist, open source dev, mentor, visual spectacular, lightweaver, part of iieinander, schickmalzwo, Banana Bass Music, LiveJS, dekk & Synoa
128 EDITIONS
•0 RESERVES
minted
16 / 128
fixed price
1 TEZ
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH
Lorem ipsum project longer longer
0.00001 ETH