Voici quelques lignes de code pour vous aider à faire vos premiers pas en Processing.
Je vous conseille de wikipedier/googler processing.org ; être étudiant en graphisme et ne pas connaître l’existence et les possibilités de cet outil serait dommage !
Deux ouvrages en français sont sortis cette année et disponibles dans les bonnes librairies (j’ai déjà parlé du premier ou dernier).
Un manuel en français est disponible gratuitement : http://fr.flossmanuals.net/Processing/Introduction.
De très bons cours sont en ligne :
Là : http://www.ecole-art-aix.fr/rubrique81.html
et chez le dernier : http://www.hyperbate.com/dernier/?page_id=2482
Les anglophiles trouveront leur bonheur sur le site officiel !
Et enfin, ceux qui veulent un support vidéo (eng) : http://www.youtube.com/watch?v=rJrh0RipoVo
il y a une dizaine de vidéos :)
Voici une humble contribution en support de mes cours.
INTRODUCTION
En général, on commence par apprendre ses 3 lignes et leur structure.
Comme dans de nombreux langages, // permet de commenter la ligne.
Exemple 1 :
void setup(){ size(800,600); // pour avoir une fenêtre de 800 par 600 pixels. }
Sur Mac l’accolade :
alt + ( = {
alt + ) = }
Pour voir le résultat, on compile avec le bouton lecture en haut à gauche.
Première remarque, il ne se passe rien, seconde remarque, c’est gris.
Exemple 2 :
void setup(){ size(800,600); // pour avoir une fenêtre de 800 par 600 pixels. background(0); // fond noir }
C’est de la folie tout ça ?
La commande background permet de changer la couleur du fond.
À tester :
background(255); background(0); background(255/2); background(255,0,0); background(0,255,0); background(100,255,50); background(100,100,100); background(#ff6600); background(red); // ne marche pas background(#f60); // ne marche pas
Plutôt simple ?
Non ?
Astuce : Dans le menu File Edit (…) Tools -> Color Selector
On continue avec le setup et le draw.
Exemple 3 :
void setup(){ size(800,600); } void draw(){ }
Exemple inutile servant juste à montrer la syntaxe du draw. Le draw est le rafraichissement d’écran en boucle, comme si vous clignez des yeux. Le setup s’exécute juste une fois en lancement du programme.
Exemple 4 :
void setup(){ size(800,600); frameRate(2); //la cadence en images par seconde ou FPS pour frames per second } void draw(){ background(random(255)); //un gris aléatoire }
J’ai ralenti la cadence pour nos amis les épileptiques et pour faire le test j’ai utilisé random(unChiffre) qui donne un chiffre (à virgule) entre 0 et 255.
À tester :
void setup(){ size(800,600); frameRate(2); //la cadence en images par seconde ou FPS pour frames per second } void draw(){ background(random(255)); //un gris aléatoire background(0); // noir }
puis
void setup(){ size(800,600); frameRate(2); //la cadence en images par seconde ou FPS pour frames per second } void draw(){ background(0); // noir background(random(255)); //un gris aléatoire }
Voilà, ça fait 5 fruits et légumes notions de processing pour aujourd’hui.
tags : processing