playing with space, shape, colour & composition
sketch = p => {
let walker
p.setup = () => {
p.createCanvas(width, 600)
walker = walkerFactory(width/2, 600/2)
p.background(13,15,5)
};
p.draw = () => {
walker.update()
walker.show()
}
// try with a factory function (instead of class)
function walkerFactory (x, y) {
return {
x,
y,
create: () => p.createVector(x, y),
update () {
this.x = this.x + p.random(-10, 10)
this.y = this.y + p.random(-10, 10)
return this
},
show () {
p.stroke(222,61,131, 90)
p.strokeWeight(8)
p.point(this.x, this.y)
}
}
}
}
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
