DYVO.XYZ

Labyrinth Like Pattern

This demo created based on idea from this video from Steve's Makerspace. Every page reload it will generate new pattern.

The code-generated shape that resembles a labyrinth actually stems from a rather simple idea. The entire canvas is divided into a grid, with each cell in the grid drawing a diagonal line from left to right or right to left. The main trick to making this feel like a real labyrinth is to use Perlin Noise instead of a random function.

Perlin noise is a type of gradient noise developed by Ken Perlin in the 1980s for computer graphics applications, particularly for generating natural-looking textures and terrains. It is widely used in procedural generation to create realistic and organic patterns. Perlin noise is a form of gradient noise, which means it generates values based on gradients (or slopes) in different directions. These gradients are smoothly interpolated between neighboring grid points. It operates on a grid-like structure where each point holds a distinct value, represented by consistent directional arrows. These arrows guide the algorithm in predicting smooth transitions between adjacent points, resulting in a seamless blend of changes akin to natural phenomena such as flowing water or wind-swept landscapes. By layering multiple patterns with varying levels of detail and influence, Perlin noise adds complexity to the generated noise pattern. Through this process, it produces coherent and visually appealing noise patterns that find extensive use in generating realistic terrain, organic textures, and lifelike visual effects across various digital mediums.