A template for creating MP4s from p5.js sketches.
public/assets/
public/vendor/
src/sketches/sketch.js
src/index.html
Clone or download this repo.
Install dependencies:
cd bartlett-dfpi-mp4
npm install
Run npm run dev
to start editing in http://localhost:5000.
Replace src/sketches/sketch.js
with your sketch.js
. Update index.html
if you need any other references (e.g. clmtrackr).
Make sure to "export" each of your functions like draw
, mousePressed
, setup
, etc.
module.exports.draw = draw;
function draw () {
// your drawing code...
}
While running, hit Cmd/Ctrl + S to save a PNG into your Downloads folder.
Or, hit Cmd/Ctrl + Shift + S to save a MP4 into your Downloads folder.
(Real-time showing on screen)
Remove the dimensions
field in settings inside your sketch.js
code, this will make it fullscreen.
Then you can kill the dev server and run npm run start
and it will serve a more production-ready environment.