Weather Lines
Generative art · MEDIARTS 206
With Masha Nikishina
Masha Nikishina and I made a generative artwork that changes with a city’s temperature and wind. We used p5.js to turn those readings into color and layered motion.
We treated weather as material for an artwork. Temperature sets its palette, while wind changes the speed of one particle layer.
Choosing what the data changes
We mapped temperature from blue to red and used wind speed to vary one of the three particle layers. The other layers keep a constant speed. The sketch reads the city’s weather from OpenWeather at startup and keeps those values throughout the animation.
| Input | Visual change |
|---|---|
| Temperature | Changes the color between blue and red. |
| Temperature | Changes a multiplier that the sketch uses to calculate particle direction. |
| Wind speed | Changes the speed setting of one particle group. The other two groups keep constant speed settings. |
Building continuous trails
Perlin noise gives nearby particles related directions, so their trails form continuous curves. Temperature also changes the direction calculation.
A faint black layer fades older positions on each frame. This leaves trails, so movement remains visible after a particle has passed.
The curves are generated from noise values. They do not represent measured wind direction.