CODESTHESIA
Articoli
Tutorial
Codici
Lezioni
Risorse
Segui
Sostieni
Grafica generativa con p5.js ←
Indice completo
Informazioni
0. Introduzione a p5.js
1. Istruzioni grafiche di base
2. Configurazioni parametriche
3. Configurazioni iterative
4. Grafica cinetica e reattiva
5. Trasformazioni 2D e 3D
6. Grafica computazionale
7. Transcodifiche e data visualization
- Lettura e visualizzazione di file di testo
- Lettura e visualizzazione di dati strutturati
- Transcodifiche dei pixel
- Visualizzazione dell'audio
8. Dall'idea al codice... alla poesia
Rob Hansen e Garrick Dartnell, "Movie DNA" (UP, 2009), 2014
7. Transcodifiche e data visualization
Lettura e visualizzazione di file di testo
Caricamento di file di testo
Caricamento testo e visualizzazione sul canvas
Formato .csv (Comma Separated Values)
Esempio di file .csv
Esempio di file .tsv (Tab Separated Values)
Visualizzazione dati .tsv
Lettura e visualizzazione di dati strutturati
Strutturazione dei dati
Strutturazione dei dati in XML
Strutturazione dati in JavaScript
Combinazione di strutture dati in JS
Il formato JSON (JS Object Notation)
Lettura di un file JSON
Interpretazione coordinate (Geo)JSON
Temporizzazione dei dati JSON
Interrogazione di un servizio web
Lettura di un JSON da un servizio web
Transcodifiche dei pixel
Reinterpretazione dei colori
Reinterpretazione colori: esempio
Reinterpretazione colori: esempio pixels[]
ASCII Art
ASCII Art: esempio
Errori di decodifica: Glitch Art
Errori di decodifica: datamoshing
Computer vision
Computer vision: p5.js + objectdetector.js
Computer vision con le reti neurali: ml5.js
Visualizzazione dell'audio
Campioni audio
Esecuzione di un audio con p5.sound.js
Visualizzazione dei campioni audio
Spettrogramma
Interpretazione grafica dello spettrogramma
Formato (o protocollo) MIDI
Visualizzazione di file MIDI
Visualizzazione di input MIDI