Digital Wanderings

here, there, everywhere

“La tête dans les nuages” – Making of

The story

Pasted Graphic.tiff

La tête dans les nuages a été crée durant un atelier collaboratif, organisé par la réunion des musée nationaux / grand palais. Un WE dédié à inventer des applications avec une version beta de leur API (application programming interface), dans les locaux de Google à Paris.

Le déroulement de l’atelier se passe en 4 temps: constituer une équipe et trouver une idée; présenter l’idée et l’équipe en quelques minutes; mettre en place un prototype fonctionnel; présenter le prototype à un jury.Pasted Graphic 4.tiff

La proposition initiale s’adressait à la communauté des makers, le fond d’images enrichirait leur bagage artistique.

Pasted Graphic 5.tiffPuis, le lendemain, juste avant la présentation, j’ai tout changé durant mon trajet en métro. Il fallait faire quelquechose de différent. J’ai voulu abolir le clavier et la souris, utiliser autre chose  comme interface. Le concept de la tête interactive est née. Un croquis et quelques notes sur mon carnet, arrivée à la station Saint Lazare. Go get’em tiger.

Ce sera donc, un objet que tout le monde connait, une tête. Elle serait imprimée en 3D, munie de capteurs permettant de détecter une main qui s’en approche, et irait chercher des oeuvres d’art dans le fond d’image pour les présenter sur un écran. L’utilisateur associerait ses actions sur la tête aux images qui serait présentées, dans l’espoir qu’il se souviendrait de l’image, voir se l’approprierait.

Capture d’écran 2015-10-22 à 13.01.19La phase de réalisation commence. Je n’ai pas d’équipe. Tant pis. J’y vais tout seul quand même. Beaucoup d’huile de coude plus tard, quelques compromis, un peu de scotch, un peu de code, un peu de bidouille, et l’objet interactif devient fonctionnel, et est présenté au jury.Pasted Graphic 7.tiff

Pas de première place. Dommage. Mais … l’objet a géneré beaucoup de curiosité. Et plus tard dans l’année j’ai eu l’occasion de le présenter lors du lancement public du site web et de l’API, évènement organisé par … le ministère de la culture, pour ensuite, l’installer durant un mois dans la librairie Eyrolles boulevard Saint Germain à Paris.

Pasted Graphic 6.tiff  Pasted Graphic 22.tiff  Pasted Graphic 24.tiffPasted Graphic 25.tiff

Une version améliorée de l’objet a été faite pour ces évenements. L’objet est autonome, apres une étape de configuration du wifi, il suffit alors de brancher la pris. Auss, le dispositif est nettement plus robuste et compact que le prototype initial.

Making of

La suite de cet article concerne le making of de la tête, en images, et en simplifiant, comme des spécifications (ce que ça doit faire, et les choix). Si le détail technique ultra détaillé vous intéresse, faites le nous savoir, et on rédigera — si vous êtes plusieurs à le demander — un “howto”.

 

Matériel utilisé :

  • Une imprimante 3D, du filament, et un modèle 3D a imprimer
  • Arduino Mega
  • Raspberry Pi – os: rasbian wheezy
  • fil de cuivre emaillé 0.1mm
  • jumpers et 2 mini breadboards
  • condensateurs de 18pF, résistances de 1Mohm et 1Kohm
  • boite de filament 3D, du carton plume, du texte
  • fer à souder
  • corde à piano fine
  • dongle Wifi

 

Croquis / Vue d’ensemble

Sans titre     Sans titre 2

 

L’arduino et le raspberry pi seront placés dans une boite en carton, et la tête collée sur le dessus la boite.
Des fils de cuivre – qui serviront de capteurs capacitifs – sont connectés via un petit circuit sur un breadboard, à l’arduino. Ces fils traversent la boite, puis la tête, pour traverser la paroi et être collés sur différentes zones de la surface extérieure (nez, bouche, etc.).

 

La tête imprimée en 3DHeadGraphic.tiff

