background preloader

P5JS

Facebook Twitter

Voici des exemples de réalisation avec P5JS qui permettent de voir les capacités de l'outil pour des visées artistiques

Article introductif à P5JS (en anglais) What originally drew me to Processing was that it wasn’t just a platform, it was a community.

Article introductif à P5JS (en anglais)

I was inspired seeing how Ben Fry, Casey Reas, and Daniel Shiffman had created and fostered this community over the years. I wondered if this community and the core values of Processing could actually bridge platforms; what would these ideas look like if they were combined with native web technologies — JavaScript, HTML, and CSS. My exploration of these questions began as small experiments. Over time, these grew and involved more people and eventually developed into p5.js. Having never been involved in a project like this before, I was very intimidated at first. Lyceelecorbusier. Le site web generative-gestaltung.de traite de la production d’images au moyen de programmes développés avec Processing.

lyceelecorbusier

Ce site est le support du livre éponyme publié en France par les éditions Pyramyd. Les codes proposés sur le site generative-gestaltung.de le sont sous Licence Apache, Version 2.0. Les caractéristiques majeures de la licence Apache sont, d’une part, d’autoriser la modification et la distribution du code sous toute forme (libre ou propriétaire, gratuit ou commercial) et, d’autre part, d’obliger le maintien du copyright lors de toute modification. Les codes proposés ont été ré-écrits pour fonctionner avec p5.js. Quelques petits exemples en P5JS. 1-6: Foundations of Programming in JavaScript - p5.js Tutorial. Exemples de code P5JS sur CodePen. Un MOOC sur P5JS avec Casey Reas et Laureen Mc Carthy. Session 1: Hello In this session, we will cover the following topics: 1) What is Code?

Un MOOC sur P5JS avec Casey Reas et Laureen Mc Carthy

2) Form and Computers 3) Drawing: Define and draw simple shapes; and 4) Color: Change the fill and stroke for shapes. You will also be introduced to p5.js so you can start creating your own work! Session 2: Variables and Loops This session will cover variables and how to store, modify, and reuse data; loops, and how to use Random to get random values from the computer. Session 3: Flow and Response In this session, we will cover the following topics: 1) Setup and Draw: Creating programs that run over time. 2) Input, Responding to the mouse and keyboard. 3) Drawing. 4) Make different tools with code. 5) Conditionals, Making decisions in code. 6) Easing.

Session 5: Synthesis A, Nonlinear Narrative In this session we will begin putting the elements together. Manuel FLOSS sur P5JS poru le webdocumentaire. Philosophie globale de la bibliothèque p5.js est une bibliothèque JavaScript ayant la même ambition que Processing: faire de la programmation un domaine et un outil accessible pour les artistes, les concepteurs, les professeurs et les débutants. p5.js reprend la philosophie de Processing, mais transposé pour le web: le support de rendu, c’est le navigateur.

Manuel FLOSS sur P5JS poru le webdocumentaire

Pour certains, cette librarie cera peut-être un excellent tremplin pour passer de Processing au Javascript, ou bien pourquoi pas tout simplement un bon pretexte pour s'initier à la programmation. p5.js permet de créer avec un panel conséquent de fonctionnalités, un espace de dessin interactif. Cependant, p5.js ne se limite pas à la zone de dessin car il permet de penser entièrement la page du navigateur comme un espace de jeu: p5.js, couplé à des extensions, permet d’interagir avec d’autres objets HTML5 comme le texte, les boutons, la vidéo, la webcam, et le son. Une bibliothèque javascript?