La programmation avec créative avec p5js

Processing est un langage de programmation développé à l'intention des artistes. Il offre de grande possibilités graphiques et il est orienté vers l'interaction. Nous allons dans ce cours utiliser la nouvelle mouture de processing, destinée au web : P5JS

Avant de commencer le travail, je vous propose de voir une courte vidéo d'introduction à Processing

Mais comment cela fonctionne t'il exactement ? Comment va t'on programmer ? Avec quels outils ?

Dessiner avec Processing

Au coeur de processing, il y a cette facilité à réaliser facilement des œuvres graphiques. Tout repose sur un ensemble de commandes assez simples qui permettent de programmer son dessin. Il suffit de découvrir les notions petit à petit.

Dessiner des formes simples

Dans un premier temps, nous allons nous intéresser au système de coordonnées et dessiner les formes les plus simples qui sont fournies en standard dans processing. Voici les différentes activités proposées

Les transformations

Toute la puissance des transformations mathématiques en géométrie cartésienne, qui vient à l'aide de nos scripts pour nous simplifier la vie.

Dessiner des formes complexes

Processing permet d'aller bien au dela des simples carrés, cercles, triangles et lignes. On peut avec processing composer des formes complexes, constituées de poygones voire même lissés au moyens de splines.

L'utilisation de la couleur

Dans toute démarche artistique ou créative, la couleur a une place importante. Elle est aussi importante en design par les information qu'elle porte. Pour être utilisée en informatique, certains éléments doivent être abordés : comment décrit on une couleur ? Comment peut on l'affecter ? Ces différentes activités vous donneront tous les éléments pour utiliser la couleur dans vos scripts.

La typographie

L'ajout de texte permet d'apporter du sens à l'expression visuelle. Processing dispose de multiples outils pour manipuler le texte et gère de façon assez souple la typographie. Ces activités sont là pour prendre en main ces outils.

Programmer avec Processing

P5JS est une bibliothèque qui permet d'écrire des programmes en langage javascript. Ces programmes vont nous permettre de créer des animations et des créations interactives.

Nous allons apprendre les notions fondamentales de la programmation en utilisant P5Js et le langage javascript.

Les variables

La notion de variable est fondamentale en informatique. Littéralement, l'informatique, c'est la science du traitement de l'information, ou la science du traitement des données. Pour traiter des données, il faut y avoir accès. Les variables, ce sont l'endroit où les données sont stockées.

Les répétitions

L'ordinateur est un moyen idéal pour répéter la même opération un grand nombre de fois. On peut, avec des jeux d'instruction simple, répéter un grand nombre de fois.

Les tableaux

Lorsque l'on doit stocker un grand nombre de données, ou encore un nombre variable de données, les variables doivent être regroupées. Pour cela, on utilise des tableaux. C'est ce qui permettra de faire tomber de la neige surl'écran, ou d'avoir pleins d'éléments qui constituent une animation. Il y a encore bien d'autres usages.

Les tests

Ce qui peut donner à l'ordinateur l'apparence d'un comportement intelligent, ce sont les tests. En effet, en fonction de la situation, l'ordinateur peut choisir de faire une action plutôt qu'une autre.

Les évènements

L'autre élément capital dans l'informatique est la gestion des évènements. Que doit faire l'ordinateur lorsque la souris est à une certaine position ? Qu'un certain bouton est cliqué ? Qu'une touche est appuyée ? On va voir les bases de l'interaction dans processing avec les évènements standards

Programmation avancée

Factoriser le code : les fonctions

La programmation objet

Petits projets

Ressources pour Processing