Le modèle 3D de la tête vient de thingiverse – une collection d’objets imprimables, “gratuits”, ou plutôt, “open source” (on se sert comme on veut, mais on a l’obligation de partager ce qu’on en a fait). J’ai choisi un modèle dérivé du trophée des oscars …

Pour pouvoir imprimer l’objet, il faut le “slicer”, cad demander à un logiciel de découper la tête en tranches et de générer une séquence d’opérations que l’imprimante 3D executera (déplacer la buser, extruder, etc).

La majorité des makers se servent de l’un des deux softs suivants : Slic3r, ou Cura. Si vous voulez en savoir plus, le guide d’utilisation de slic3r est assez bien fait (et en anglais…)

curaGraphic 1.tiff  Pasted Graphic 2.tiff  Pasted Graphic 9.tiff

Une fois l’objet imprimé, on a percé des trous de 0.5mm sur la surface de la tête, au niveau de chaque zone tactile; et découpé un accès dans la base de la tete, pour pouvoir accéder à l’intérieur et “tirer” les fils de cuivre; enfin, avec beaucoup de patience, inséré les fils de cuivre, en prenant bien soin de marquer les fils avec des étiquettes pour designer les zones.

    

Le fil étant trop fin pour qu’un simple tronçon d’un cm donne des mesures exploitables, on a augmenté l’effet, en augmentant la surface de contact: les fils sont enroulés en spirale (ou presque…) et écrasés sur la surface de la tête.

 

 

Arduino & Co

Un Arduino, c’est un contrôleur. Ca ressemble beaucoup à un ordinateur, mais ca ne l’est pas. Il y a beaucoup de différences, comme par exemple, l’absence d’un OS (operating system, comme windows, ou OSX, etc.), ou encore la capacité à réagir en temps réel, ou de piloter directement des circuits électriques. Arduino, c’est eux. C’est un projet open source, né dans une école de design de la ville de … Arduino en Italie. Grace à eux et toute une communauté open source qui s’est formée, programmer ces contrôleurs est devenu – nettement – plus facile qu’avant. On leur dit merci, on achète les composants originaux et pas de clones – d’abord pour les supporter financièrement, et ensuite, parceque parfois les clones ca a de beaux ratés qui peuvent devenir dangereux).

— fermons la parenthèse 

 

Le rôle de l’Arduino sera de mesurer les variations de capacitance sur chacun des fils de cuivre (note: les fils de cuivre qu’on a utilisé sont enrobés d’un email, donc isolés. C’est — très — important de ne pas toucher des fils dénudés, même si les courants sont ridiculement faibles), et aussi, de transmettre les mesures sur le port série (sera connecté au raspberry pi).

Pour faire la mesure, on se sert de la librairie capsense (page sur le site arduino, et sur instructables)

Pasted Graphic 2_1.tiffLe code est assez trivial, en utilisant la classe dans la librairie, on instancie un objet pour chaque circuit de capteur, puis à chaque boucle, on fait une mesure pour chaque capteur, et transmet sur le port série une chaine de caractères ( mesures de chaque capteur, séparées par un espace).

Pour s’assurer que le dispositif marche, on a pris le soin de faire des tests … et éviter de devoir revenir en arrière et modifier le circuit)

Aussi, le circuit est fait relativement proprement, en conservant les étiquettes, au cas où on aurait un jour besoin de pouvoir identifier la cause de dysfonctionnements.

Pasted Graphic 7_1.tiff

Reste à concevoir un boitier pour regrouper le tout et le rendre transportable. Coup de bol, la boite en carton qui contenait le filament de l’imprimante 3D … est aux bonnes dimensios (un peu juste, mais ca nous a eviter de devoir fixer les composants car ils se tiennent en poussant sur les bords, cela dit, on aurait du fixer les composants plus fermement …)

Pasted Graphic 9_1.tiff Pasted Graphic 10.tiff Pasted Graphic 11.tiff

C’est plus facile a assembler en dehors de la boite, puis de tout caser dedans … mais à y repenser, on aurait peut être du prévoir l’étape d’assemblage (connecteurs & co).

 

