Randomness in Generative Art

When a digital artist designs a dynamic background for a website, they often face a problem where static shapes look boring. Static lines lack the natural energy found in real-world organic patterns like wind blowing through grass or water moving in a stream. By introducing stochastic elements into their code, artists can break the monotony of perfect shapes. This technique allows computers to generate unique visuals every time a user refreshes the screen. This is the application of randomness to creative design, which builds upon the mouse interactions we covered in Station 10.
Integrating Randomness into Visual Design
To make a computer program produce unpredictable results, we use a random number generator that acts like a digital dice roll. In programming, a standard function produces a numeric value that falls within a range you define. If you ask for a number between one and ten, the computer selects one based on an internal algorithm. This process is like a grocery store manager deciding which checkout line to open based on current traffic patterns. The manager uses a system to distribute customers, just as the code uses a function to distribute visual properties. When we apply these numbers to geometric attributes like position, color, or scale, the result changes with every single execution.
Key term: Stochastic — a process involving a random probability distribution that makes the final outcome unpredictable even when the underlying rules remain constant.
Using these values, you can create sketches that never look the same twice, providing a fresh experience for every visitor. You might assign a random X-coordinate to a circle so it appears in a different spot each time. You could also choose a random shade of blue to fill a rectangle, creating a subtle shift in mood. The following table shows how we map these random inputs to common visual elements in a typical generative project:
| Element | Random Input Target | Resulting Variation |
|---|---|---|
| Position | X and Y coordinates | Shapes appear in new locations |
| Color | Red, Green, Blue values | Every object has a unique hue |
| Size | Width and Height values | Shapes grow or shrink at random |
Building Dynamic Sketches with Code
When you write code to handle these variables, you must ensure the random values stay within the bounds of your canvas. If you allow a shape to spawn completely off-screen, the user will never see the result of your creative work. Most coding environments provide a simple command to generate these values within a specified range. You can see how this works in a standard JavaScript setup for a web sketch:
function draw() {
let x = Math.random() * 800;
let y = Math.random() * 600;
let size = Math.random() * 50 + 10;
fill(random(255), 100, 200);
ellipse(x, y, size, size);
}The code above generates a circle at a random coordinate every frame, creating a dense pattern of colorful dots over time. By adjusting the multiplier in the random function, you control the spread of the shapes across your display. This allows you to create dense clusters or sparse arrangements depending on your artistic vision for the project. Because the values reset every time the loop runs, the screen fills with a unique composition that follows your logic but avoids rigid repetition.
- Initialize the canvas with a set size for your workspace.
- Define a loop that triggers the drawing function repeatedly.
- Call the random generator to determine the next shape property.
- Apply the generated value to the shape before rendering it.
- Repeat the process to build a complex, layered visual output.
This method of layering random shapes creates a final image that feels alive and constantly evolving. It mimics the complexity of nature, where trees grow in similar shapes but with unique branches. By embracing this unpredictability, you transform your code from a static set of instructions into a generative tool that creates art on its own. The beauty of this approach lies in the balance between your rules and the computer's ability to surprise you.
True generative art emerges when you define strict boundaries for the computer while allowing it to make small, unpredictable choices within those limits.
But this model of simple randomness often produces chaotic results that lack structure, which leads us to the need for custom functions to manage complexity.