Both the fields of technology and visual art are extremely vast, deep and exciting to learn about. I explored the meeting of these two fields by integrating them together in small projects to investigate how generative art can be used in the industry. Using Javascript and an additional library known as p5.js (a Javascript version of the language Processing), I created many colourful, interactive and simple to extend my understanding of both programming and the importance of novelty in design.
This page works better on desktop, due to the interactive panels below.
Figure 1: Vines and Leaves
The above interactive panel uses a combination of nodes and random chance to generate 'leaves' along the pseudo-randomly laid path, or 'vine'. The default operation of the panel is to give users a taste of what the program is capable of, however interacting with the panel will show that clicking and dragging will allow them to create their own vines!
Figure 2: Noisy Lines
Noisy lines looks at my experimentation through the world of randomness, more specifically, Perlin noise. A form of randomness which produces more 'natural' or 'organic' random figures, Perlin noise was used in this generative piece to create overlapping lines, giving a sense of depth. Interact with the panel to reset it.
Figure 3: Easing Squares
This generation explored the ideas of 'easing', a commonly used feature in interactive programming. It involves slowly following a certain target (typically a mouse cursor), so that the user gets a perception of an object chasing around the target. To ensure that I understood the concept, I used a simplistic version of easing and shifted the centre of the square towards a specified target. The transparency of the squares also gives the perception of depth. Click to reset!
Figure 4: Chevron Tiles
To explore the illusions of the human mind, one of my first creations was a simple tiled chevron, with randomised colours. The size, rotation and position of the chevrons are all randomised per generation (click to create a new one!). The illusion is that of the width of the chevrons, it seems as though each row of tiles is of different sizes, however each is the same.