Raspberry Pi

Le raspberry pi c’est un ordinateur “barebone”, il n’a pas de disque, pas de boitier, c’est tout petit, ca consomme très peu de courant, etc. Il a été concu par un anglais, qui s’était mis en tête de démystifier l’architecture des ordinateurs, et aussi de le rendre accessible à beaucoup de gens. La communeauté des dev et des maker s’en est emparé immédiatement. Un ordinateur à moins de 50 euros, qui peut jouer des vidéos directement sur la TV, ça donne tout de suite envie.

— fin de la parenthèse

 

Le raspberry pi a pour rôle de recevoir les mesures de l’arduino, les interpréter, choisir des oeuvres d’art et les afficher sur l’écran. Pour mettre cela en place le plus rapidement et proprement possible, tout en permettant l’évolution future du dispositif, on a :

Pris un OS (operating system) unix que la majorité des makers utilisent – Raspbian Wheezy

Utilisé python pour recevoir les données de l’arduino en temps réel et les mettre à disposition d’autres programmes qui vont tourner en parallèle.

Etabli une connection réseau en utilisant un dongle wifi qui marche sur cet ordi miniature, et passé beaucoup de temps à reconstruire la configuration…

Installé le duo classique Apache pour servir des pages web et Php pour pouvoir traiter des requêtes au niveau du serveur, entre autre, pour déclencher un son.

Affiché la page web sur le navigateur web Chromium, parcequ’on peut le lancer en contournant les règles de sécurité définie par le W3C (l’API nous a embêté avec les règles CORS).

Ecrit une page web basique qui contient la charte graphique via le CSS et des conteneurs html5 (pour jouer le son). Comme ça le code est portable partout.

Le contenu est piloté par du code en javascript — parcequ’on aime bien javascript — il va chercher les données de mesures, décide si l’utilisateur a suffisamment embêté un fil en cuivre, et si c’est le cas, associe des mots clés dépendament du/des fil(s) touché(s), et va chercher, via l’API, des images et des descriptifs dans le fond d’oeuvres du RMN-GP, les met en forme, attend que tout se soit chargé (internet c’est parfois lent), et affiche l’image

Ecrit quelques scripts en bash et utilisé des packages pour automatiser le lancement du navigateur, le mettre en plein écran, lancer la réception des mesures,  arrêter automatiquement la machine a 19h, vérifier si la température ne s’élève pas anormalement, etc.

Bien entendu, le raspberry pi est connecté à une TV ou à un projecteur, ce qui permet de voir la page web … sinon ca n’aurait pas vraiment de sens …

 

Le présentoir / Finalisation

Pasted Graphic 19.tiffLe présentoir a été fait avec du carton plume, que l’on a coupé et plié, de manière à ce qu’il constitue un couvercle qui vient par dessus de la boite qui contenient l’electronique.

Pasted Graphic 17.tiffPour effectuer les plis, on a pris soin de découper des V d’un coté du carton plume. Cela permet de faire des pliages plus propres.

Pasted Graphic 18.tiffLe présentoir se glisse par dessus de la boite, et il est maintenu aux angles par des cornières … imprimées en 3D …

Pasted Graphic 20.tiffEt la tête originale a été ajoutée sur le côté, parceque certains la préféraient avec tous ses défauts !
Et un texte explicatif pour inspirer ceux qui aiment lire.

 

Et voila.Pasted Graphic 19.tiff

Direction la cité des sciences et de l’industrie, pour livrer l’installation en pature à 20 gamins de 7 à 10 ans, et en espérant (ou plutôt, on est resté collé au clavier pour reprendre le contrôle, au cas où) que les recherches dans le fond d’images éviteraient une oeuvre de Gustave Courbet.

 

 

 

Capture d’écran 2015-10-22 à 15.12.08

ramkam • October 22, 2015


Previous Post

Next Post

Leave a Reply

Your email address will not be published / Required fields are marked *