Emmy Fortin
Affiche d'IntroSpectre à l'horizontale

IntroSpectre

Type de projet

Installation Interactive

Contexte

Projet étudiant

Compétences

Programmation

Création

Travail manuel

Modélisation 3D

Gestion de projet

Documentation

Communication

Crédits

Vidéo – Mikaël Laferrière

Sons & Musiques – SoundSnap

Montage sonore – Janie Aubert-Lanteigne

Logo et affiches – Hans Ritter-San Martin

Programmation – Jacky Southiphonh & Moi

Modèles 3D – Équipe d’IntroSpectre

Structure physique – Jean-Chrystophe Fréreault & Xavier Perras

IntroSpectre est une salle infinie immersive où miroirs et lumières réagissent à une boule de cristal, créant une expérience envoûtante et déstabilisante.

Réalisé dans le cadre de mon Projet de Fin d’Études à l’hiver 2025, ce projet d’installation interactive a été développé en équipe de sept personnes et sera présenté au LUMIFEST de Longueuil à l’automne 2025. Ensemble, nous avons imaginé un concept original répondant aux besoins et critères du client, puis nous avons concrétisé cette idée en mettant à profit toutes les compétences et connaissances acquises au cours de notre formation.

Logo IntroSpectre

Compétences

Programmation

Création

Travail manuel

Modélisation 3D

Gestion de projet

Documentation

Communication

Crédits

Vidéo – Mikaël Laferrière

Sons & Musiques – SoundSnap

Montage sonore – Janie Aubert-Lanteigne

Logo et affiches – Hans Ritter-San Martin

Programmation – Jacky Southiphonh & Moi

Modèles 3D – Équipe d’IntroSpectre

Structure physique – Jean-Chrystophe Fréreault & Xavier Perras

Collaborateurs
.trices

Janie Aubert-Lanteigne

Designer sonore

  • Design et intégration sonore

  • Modélisation 3D et animations pour les visuels

  • Construction de la salle de miroirs

  • Achat de tissus et peinture

  • Promotion du projet sur les réseaux sociaux

  • Perçage des balles de ping-pong et installation  sur les bandes LEDs

Jean-Chrystophe Fréreault

Animateur 3D & Travailleur manuel

  • Modélisation 3D et animations pour les visuels
  • Travail sur les maquettes
  • Gestion et création de contenus pour les réseaux sociaux
  • Soudure des adaptateurs
  • Travail manuel sur la structure de la salle de miroirs
  • Perçage des balles de ping-pong

Mikaël Laferrière

Scrum Master & Vidéaste

  • Gestion de l’équipe et du Trello

  • Animation des réunions quotidiennes

  • Filmer des extraits vidéo

  • Construction de la salle de miroirs

  • Réalisation des vidéos et des animations du « making-of »

  • Perçage des balles de ping-pong

  • Création des plans de tests (AQ)

Xavier Perras

Animateur 3D & Travailleur manuel

  • Conception de maquettes 3D de la gloriette

  • Modélisation 3D et animations pour les visuels

  • Achats

  • Prises de mesures de la gloriette

  • Création du guide d’installation physique

  • Soudure des adaptateurs

  • Travail manuel sur la structure de la salle de miroirs

  • Perçage des balles de ping-pong

Hans Ritter-San Martin

Designer Graphique/UX & Intégrateur

  • Construction de la salle de miroirs

  • Programmation et optimisation de la logique interactive dans TouchDesigner en Python

  • Création des visuels 2D dynamiques dans TouchDesigner

  • Conception du matériel promotionnel

  • Création de l’identité de marque (logo, design)

Jacky Southiphonh

Programmeur & Intégrateur

  • Mapping de la Leap Motion 2 dans TouchDesigner

  • Création de motifs lumineux pour les LEDs dans TouchDesigner
  • Programmation, intégration et ajustement de différents « triggers » pour les visuels et les LED dans TouchDesigner

  • Soudure des connecteurs, des adaptateurs et des fils, pour le Teensy et les LEDs

  • Construction de la salle de miroirs

  • Installation des balles de ping-pong sur les bandes LEDs

  • Création des plans techniques

  • Conception et calcul du circuit électrique

