wobble web

osc(30, 0.05, 1.8).out() // // s3.initCam() src(s3) .brightness(0.2) //.contrast() .color(0, -1, -1) .invert() .out() // //

spacer

olivia jack

https://ojack.xyz

LIVE 2025 | Workshop on Live Programming

what is wobble web?

visual && code editor

for making && sharing small websites

🌐 https://wwwobble.org

🌐

More details

- Just html. All state is contained in html. Some html elements can modify other elements. Compatible with other libraries


- Text editor morphs DOM tree rather than replacing it to preserve complex state

- Extensible via userland custom elements

- Export to a single html file + upload directly to static site hosting

- Experimental and in progress

🙂

custom elements

and custom tools

osc(5, 0.05, 0.8) .modulateScale(osc(2).rotate(0, 0.1).pixelate(10, 10), -0.94) .diff(osc(4, -0.01).kaleid()) .out() osc(5, 0.05, 0.4) .modulateScale(noise(1), -0.99) .diff(osc(4, -0.1)) .out() osc(10, 0.05, 0.8) .modulateScale(osc(2), -0.94) .diff(osc(4, -0.01).kaleid()) .out() src(s0).blend(s1).out() src(o0).modulateScale(s0, 0.02).brightness(-0.0001).layer(src(s0).mask(shape(8, 0.3, 0))).out()

Jack Murray-Brown, Andreas Dzialocha, Paula Haertel, Ari Robey-Lawrence, Chris Shank

Special Thanks

Collaborators

Funding

NLnet foundation logo