En quelques mots, Arduino est une plateforme permettant de prototyper de manière assez simple des objets dits intelligents ou des dispositifs interactifs et/ou automatiques. Il s’agit d’un ensemble de cartes électroniques pouvant être programmées afin de recevoir des données de capteurs (de lumière, de choc, de température, de distance, etc.) et envoyer des instructions à des actionneurs (moteurs, leds, enceintes, etc.) ou à des programmes. Ces cartes se pilotent grâce à une IDE (integrated development environment), logiciel permettant d’écrire des programmes et de les envoyer sur les différentes cartes par liaison USB.
p5.js est une librairie Javascript qui permet de générer des visuels à partir de codes, de variables, de fonctions et d'algorithmes. p5.js reprend la logique du logiciel libre Processing en exécutant le code dans une page web : il est donc possible d'intégrer du langage web (HTML, CSS, Javascript) avec un script p5.js.
D'un côté, Arduino est capable de recevoir des données de capteurs physiques réels, et peut stimuler des moteurs et des actionneurs. De l'autre, p5.js peut générer des visuels et interagir avec une interface web. Donc en reliant p5.js à Arduino, on peut facilement piloter une interface avec des contrôleurs tangibles, et on peut piloter des éléments tangibles via une interface. Bref, le futur.
Assurez-vous que l'IDE Arduino soit installé sur votre ordinateur.
- Récupérer la valeur d'un bouton
- Récupérer la valeur d'un potentiomètre
- Récupérer la valeur d'un capteur de lumière
- Faire clignoter une LED
- Allumer ou éteindre une LED avec un bouton
Pour créer une connexion entre Arduino et p5.js, vous aurez besoin de l'application p5.serialcontrol.
- Téléversez un programme Arduino sur votre board via le logiciel Arduino (récupérer la valeur d'un bouton par exemple), et fabriquez le montage associé
- Ouvrez le script p5.js comme base et dupliquez-le
- Lancez le programme : l'écran affiche "Serial Port is Closed"
- Ouvrez l'application p5.serialcontrol
- Une fois ouverte, retournez dans votre script p5.js et lancez le programme : un "0" s'affiche
- Avec votre doigt, appuyez sur le bouton de votre montage électronique : un "1" apparaît lorsque le bouton est pressé
Maintenant, votre script p5.js reçoit tout ce que le code Arduino envoie sur le Serial (Serial.print(), Serial.println()) : vous pouvez ainsi recevoir toutes les données émises par les capteurs de votre montage.
Pour approfondir :
- Lire les 3 premiers chapitres du manuel Floss dédié à Arduino
- Regarder le TED talk de Massimo Banzi, créateur d’Arduino
- Aller voir plein de chouettes projets pilotés par Arduino sur l’excellent CreativeApplications
- Aller voir d’autres projets mis en avant sur le blog d’Arduino
Aller plus loin :