Touchdesigner est un langage de programmation visuelle utilisé pour créer du contenu interactif multimedia en temps réel, beaucoup utilisé par des artistes et des programmeurs pour créer des oeuvres, des performances et des installations.
Touchdesigner permet de créer en 2D et en 3D, avec des outils de rendering et de composition, des sorties et entrées vidéos et audio, de la possiblité de multi-écrans, du vidéo mapping, de l'animation, un moteur 3D, et des outils de programmation.
La programmation dans TD est basée sur la connexion entre différentes nodes, qui ont toutes des paramètres pour contrôler leurs opérations.
Usages types : mapping, VJing, interaction spectacteur/son/
Uses : mapping, VJing, interaction spectacteur/son/environement-visuels
Entrées :
- sons
- Contrôleur MIDI
- données : OSC, Serial (d'Arduino par exemple)
- etc
Sorties :
- vidéo en temps réel (vidéo-mapping, led-mapping, ...)
- données : OSC, Serial (vers Arduino, ...)
- etc
Projection de visuel interactif avec le mur Lidar
Calibration de la 3D camera avec Augmenta
Pixel mapping avec 9 barres led
Pixel mapping avec un controleur MIDI
Borischimp504 - photogrammetry
B2bk - photogrammetry
Kaoru Tanaka - generative visuals
Roelof Knol - interactive installations
No One's Image - generative visuals
Karlskene - generative visuals with laser and projection
Simon Alexander-Adams - generative visuals
The Interactive & Immersive HQ
Le réseau de nodes (network) est au milieu, la Palette est sur la gauche (on peux la fermer), les paramètres de la node selectionnée sont à droite.
En haut : pleins de petits paramètres de TD, le layout et ainsi de suite, et en bas : la timeline.
Pour ouvrir le menu des nodes, on peux soit double-cliquer n'importe où sur l'arrière plan, soit presser tab.
Il y a 6 catégories de nodes :
- COMP (Components), des nodes diverses et variées de bases, des contrôles.
- TOP (Texture Operators), pour les opérations sur des images 2D.
- CHOP (Channel Operators), pour l'animation, l'audio, les données.
- SOP (Surface Operators), les objets 3D natifs de TD, manipuler des points 3D, des polygones et des primitifs 3D.
- MAT (Materials), les matériaux et shaders pour les rendus 3D.
- DAT (Data Operators), pour les textes, les scriptes et les bases de données.
Les nodes les + utilisées
Geo+Camera+Lightpour créer un rendu 3D.
Noise: du random en image 2D, facile à animerComposite: mélanger plusieurs images avec différents types d'opérationsLevel: modifier la luminosité, le contraste, l'opacité, etc d'une imageLookup+Ramp: récoloriser une image suivant un dégradé de couleurs donnéesMovie File In: charger une image ou une vidéo dans TDRender: rendre un objet ou une scène 3D dans une image 2DTransform: modifier la taille d'une image, sa position, son orientation, ajouter un fond derrière les pixels transparentsMovie File Out: exporter une vidéo
Audio File In: charger un son dans TDConstant: créer des données constantes à utiliser dans le projetFilter: lisser un flux de données pour éviter les sauts trop hauts ou trop bas dans la courbeLimit: contraindre un flux de données entre un maximum et un minimum selon différentes opérationsMath: appliquer des opérations mathématiques sur des donnéesMouse In: récuperer les positions X et Y de la sourisKeyboard In: récuperer les évenements clavier
Grid: créer une grille 3DSphere: créer une sphèreTwist: plier ou twister un objet 3D selon différentes opérationsText: créer un objet texte en 3DTransform: modifier la taille, la position et la rotation d'un objet 3D
Constant: un matériau d'une couleur constanteLineouWireframe: un matériau avec juste le contour des polygonesPhong: un matériau avec une color map, une normal map, etc
Chaque catégorie de nodes a une couleur, et on ne peux pas connecter des nodes de différentes catégories. Pour connecter un CHOP à un TOP dans notre network par exemple, il faut soit utiliser un CHOPToTop node ou lier le paramètre choisi dans le CHOP à un paramètre dans le TOP. Le lien sera une ligne fine grise au lieu d'une ligne pleine de la couleur des nodes : c'est donc un data link.
Chaque node peux être customisé avec une multitude de paramètres particuliers à chaque, et les paramètres peuvent être reliés entre les différentes nodes, pour récuperer des datas de n'importe quel endroit du projet TD.
Pour ouvrir les paramètres, sélectionner une node et presser 'p'.
Pour connecter les nodes, on peux soit les relier entre elles depuis la sortie d'une node à l'entrée d'une autre, si elles sont de la même catégories (même couleur).
Pour qu'une node "regarde" une autre node, qu'elles soient de la même catégories (dans un Feedback TOP par example) ou non (CHOP to, SOP to, etc), il suffit de drag and drop la node observée dans la node observante.
On peux aussi drag and drop la node observée (ici : Audio Oscillator CHOP) dans l'encart dans les paramètres de la node observante (ici : CHOP to TOP), ou d'y écrire son nom. Il y a donc un data link entre les deux nodes.
Pour récupèrer les données d'une node (la plupart du temps, d'une CHOP) dans les paramètres d'une autre node, il faut d'abord cliquer sur le petit + en bas à droite de la node, pour activer le mode "Viewer Active".
L'apparence de la node devrait changer, et on peux alors drag and drop le nom du channel de donnée dans un encart des paramètres d'une autre node.
Ici le channel chan1 d'un Audio Oscillator CHOP, dans le paramètre 'period' d'un Noise TOP.
Une liste d'options d'export apparaît et on sélectionne "CHOP Reference" pour récuperer les données en temps réel.
On peux aussi écrire "op('NomDeLaNode')['NomDuChannel']" dans le paramètre.
On voit le data link en gris entre les deux nodes.
Pour avoir de l'aide rapidement pour une node qu'on ne connaît pas ou qu'on ne comprend pas, on peux clique-droit sur la node et choisir sur Operator Snippets pour ouvrir une page Touchdesigner avec un ou plusieurs exemples de l'utilisation de la node :
On peux aussi choisir Help pour ouvrir la page de la documentation de la node :
Pour animer un Noise TOP, on peux écrire "absTime.seconds" dans les paramètres Translate de l'onglet Transform des paramètres du Noise.
On peux donc faire en sorte que le noise défile horizontalement avec translate X, défile verticalement avec translate Y, et les animations les plus intéressantes sont souvent avec translate Z.
Le feedback loop de base : un TOP de texture, qui va dans Feedback TOP, qui va dans un TOP de modifiction TOP (level, blur, etc), qui va dans un Composite TOP avec le TOP initial.
Dans l'encart "Target" des paramètres du Feedback TOP, on drag and drop le Composite TOP, pour avoir un data link entre les TOPs qui ferme la boucle.
Dans les paramètres du Level TOP, dans l'onglet Post, on met une opacité inférieur à 1 (.9 par exemple), pour baisser l'opacité des layers de l'image au fur et à mesure qu'ils passent dans la feedback loop.
Dans les paramètres du Composite TOP, on peux choisir un mode d'opération comme Add, ou Atop.
Mon tutoriel sur comment ça marche les feedback loops.
Pour exporter une vidéo en .mov : créer un Movie File Out TOP à la toute fin du network, choisir un nom et une dossier d'enregistrement pour le fichier dans l'encart "File". Pour commencer à enregistrer, il suffit d'acord le bouton "Record" dans les paramètres et le désactiver pour arrêter d'enregistrer.
Il faut décocher le bouton "Realtime" au milieu du menu en haut, pour que la vidéo ne perdent pas en qualité si Touchdesigner lag un peu.
Pour envoyer la vidéo sur un media server en temps réel, il faut créer un Syphon/Spout Out TOP à la toute fin du network. On peux ainsi récuperer la vidéo dans Madmapper par exemple.
Créer un Audio File in CHOP, et activer si besoin le bouton "Mono" dans les paramètres pour avoir un seul channel au lieu d'un son stereo à deux channels.
On peux charger son propre son ou garder celui d'exemple de TD.
Le lier à un Math CHOP, aller dans l'onglet "Range" des paramètres, et changer d'abord les paramètres de "From Range". Je mets ici -0.7 et 0.7 parce que c'est le minimum et le maximum que je vois sur mon CHOP.
Puis changer le "To Range", je mets ici 0.2 et 0.3 parce que ça rendait le mieux.
Cliquer sur le petit + en bas à droite du node pour activer le Viewer Active.
Créer un Circle TOP, et dans les paramètres "Radius" X et Y, drag and drop le chan1 du Math TOP, et sélectionner CHOP Reference pour voir apparaitre le data link.
Le diamètre du rond bouge maintenant en fonction du son
Pour créer un network de rendu 3D de base, il faut 5 nodes :
- un objet SOP
- un
GeometryCOMP - un
CameraCOMP - un
LightCOMP - un
RenderTOP - un MAT
On commence par créer un objet SOP de notre choix, ici un Sphere SOP.
Créer un Geometry COMP en tirant un fil de la sortie de la Sphere et en pressant tab.
La sphere devrait apparaitre dans le Geometry. Créer un Camera COMP et un Light COMP, puis un Render TOP, et des data links devraient apparaitre entre les trois COMP et le Render.
Puis créer un MAT (ici un Phong MAT), et le drag and drop sur le Geometry, puis choisir "Parm: Material".
Avec le Phong MAT, on peux utiliser n'importer quel TOP comme texture pour le matériau en drag and drop le TOP sur la "Color Map" dans les paramètres du Phong.
Créer un Mouse In CHOP.
Créer un Circle TOP, et mettre un radius plus petit (0.05 par exemple), et une résolution plus grande comme 1280*720.
Le connecter à un Transform TOP.
Dans les paramètres du Transform TOP, drag and drop le channel "tx" du Mouse In CHOP dans le paramètre Translate X, et faire la même chose pour "ty" dans Translate Y.
Si le cercle ne correspond pas exactement à la position du curseur, on peux remapper les données de position pour qu'elles correspondent à la résolution de l'image.
Ajouter deux Select CHOP après le Mouse In, et choisir tx puis ty dans "Channel Names" dans chaque Select, pour avoir un CHOP pour chaque channel.
Ajouter un Math CHOP après chaque Select, et aller dans l'onglet "Range" des paramètres.
La plupart du temps, la position "tx" de la souris va de -1 (tout à gauche de l'écran) à 1 (tout à droite de l'écran), et "ty" va de -0.6 (tout en bas) à 0.6 (tout en haut).
On met donc ces valeurs dans la partie "From Range" des deux Math CHOP
On peux alors choisir les valeurs dans la partie "To Range" en bougeant la souris jusqu'aux bords de l'affichage du Transform TOP, et en mettant comme range la valeur où le centre du cercle correspond à la position du curseur aux bords et au centre de l'affichage.
Ici j'ai utilisé -0.6, 0.6 pour tx et -0.7, 0.7 pour ty.
L'onglet Range du Math CHOP marche en donnant le minimum et maximum actuel de la valeur, puis le minimum et maximum que l'on veux, pour que la valeur soit recalculée proportionnellement.
-
MediaPipe pour TD (FR) : utiliser le face tracking, hand tracking et squelette tracking pour créer de l'interaction avec un webcam à la manière d'une Kinect.
-
Visuels Audioreactifs avec TD (FR) : créer des visuels qui réagissent à des sons en utilisant le spectre audio.
-
Feedback loop in TD (EN) : comprendre et utiliser la feedback loop.
-TD <-> Arduino: communiquer via Serial entre Touchdesigner et Arduino.
-
Text effects in TD (EN) : faire des animations de texte.
-
Contenu pour le mapping (FR) : créer des visuels à utiliser comme média de video-mapping.
-
Utiliser Kantan pour faire du video-mapping dans TD (EN) : faire du vidéo-mapping directement dans TD (ne marche pas si bien).
-
Photogrammetrie dans TD (FR) : faire de la photogrammétrie (créer un nuage de points 3D en prenant pleins de photos) et la manipuler dans TD.
-
Ressources de Touchdesigner du MIR lab (avancé).