Bougez devant la webcam et votre corps se change en fumée : des centaines de milliers de particules dessinent votre silhouette, puis s’envolent en volutes dès que vous vous immobilisez.
Vue d’ensemble
Smoke cam n’affiche que ce qui bouge. Là où vous faites un geste, un nuage de particules reprend votre image en noir et blanc granuleux. Quand le mouvement s’arrête, ces particules ne disparaissent pas d’un coup : elles se laissent emporter par un vent invisible, se dispersent, s’estompent, et laissent derrière elles une traînée de fumée qui garde un moment la forme de votre bras ou de votre visage.
Tout le plan de particules oscille doucement en 3D, ce qui donne du relief aux volutes. L’expérience est une adaptation de Smoke And Mirror de David Brown (Play-Create), enrichie d’une couche de vapeur qui transforme les points en vraie fumée, d’un vent animé dont on choisit la direction, de palettes de couleurs et d’un mode encre en négatif.
Fonctionnalités
- Un corps fait de particules : jusqu’à un million de points lumineux reprennent l’image de la caméra partout où il y a du mouvement.
- De la particule à la fumée : le réglage Vapor passe du rendu granuleux de l’original à une fumée continue qui se diffuse et dérive avec le vent.
- Vent animé et orientable : la fumée monte, se disperse dans tous les sens ou part vers la gauche ou la droite, avec une turbulence et une agitation réglables.
- Balancement 3D : le plan de particules tourne lentement pour donner du volume aux volutes, de la vue de face figée à une oscillation ample.
- Six teintes et un mode encre : Mono (l’original), Ember, Ice, Toxic, Violet et Neon, plus un mode négatif qui dessine de l’encre sur fond blanc.
- Dix curseurs de réglage : vapeur, sensibilité, durée de la fumée, force du vent, turbulence, agitation, balancement, nombre de particules, douceur, mélange avec l’image de la caméra.
- Capture photo et enregistrement vidéo : export PNG instantané ou capture vidéo du rendu, avec gestion dédiée du téléchargement sur iOS. Bascule caméra avant/arrière sur mobile.
Sous le capot
Chaque image commence par une carte du mouvement : la différence entre l’image courante et la précédente s’ajoute à une carte qui perd un peu d’intensité à chaque image. Un geste récent vaut donc 1, un geste ancien se rapproche lentement de 0. Cette valeur pilote chaque particule : à 1, elle reste à sa place et affiche la luminosité de la caméra ; plus elle baisse, plus la particule est poussée par le vent (proportionnellement au cube de ce qui reste à s’effacer) et plus elle s’assombrit. C’est ce qui fait se détacher la fumée du corps.
Le vent est un champ de bruit généré par un shader, qui évolue dans le temps au lieu de rester figé. Les particules sont dessinées comme des points d’un pixel sur un plan en perspective, additionnés les uns aux autres. Une couche de vapeur les accumule ensuite dans une image qui se floute, dérive avec le vent et s’efface doucement : chaque point laisse alors une traînée continue au lieu d’un simple grain. Un dernier flou circulaire, plus fort là où le mouvement est ancien, garde net le corps et adoucit la fumée.
Contrôles
| Touche / geste | Action |
|---|---|
| Clic / tap, Espace | Efface la fumée |
| V | Bascule particules / fumée |
| C | Change de teinte |
| W | Change la direction du vent |
| I | Mode encre (négatif) |
| P | Capture une photo PNG |
| R | Démarre / arrête l’enregistrement vidéo |
| S | Ouvre / ferme le panneau de réglages |
| H | Masque / affiche l’interface |
| F | Plein écran |
| Flèches | Sensibilité (haut/bas) et force du vent (gauche/droite) |
| Bouton caméra (mobile) | Bascule caméra avant / arrière |
Stack technique
- Vanilla JS, aucune dépendance, aucun build
- WebGL : pipeline 6 passes (vent procédural, carte de mouvement, flou, particules en points, vapeur en ping-pong, affichage)
- Shaders GLSL : lecture de textures dans le vertex shader pour déplacer jusqu’à un million de particules sur le GPU
- getUserMedia : flux webcam, avec bascule caméra avant/arrière sur mobile
- MediaRecorder : enregistrement vidéo, avec chemin de sauvegarde dédié pour iOS
Cas d’usage
Un miroir fantomatique pour danser, faire de la performance ou habiller une scène : chaque mouvement laisse un spectre qui s’évapore. Le mode encre et les teintes en font aussi un petit atelier de visuels à capturer en photo ou en vidéo.
Il suffit de s’arrêter de bouger pour partir en fumée.
