void draw01(){ Iterations 01 - 05 }
Iteration 01
This first iteration was just a starting point, looking at how user interaction can manipulate an image.
Mouse movement distorts the image to different degrees. Clicking generates a moving fragmented image. The degree of fragmentation is dependent on the mouse X position.
Iteration 02
This iteration builds on fragmentation and introduces shifting viewpoints in 3D space.
A fragmented image oscillates along the Z axis to different degrees based on colour brightness. Numbers fixed on a 2D plane separate from the image. Mouse position pans the user’s viewpoint of the image and the degree of distortion of the numerals.
Iteration 03
I wanted to explore 3D space and start to visualise how graphic planes & surfaces could be manipulated.
A fragmented image and a flat plane composed of cubes oscillate between themselves as well as the user’s point of view. Mouse movement pans the viewpoint, whilst clicking enables ‘hyperdrive’, where background colour refresh is disabled.
Iteration 04
At this point I began experimenting with how these Processing sketches could output stills from the interaction which I then used as material for mock posters made in InDesign. This facilitated the user interface becoming a tool in itself for the generation of new ‘traditional’ forms.




Iteration 05
Two of these posters were then recreated in Processing, enabling the user to interact and manipulate the poster content directly.
Mouse position alters the degree of fragmentation of the image.
Mouse position pans the user viewpoint and
sets the degree of fragmentation of the numerals.