​p5.js er inspirert av Processing. Processing er et tekstspråk som ble utviklet av kunstnere og designere for å gjøre det lettere programmere grafikk og bevegelse.Processing bygger på Java og må installeres på PC/Mac. 

p5.js trenger ikke installeres. Det lett å dele kode, og bygge inn kode på nettsider. p5.js bygger på JavaScript.

Hello p5.js! med Lauren McCarthy og Daniel Shiffman!

Prøv selv

Prøv selv: Kort instruksjon

Nettside: p5js.org

Editor: editor.p5js.org

Getting Started with p5.js

En veldig god kort introduksjonsbok. Mange gode korte eksempler, og gode forklaringer.

Innholdsmessig identisk med Getting Started with Processing, eksempel for eksempel, men med p5.js.

Bestill et fjernlån på ditt lokale bibliotek, eller kjøp den på nett.

Eksempel 2.8 fra The Nature of Code.
Alle sirklene har en tiltrekningskraft på de andre sirklene som øker med størrelsen og minker med avstanden. Oversatt til p5.js.

Eksempel 2.5 fra The Nature of Code.
Sirklene faller fra «luft» til «vann» og bremses av en friksjonskraft som er avhenging av størrelsen. Oversatt til p5.js.

Eksempel 6.9 fra The Nature of Code
Flocking – fugleflokk – fiskestim.
Sirklene følger hverandre men unngår samtidig å kollidere. Oversatt til p5.js

Vesteraas leksjon nr 25
Partiklene skyter mot musepeker. De tegnes fra forrige posisjon til nåværende posisjon. Ved høy hastighet blir de korte streker. Etter hvert som hastigheten synker blir de punkter. Oversatt til p5.js.
Fra http://vestera.as/processing/

Animasjon av brøk
Punktene på sirklene beveger seg i forhold til hverandre som teller til nevner. Når det øvre punktet har gått tre ganger rundt, har det nedre gått én gang rundt.
Klikk i animasjonen for å lage ny brøk.
Trinnvis beskrivelse her.
Etter Roger Antonsens TED-talk (08:00)

Vesteraas leksjon nr 24
Lerretet fylles med fargede sirkler på en svart bakgrunn. Fargen bestemmes av posisjonen. Størrelsen bestemmes ut fra avstanden til musepeker.
Alle leksjonene oversatt til p5.js her.
Fra http://vestera.as/processing/