Computer Vision avec Mediapipe dans TouchDesigner

⟶ Télécharger TouchDesigner : https://derivative.ca/download
⟶ Télécharger MediaPipe pour TouchDesigner : https://github.com/torinmb/mediapipe-touchdesigner

— MediaPipe + TouchDesigner

MediaPipe est une solution open source développée par Google dédiée à la vision par ordinateur ou computer vision.
Elle regroupe plusieurs modèles d'IA (machine learning) spécialisés dans la reconnaissance d’images en temps réel : photos, vidéos et flux vidéos.

TouchDesigner est un logiciel de création interactive très polyvalent. Un plugin a donc été développé pour intégrer MediaPipe à TouchDesigner.

— Ce que détecte MediaPipe

Les modèles de MediaPipe sont spécialisés dans :

Les mouvements et expressions du visage

L’anatomie, les mouvements et les signes des mains

Le corps et les postures (points de repères)

La détection d'objets

La segmentation des parties du corps

— Tester MediaPipe dans TouchDesigner

Installation

• Installer TouchDesigner puis créer un compte : https://derivative.ca/download
• Télécharger la dernière version de MediaPipe sur Github : https://github.com/torinmb/mediapipe-touchdesigner/releases/latest
  • Cliquez sur release.zip.
  • Dézippez le .zip. Le dossier contient 2 fichiers MediaPipe TouchDesigner.toe et MediaPipe TouchDesigner.1.toe (qui est une sauvegarde automatique), ainsi qu'un dossier de fichiers .tox (plugin)
  • Double-cliquez sur MediaPipe TouchDesigner.toe

MediaPipe TouchDesigner.toe

Une fois le projet ouvert vous vous retrouvez devant un réseau de noeuds appelés Operators, connectés entre eux. Si la webcam n'est pas active par défaut, cliquez sur l'operator MediaPipe en haut à gauche (qui est en fait un container, c'est-à-dire qui contient plusieurs operators), puis dans le panneau qui s'ouvre sélectionnez votre webcam dans la liste déroulante.

La majorité des modèles étant activée par défaut il est possible que votre ordinateur rame un peu. Désactivez certains modèles pour n'en garder qu'1 ou 2 actifs en même temps.

Ce projet est un démonstrateur des possibilités de MediaPipe. Il permet notamment de voir ce que voient les modèles, et ce qu'ils nous renvoient comme informations : la plupart du temps des points situés dans l'espace, avec des coordonnées x, y et z, ainsi que des valeurs situées entre 0 et 1.

Tout le travail va être de choisir les informations qui vous intéressent, afin de les intégrer dans votre projet. Par exemple :

• quand la tête penche à droite ou à gauche
• quand les mains sont agitées
• quand je fais le signe V de victoire
• quand je lève le bras au-dessus de ma tête
• quand je rapproche mes 2 mains
• quand la bouche est ouverte
• quand une pomme est détectée
• etc. etc.

Ce qu'il faut comprendre c'est que le programme détecte en continu, donc il est capable de donner une information précise et progressive, souvent sous la forme d'une valeur numérique située entre 0 et 1. Par exemple :

• quand mes 2 mains sont écartées, le programme me renvoie 1
• quand elles se rapprochent, à mi-chemin le programme me renvoie 0.5
• quend elles se touchent, le programme me renvoie 0

Autre exemple :

• quand il y a un visage présent : 1
• quand il n'y a pas de visage : 0

C'est avec ces valeurs que vous pouvez construire la suite de votre réseau, en les appliquant à des propriétés formelles, sonores, interactives, etc.

— Exemple : calculer le diamètre d'un cercle en fonction de la distance entre les 2 mains

Cet exemple permet de rediriger une valeur vers une autre, ce qui constitue le principe de base de tout projet interactif. Ici nous allons affecter l'écart entre les 2 mains au diamètre d'un cercle. Du côté du programme nous allons utiliser l'intervalle entre 0 et 1 qui correspond à l'écart entre les 2 mains vu par la machine, pour l'appliquer au rayon du cercle qui est lui aussi défini par un nombre entre 0 et 1 (0 : 0% de la taille de l'écran et 1 : 100%).

Étape 1 : Extraire la bonne valeur du modèle de détection des mains

Le modèle renvoie de nombreuses valeurs (cf. liste plus haut), mais tout ne vont pas nous servir. Nous devons donc, dans l'ordre :

• Afficher toutes les valeurs
• Sélectionner la valeur qui nous intéresse

Pour cela nous allons utiliser 2 opérateurs :

• Un opérateur Null qui va nous permettre d'afficher les valeurs brutes
• Un opérateur Select, pour sélectionner la valeur d'écart entre les 2 mains

Les étapes :

• Lancez TouchDesigner
• Supprimez tous les Operators présents sur le layout entre appuyant sur maj puis en traçant un carré de sélection
• Glissez MediaPipe.tox sur le layout. Un message d'information apparaît, cliquez sur Close. Par défaut TouchDesigner copie le plugin, assez lourd, dans votre fichier. Le mieux est de faire un lien externe vers le fichier MediaPipe.tox existant. Pour cela cliquez sur l'operator MediaPipe, puis dans le panneau choissiez Common, puis activez Enable External .tox. Enfin cliquez sur le bouton Reload juste à côté.

• Si votre webcam n'est pas sélectionnée, choisissez-là dans la liste déroulante de l'onglet MediaPipe.
• Maintenant glissez hand_tracking.tox sur le layout, à côté de MediaPipe. Connectez hand_tracking à MediaPipe depuis la sortie Output 2 (DAT) hands

Maintenant nous allons pouvoir ajouter les 2 opérateurs mentionnés ci-dessus : affichage des valeurs et sélection.

• Cliquez sur la touche tabulation du clavier et dans le panneau qui apparaît sélectionnez Null dans l'onglet CHOP.
• Reliez le null1 (qui est l'identifiant du Null que vous venez de créer) à hand_tracking en partant de la sortie Output 3 (CHOP) helpers

• Maintant quand vous montrez votre main, le null1 doit faire apparaître un graph de valeurs. Si vous zoomez sur null1 vous verrez le nom des valeurs apparaître, comme hand_velocity. Au milieu de ces valeurs il y a celle qui nous intéresse — hand_distance, et nous devons la sélectionner.

Création du Null en vidéo :

Pour sélectionner la distance entre les mains hand_distance :

• Appuyez à nouveau sur la touche de tabulation pour faire apparaître le panneau d'insertion des opérateurs.
• Choisissez Select dans l'onglet CHOP
• Connectez null1 et select1
• Cliquez sur select1 et dans les paramètres, choisissez hand_distance dans le champ Channel Names.

Création du Select en vidéo :

Nous avons maintenant un programme qui affiche une seule valeur détectée : hand_distance, exprimée par un nombre entre 0 (mains collées) et 1 (mains éloignées).

Étape 2 : Lier la distance entre les mains au diamètre du cercle

Il nous reste à créer un cercle, et de lier son rayon (radius) à la valeur de hand_distance :

• Créez un TOP Circle
• Passez select1 en mode vue active

• Sélectionnez circle1
• Le moment le plus important (en vidéo ci-dessous) : cliquez sur select1 et en maintenant le bouton de la souris/du pad appuyé, glissez la flèche sur le champ Radius des paramètres de circle1. Une liste apparaît au niveau du champ Radius, choisissez CHOP Reference.

Et voilà, vous pouvez maintenant tester votre programme en approchant et éloignant les mains. Vous pouvez afficher le cercle en grand sur le layout en cliquant sur le bouton rond bleu Display de circle1.