Ma contribution

Project Owner & Programmeuse

  • Gestion de l’équipe et du matériel
  • Gestion du Trello et de l’assignation des tâches avec Mikaël
  • Gestion du budget, des commandes et mise à jour de la liste de matériel
  • Achats, recherche et calcul de la quantité requise de matériels et de matériaux
  • Communications avec le client et avec l’équipe
  • Test de différents capteurs et de LEDs
  • Création des plans techniques
  • Conception et calcul du circuit électrique
  • Conception de la logique interactive dans TouchDesigner pour faire changer les visuels et les effets de LED
  • Programmation des capteurs de distance, des LEDs, du Teensy, de l’Arduino et du Leap Motion 2
  • Création de motifs lumineux pour les LEDs dans TouchDesigner avec Jacky
  • Programmation, intégration et ajustement de différents « triggers » pour faire réagir les visuels et les effets de LED avec Jacky
  • Soudure des LEDs, des connecteurs JST-SM,  des rallonges et des adaptateurs
  • Modélisation et impression 3D de la boîte électrique
  • Construction de la salle de miroirs
  • Installation des balles de ping-pong sur les bandes LEDs
  • Couture des toiles pour faire le toit et peinture des structures
  • Création du compte Instagram du projet
  • Rédaction du protocole de lancement et contribution au cahier des charges
  • Gestion de l’équipe, du matériel et des tâches lors du montage final

Étapes de création

.

Création de l'équipe & idéation

Dès le début du projet, nous avons formé les équipes en fonction des forces de chacun. En nous appuyant sur les besoins et les idées du client, nous avons entamé une phase d’idéation pour trouver des pistes de projets pertinentes. Chaque membre s’est vu attribuer un rôle clair au sein de l’équipe, favorisant une bonne organisation. Nous avons ensuite effectué une recherche d’inspirations et de projets comparables afin de nourrir notre réflexion. Cette démarche nous a permis de définir une idée de base, que nous avons ensuite raffinée collectivement pour en faire un concept solide et cohérent.

Prototype du projet & présentation client

Pour présenter clairement notre concept de projet au client lors de la présentation, nous avons rassemblé tous les éléments clés de notre concept dans une mise en page soignée sur Figma. La présentation comprenait les modalités d’interaction, l’expérience utilisateur, des projets comparables, nos inspirations visuelles et sonores, une première liste de matériel, un moodboard, des maquettes graphiques et des rendus scénographiques 3D de l’installation, ainsi qu’un aperçu de l’identité visuelle. Pour enrichir cette présentation, nous avons également fabriqué une maquette physique de la gloriette en carton, accompagnée d’un prototype interactif fonctionnel combinant LEDs, MDF recouvert de miroir autocollant, capteurs de distance et Leap Motion. Bien qu’encore en phase expérimentale, notre prototype a su capter l’intérêt du client. Ses retours constructifs nous ont permis de mieux orienter la suite du projet et de raffiner notre concept.

Rafinement & organisation du projet

Nous avons choisi la forme de notre installation ainsi que le style graphique et l’ambiance générale. Pour organiser le travail, nous avons réparti les tâches sur Trello, assurant une gestion claire et collaborative. En équipe, nous avons défini des objectifs précis à atteindre pour chaque sprint, en suivant la méthode AGILE afin de structurer notre avancement et garantir une progression efficace. Parallèlement, nous avons mené des recherches approfondies sur les matériaux nécessaires à la construction de la structure : supports pour intégrer les miroirs, miroirs eux-mêmes, balles de ping-pong, guirlandes LED, connecteurs, velcro, etc. Nous avons été informés du budget alloué pour réaliser le projet, et j’ai calculé le coût estimé en me basant sur les recherches de matériel et les quantités nécessaires. Au cours du processus, nous avons fait une croix sur certaines idées et réalisé des compromis pour adapter le projet aux contraintes techniques et budgétaires. Enfin, nous avons amélioré la logique interactive initiale développée sur TouchDesigner pour notre prototype, afin de la rendre plus fluide et adaptée au projet final.

