schaum.cc

Bubbly website header for schaum.cc

The challenge here was to combine a p5.js canvas with an HTML slider. The way we solved this is to use the p5 canvas as a negative mask. The blob shape itself is transparent, only the inverted negative space is filled with white color and hides the slider underneath. That way the two stay separate and completely functional. The slider can still be fed easily through the WordPress CMS.

🪬 Based on some mindblowing physics wizardry by Juhani Halkomäki