Mosaic

February 19, 2018

Mosaic

(Github page)

June 2018: Update! Check out a machine learning inspired implementation of Mosaic (“Mosaic Learning”) here.

Mosaic is a webapp that uses algorithms to create visually engaging artwork in real-time, written using the p5.js library. Visitors to the site have the freedom to change the color, shape, and speed of the visualizations before them through the user interface. Alternatively, using the “Auto-Mosaic” feature, one can simply sit back and watch the visualization change these aspects over time.

At the outset of this project, I wanted to create a page that encouraged play and artistic creation. To that end, all the “control knobs” of the visualization are accessible, such that the display is entirely customizable. By manipulating these different controls, users get a greater sense of the algorithms that power the page. Finally, the export feature allows users to create their own art, and download it for their own personal use.

You can visit a live version of Mosaic here.

Some example still frames:

And here’s a short video example: