Cover Image for Fantasmagoria

ℹ see Phantasmagoria - noun - A dreamlike state where real and imagined elements are blurred together.

💡The work on this series started with an exploration on perceived shapes in a complex generator using noise and randomisation.

👻The deeper I was going into my exploration, the more I encountered scary or spooky iterations.

🧙‍♂️Inspired by the art initiated by Paul Philidor or Étienne-Gaspard Robertson, I decided to explore the creation of alternate, disturbing, undefined forms in the dark.


The construction goes through various phases aimed at generating an almost organic feeling, however the underlying graphics are based on simple lines.

First, the canvas is split in a grid, in which some rows and columns are excluded from the drawing.
Then, the remaining grid elements are given a color based on different patterns built from a combination of random number generation and distance techniques.

It can be one or two patterns, and they can have a similar or a different color palette. An "alteration function" dictates which grid element goes to which distribution pattern.

Once the distribution is done, the base layer is duplicated onto similar layers with subtle translation of each grid element, to create depth and a more organic feeling.

The code uses p5js as main dependency.


Color palettes

Fantasmagoria features 19 main paletes, and 2 alteration palettes

Alternative Palettes

In the case of an alteration (2 different groups in the same output), the second group can ether use the main palette or have one of the 2 existing alternative palettes.


6 different type of alterations can change the way the 2 patterns are distributed.


Primary pattern and Secondary pattern From a weighed list of 6 possible patterns, they define the way the grid elements are colored. If there is an alternate palette if shares the same pattern as the primary color.


Impacted by the fxiteration, this trait defines the precision of the positioning of the various layers. The higher it is, the blurrier the output will be.


The outputs having this trait will be visually affected.