Falling Blocks of Black and White with Artificial Physics

Falling Blocks (exp13blackandwhiteshapes (4))

Falling and bouncing boxes of black and white with artificial physics in a grey world that is constantly speeding and slowing and with periodic resetting. It was made using P5 for the graphics and matter.js for the physics engine.

Here is a screen capture video of it running:

To view the running animation click below:


The animation by default will have a crickets sound in the background which is nice but can be muted by pressing the ‘h’ key and, in the control panel, clicking/checking the ‘isMuted’ option. Next press the ‘h’ key again to make controls disappear. An interesting sound to accompany the animation is sound of Jupiter from a NASA recording. Open the following link in a separate tab/window:

Falling Blocks of Black and White with Artificial Physics

Triangular Patterns With Animation

Screenshot 2016-03-09 16.23.29


This P5 sketch involves constantly shifting triangle patterns with an invisible grid of possible triangle positions where only a single triangle may occupy a particular grid location at a given moment.

Various attributes can be changed with the control panel on the right but the changes will not be applied until the user clicks on the ‘resetScene’ button in the same control panel. There are a few exceptions including: the scale of the scene can be modified in realtime and the sounds are controllable with immediate affect (i.e. try changing sounds by modifying the ‘useAlternateSounds’ control, by changing the volume or muting it entirely).

Decreasing the number of rows or columns will increase the size of the triangles. Increasing the number of rows/columns will decrease their size and will result in a more sparse layout of shapes unless the ‘numBlocksOnReset’ attribute is increased as well.

To get a feel for some of the possibilities, try clicking on the ‘randomConfiguration’ button.

Also try changing the colour mode before changing or resetting the configuration to see its effect.


Triangular Patterns With Animation

Another Abstract Animated 2D Sketch

Screenshot 2016-02-24 09.01.26

This is sketch shows an animated perspective panning and zooming in and out from a scene of frequently changing coloured squares. It works well when paired with droning abstract electronic style music such as this song (https://itun.es/ca/5Sz7P?i=703437800) by The Field called 20 Seconds of Affection from their album Cupid’s Head. Or maybe this song (https://itun.es/ca/5Sz7P?i=703437698):  Black Sea, from the same album. And if those aren’t sufficiently interesting then try this song by Monolake (https://itun.es/ca/7Ln1q?i=282385327) called Arte.

Click below to see the sketch live:


And here are a few examples of the application running:

Another Abstract Animated 2D Sketch

Experiment with 3D Blocks and Story

Here shows animated blocks “living” within a strange limited artificial world which cycles through different phases “controlled” by the pattern of the blocks’ movement. The initial phase shows “intelligent” incomprehensible block movement in a relatively safe state where the surrounding walls’ blue ripples represent a shield force that protects them from harmful particles. After a while the blocks get tired and feel no motivation to continue and so stop. They rest. But as a result, slowly the blue ripples stop appearing on the surrounding walls. Then the walls show particles hitting them and sometimes those hits correlate to a hit of some central blocks. A hit block will flash and resist the disturbance. After a time the collective decides enough is enough and begins a new phase of synchronized movement in a kind of sine wave pattern. Eventually this succeeds in restoring the surrounding walls’ protective powers and the blocks regain autonomy. They regain their complex coordinated movements. Until the cycle repeats again.


Screenshot 2016-03-05 17.28.45

The speed of the blocks “inside” can be controlled by clicking and dragging the mouse or by touching the screen and dragging left and right.

Here is a recording of an example run:

Experiment with 3D Blocks and Story

3d Animated Blocks With “Intelligent” Movement

Screenshot 2015-12-20 17.38.07.png

This is another p5 experiment with floating objects that constantly reposition themselves atop different towers while avoiding conflicts with other moving objects that are attempting to land at the same spot. The colours and scene change periodically and there are subtle changes to how the floaters arrange themselves on the towers initially.

Some floaters come “from space” and some launch themselves back “into space”. Other floaters rotate and flip their way around the landscape’s “sky” to land on some other tower top that is available.

I find the animation interesting especially if you have patience watching.


Screenshot 2015-12-21 13.32.50.png

Here is a screen recording of an example 10minutes:

3d Animated Blocks With “Intelligent” Movement

Stars Falling Through Space

Screenshot 2014-11-16 21.00.06

I like looking up at the night sky in contemplation. Back when I was six years old I remember going to Toronto’s planetarium for the first time and being amazed. I was so glad that I was just old enough to get in (the limit was 6 years of age). When I sat in the deeply reclined seats with face upwards looking at the slowly blackening dome and pin sized spots of bright white light from the strange projector structure in the center along with the transporting music I WAS IN AWE! Maybe that was inspiration for this creative coding exercise…

You can view the live running code here:


Stars Falling Through Space

Triangle Patterns in Grid Of Time-Delayed Frames

Screenshot 2014-11-16 17.32.47

I wanted to experiment with image buffers and repetition and movement with simple geometric shapes. So I built this javascript, p5js, HTML5 canvas thing.

You can view the live running code here:


Here is a capture of a run:

Triangle Patterns in Grid Of Time-Delayed Frames

Twirling, rotating, Shifting Structures

Screenshot 2014-11-16 17.22.04

An experiment involving a never ending constantly changing scene of twirling, swaying, shifting and moving structures. This is interesting to watch with music.

You can view the live running sketch from here:


Here is a screen capture of an example 10+ minute run with default speed:

Twirling, rotating, Shifting Structures

Kalimba Bubbles and “Molecules”

Screenshot 2014-10-12 12.21.31

Here is an experiment involving colorful bubbles that expand, pop and join with others before hitting the screen sides to produce a kalimba sound recorded from my real-life kalimba.

You can view the live animation here:


Here is an example run:

Kalimba Bubbles and “Molecules”

Simple Soothing Waves Using Perlin Noise

Screenshot 2014-11-16 13.08.25

I find that watching waves is relaxing at the beach but since a beach is not always accessible I thought I’d try to create that aspect of one programmatically :)

You can control the speed of the waves by clicking anywhere in the waves. If you do you should see a slider control in the upper left part of the screen. Sliding all the way to the left will stop the waves and sliding to the right will speed them up. Clicking again in the waves will hide the slider control.

You can view it here:


And here is a recording of it in action:

Simple Soothing Waves Using Perlin Noise