# Code créatif S2 - UX2 - 2023

## https://hackmd.io/@losylam/UX2-S2-2223

## Programme du module

### Technologies

- programmation :
- objets et classes d'objets
- bibliothèques p5js (addons) ou externe
- outils : outils de développement (visual studio)
- web : utilisation de p5js pour le web

### Thématiques

Une ou deux thématiques par scéances :
- 3D / WEBGL
- Audio : lecture, streaming, capture
- Visualisation de données
- Apprentissage automatique (=Machine learning)

## Cours 1 - jeudi 9 mars

### Utilisation de visual studio code
- installation du plugin p5.vscode

### Exercice : dessin dans le canvas

### Démo : Balles rebondissantes en objets

## Cours 2 - jeudi 16 mars

### Démo live coding

### Utilisation de l'addon p5.sound
- entrée micro
- piano : [sketch](https://editor.p5js.org/losylam/sketches/1FQlyRvxm)

### Manipulation du dom
- [sketch](https://editor.p5js.org/losylam/sketches/PUAEdpOdC)

## Cours 3 - jeudi 6 avril

- [classe Chien](https://editor.p5js.org/losylam/sketches/LhmkrkEnJ)
- [falling donut](https://editor.p5js.org/losylam/sketches/_68XBf1uN)
- [falling donuts](https://editor.p5js.org/losylam/sketches/FwcbCKfa6)
- [falling donuts en fond d'écran](https://editor.p5js.org/losylam/sketches/kpBduLUWI)

### Projet
2 propositions :

- ~~projet **Recoded** : reprogrammer une oeuvre d'art génératif des années 60/70 et l'"augmenter"~~

- **Page concept** : Créer une page web concept pour faire la communication d'un projet culturel fictif (spectacle, film, album, expo...)

## Cours 4 - jeudi 13 avril

### Introduction au machine learning avec ml5

- [présentation](http://laurent-malys.fr/presentations/content/ux2/ml.html)
- [sketch p5/ml5](https://editor.p5js.org/losylam/sketches/kABLnRYbA) : poseNet

## Projet

- [noise + cube](https://editor.p5js.org/losylam/sketches/Wx41wW74M)
- [noise tube + cube](https://editor.p5js.org/losylam/sketches/adiODfVK8)
- [texture sur cube](https://p5js.org/reference/#/p5/texture)
- [font/police](https://p5js.org/reference/#/p5/textFont)
- [texture et masques](https://editor.p5js.org/losylam/sketches/r3geApLia)
- [parallaxe](https://editor.p5js.org/losylam/sketches/TwnFB0fra)
- [scroll on canvas](https://editor.p5js.org/losylam/sketches/5I8CFqrqQ)