Midterm Project – Tron Terrain

https://editor.p5js.org/as13805/full/ZG70leVbF

The sketch appears to draw inspiration from the iconic sci-fi movie, Tron. Tron, released in 1982, is known for its distinctive visual style characterized by neon-colored, grid-like landscapes and futuristic aesthetics. The sketch’s terrain generation with lines and triangles resembling a digital grid resonates with the world inside Tron’s computer system. The use of a dark, black background, along with the bright, neon-like stars and the red attractors, strongly evokes the movie’s signature color scheme. This is meant to instill nostalgia in the movie’s viewers.

Tron aesthetic:

Futuristic Wallpaper 4K, Hallway, Neon Lights, Glowing, 5K

The code is organized to create a visually appealing 3D scene with a grid-like terrain, moving stars, and potentially moving attractors. The use of Perlin noise for terrain generation adds a dynamic and abstract element to the sketch. Object-oriented programming is employed to encapsulate and manage different elements, making the code more structured and readable.

Screengrab:


Hand Sketch

Pen Plotter sketch

Since this sketch uses webGL I could not use the SVG export code. Hence I resorted to a screenshot which i converted to SVG in inskscape. I made two changes in order to accommodate for the plotter format. First I reduced the number of rows and columns which effectively reduced the vertices of the sketch and in turn lowered the complexity. I also increased the x.off and y.off values which made the terrain more turbulent. This was to compensate aesthetically for the lower vertex count.

Pen Plotter timelapse:

Future improvements:

I want to make the experience more immersive by allowing the sure to control the camera angles, thereby letting them traverse the terrain on their own at any POV.

I also want to apply textures to the terrain. Instead of a plain grid, I can use textures to make it look like an alien landscape, a digital city, or any other thematic environment.

I also learnt a lot from the video below:

https://youtu.be/_Tyhfpxwips

Leave a Reply

Your email address will not be published. Required fields are marked *