Member-only story
The Flows Is All
A P5js workflow that you can apply to (almost) any project.
What is P5js?
P5.js is a JavaScript library that simplifies creating interactive graphics and animations in the browser. It’s made for artists, designers, and beginners to coding. It offers easy-to-use functions for drawing, handling input, and working with visuals and sound.
It is an open-source tool built on HTML5’s canvas, with a large community, ideal for creative coding like art, visualizations, or educational projects.
Planning & Setup
Whether you’re creating a generative art piece, an interactive game, or a data viz, start with clearly defining your idea.
You don’t need to install anything or mess with files yet. You can start with the beginner-friendly P5.js Web Editor online.
Make sure to keep the P5.js reference website open in another tab.
You don’t have to get too deep into detail. A lot of the value in creative coding comes from experimentation and improvisation. Sometimes, planning entails just choosing a canvas size.
let w, h
function setup() {
w = windowWidth,
h = windowHeight
createCanvas(w, h);
}