Programmtion, Design, Son & 3D

Nous avons optimisé la programmation du Leap Motion, des capteurs de distance et des effets LED pour améliorer l’interactivité et la fluidité du prototype. Sur le plan créatif, nous avons développé les visuels, le design sonore et le montage audio afin d’enrichir l’expérience immersive. En équipe, nous avons sélectionné des éléments issus de films cultes à intégrer au projet. Nos animateurs 3D ont modélisé et animé plusieurs objets inspirés de ces références, tandis que notre designer sonore a approfondi ses recherches et retravaillé les ambiances audio initiales. Parallèlement, notre designer visuel a produit de nouveaux visuels sur TouchDesigner, perfectionné les précédents, et commencé la création des affiches promotionnelles. Jacky et moi avons affiné les modalités d’interaction et conçu de nouveaux motifs LED plus réactifs et cohérents. Nous avons testé et corrigé le mapping du Leap Motion ainsi que le capteur de distance, qui posaient parfois problème, pour garantir une meilleure réactivité et la stabilité du système.

Tests du projet

Nous avons réalisé des tests de réflexion avec une mini structure de miroirs, pour évaluer l’efficacité des réflexions des écrans dans les miroirs et valider nos fonctionnalités jusqu’à présent. Nous avons également testé les nouveaux motifs LED en interaction avec le Leap Motion et le capteur de distance, pour tester la bande LED qui sera installée à l’extérieur de la gloriette.

Travail manuel

Nous avons d’abord effectué des calculs précis afin de définir les dimensions optimales des murs et des supports de la structure. Une fois le matériel reçu, nous avons fixé des charnières sur les panneaux de MDF pour faciliter le montage, le démontage et le transport de l’installation. Des charnières temporaires ont été utilisées pour former des angles aigus dans les coins, renforçant ainsi la stabilité globale. Xavier a installé les supports au sol de manière amovible, permettant de les retirer et de les remettre sans endommager la structure. Pour le montage des miroirs, nous avons découpé et appliqué des bandes de velcro afin d’assurer une fixation solide tout en permettant un retrait facile, sans risque d’endommagement. Nous avons également testé les poutres du plafond pour déterminer les meilleurs emplacements de fixation, assurant ainsi la sécurité et la fiabilité de l’installation. Sur le plan électrique, nous avons conçu et fabriqué des adaptateurs personnalisés permettant de doubler les sorties du Teensy, passant de 8 à 16 canaux, ce qui a considérablement augmenté le nombre de LED contrôlables avec un seul microcontrôleur. Ces adaptateurs intègrent des connecteurs sur mesure, soudés à des connecteurs JST-SM, garantissant une connexion fiable entre le Teensy, l’alimentation et les guirlandes de LED. Nous avons également créé et soudé des rallonges pour les LED afin de permettre leur connexion depuis la boîte électrique. Chaque rallonge, soudée à un connecteur JST-SM, a été adaptée à la position précise de sa guirlande dans l’installation. Un peu plus tard, nous avons découpé nos guirlandes de LED à une longueur uniforme de 2,7 mètres afin d’en produire 15. À l’aide d’un plan de positionnement des LED, nous avons calculé les longueurs nécessaires pour chaque rallonge de fil, que nous avons ensuite soudées à leur extension respective, chaque extension ayant une longueur unique selon son emplacement dans l’installation. Les guirlandes ont été numérotées en fonction du plan de placement pour faciliter l’assemblage et le repérage.

Intégration des animations avec le montage audio

Janie a réalisé le montage des rendus des animations 3D synchronisées avec le son, puis elle les a exportés afin qu’Hans puisse les intégrer dans TouchDesigner. Ensemble, nous avons décidé à quel visuel chaque animation devait être associée. Hans s’est chargé d’incorporer les animations et leurs pistes audio dans leurs visuels respectifs. Avec Jacky, nous avons intégré les nouveaux effets LED, que nous avons ensuite assignés à des visuels cohérents avec l’esthétique générale du projet. Nous avons également ajouté les modalités d’interaction dans TouchDesigner, en intégrant les nouvelles compositions visuelles incluant les animations. Pour améliorer l’expérience globale, nous avons optimisé la réactivité des effets LED et introduit une légère variation de couleur ainsi que des rotations dynamiques dans les visuels, renforçant ainsi leur interaction avec la musique et les commandes.

Création des réseaux sociaux

Nous avons créé plusieurs pages sur les réseaux sociaux pour promouvoir notre projet. Hans, Janie et Jean-Chrystophe ont conçu du contenu promotionnel, notamment des bannières, et les affiches ont été partagées sur différentes plateformes. Mikaël a également réalisé une courte vidéo promotionnelle.

Optimisation du projet

Hans s’est chargé de l’optimisation globale des visuels sous TouchDesigner, en améliorant la qualité et la fluidité des rendus, ainsi que la sortie vidéo et le mapping pour un affichage précis sur la structure physique. Il a aussi affiné la logique interactive pour assurer une expérience utilisateur plus naturelle et immersive. De son côté, Jacky et moi avons concentré nos efforts sur l’amélioration des triggers qui déclenchent les mouvements dans les motifs de LED et dans les visuels, en optimisant la détection et la réactivité du capteur de distance et du Leap Motion. Nous avons également retravaillé les effets LED, en ajustant les intensités et les contrastes pour renforcer l’impact visuel et garantir une synchronisation fluide entre les interactions et les réponses lumineuses. Ces améliorations ont permis de rendre l’ensemble du système plus performant et cohérent.

Présentation & tests utilisateurs

Mikaël a créé un test utilisateur pour évaluer notre installation. Pour la première fois, nous avons monté l’intégralité de notre projet afin de réaliser ces tests dans des conditions réelles. Lors de cette étape, nous avons reçu la visite du client, qui s’est montré très impressionné par notre travail. Nous avons également pris en notes ses commentaires et suggestions. Nous avons ensuite fait passer ces tests à des étudiants et des professeurs afin de recueillir leurs retours et identifier les points à améliorer. À partir des résultats, nous avons compilé les observations pour établir une liste des corrections à apporter, classée selon trois paliers : urgent, important et non prioritaire.

Peaufinage de la salle de mirroir

Suite aux tests utilisateurs, nous avons décidé de repenser entièrement le toit de notre installation afin d’améliorer l’immersion et la finition visuelle. Ce travail a nécessité plusieurs étapes clés : recalculer les longueurs de fils nécessaires pour que les LED atteignent précisément leur position, en tenant compte du plan de placement et de la position de la boîte électrique. Nous avons ensuite ressoudé et ajouté de nouvelles longueurs de fils aux extensions de LED afin qu’elles soient ajustées correctement. Nous avons également cousu des toiles noires pour former une structure en cône faisant office de toit, et trouvé un filet adapté pour maintenir les guirlandes de LED en place selon le schéma défini. Une fois l’installation terminée, nous avons fixé les balles sur les guirlandes, puis appliqué une couche de peinture noire sur les murs pour unifier l’espace visuellement et renforcer l’effet immersif global.

Présentation & LUMIFEST

Nous avons installé notre projet au parc St-Mark à Longueuil dans le cadre d’une pré-présentation afin de le tester en conditions réelles. L’installation s’est déroulée efficacement et la gestion du temps a été exemplaire. Aucun problème majeur n’a été rencontré, ce qui nous a même permis d’ajouter un élément supplémentaire : des toiles en velours noir pour bloquer la lumière extérieure et renforcer l’immersion. Le client, une fois de plus, s’est montré très impressionné par notre travail. Les visiteurs du parc ont également exprimé un vif intérêt et de nombreux commentaires positifs, confirmant la portée et l’impact de notre installation. Ce test terrain marque une étape importante avant notre présentation officielle lors du Lumifest 2025 à Longueuil.