Expériences interactives, animations et 3D
Rapports annuels interactifs, campagnes immersives, applications gamifiées, expériences WebGL et 3D, sites animés : des dispositifs qui captent l’attention sans sacrifier la performance.
Événementiel
Applications gamifiées
Une application jouable entre deux concerts, dans le navigateur, qui rend concret le tri des biodéchets. Exemple avec la grande capture des bio-monstres pour GRDF au Printemps de Pérouges. Nous concevons aussi des scènes WebGL et des jeux 2D pour les agences.
Rapports
Annuels interactifs
Chiffres animés au défilement, navigation par chapitres, visualisations de données, lecture sur mobile. Exemple avec le rapport annuel 2022 de l’IRU, organisation internationale basée à Genève.
Orientation
Jeux de découverte
Un univers familier détourné avec soin pour faire découvrir une filière à un public que les supports classiques touchent peu. Exemple avec le DigiBreizh Game de l’Opco Atlas : un restaurant imaginaire dont chaque poste révèle un métier du numérique, trois mini-jeux et une compétition entre établissements.
Sites
Animés
Transitions, apparitions progressives, navigation rythmée. Exemple avec le site de Jérémy Pancras, réalisateur, conçu comme un manifeste créatif.
Notre accompagnement
Cadrage
du message
Que doit retenir le visiteur, en combien de temps, sur quel appareil ? L’animation se conçoit une fois ces réponses posées.
Direction
artistique
Avec votre agence ou avec Gardeners, notre partenaire du groupe : maquettes, rythme, prototype animé validé écran par écran.
Développement
et performance
React, Next.js, WebGL : chaque animation est mesurée. Le budget de performance est posé au cadrage et tenu à la mise en ligne.
Mise en
ligne
Tests sur les appareils réels, mouvement réduit respecté pour l’accessibilité, mesure d’audience et de parcours.
Performance
et accessibilité
Une expérience interactive ne dispense pas du budget de performance : LCP sous 2,5 s, poids de page maîtrisé, contenu critique rendu en HTML. Les animations respectent la préférence de mouvement réduit et ne bloquent jamais la lecture. Une campagne doit fonctionner aussi bien sur un téléphone en 4G, entre deux concerts, que sur un ordinateur au bureau.
Côté technique
React et Next.js pour le rendu et le routage, WebGL (Three.js) pour la 3D, PhaserJS pour les jeux 2D, animations en CSS et transitions natives dès que possible. Les médias lourds sont chargés à la demande, les scènes 3D dégradées proprement sur les appareils modestes.
Pour qui ?
- Les organisations qui publient un rapport annuel ou d’activité
- Les marques, énergéticiens et collectivités qui mènent une campagne de sensibilisation
- Les agences de communication qui cherchent un partenaire technique pour leurs expériences
- Les organismes et fédérations qui veulent faire découvrir une filière ou des métiers
Études de cas
GRDF : Application gamifiée autour de la collecte et du tri des biodéchets, née en atelier avec ses équipes et déployée au Printemps de Pérouges avec les grands festivals : jeu web sans installation, créatures à collectionner, filière biométhane rendue concrète.
International Road Transport Union : Digitalisation du rapport annuel 2022 : chiffres animés, navigation par chapitres, visualisations, performance maîtrisée.
Opco Atlas : DigiBreizh Game, avec Signature Communication : un restaurant imaginaire pour découvrir les métiers du numérique, trois mini-jeux sur mobile, tablette et ordinateur, une compétition entre établissements. Engagement ×3. Aussi : Parishanghai (WebGL), Jérémy Pancras, LirÔlac.
Une animation doit aider à comprendre, sans jamais ralentir l’affichage.
L’essentiel
Nous concevons des expériences interactives qui servent un message : applications gamifiées pour les festivals et les événements, rapports annuels digitalisés, campagnes de sensibilisation, expériences WebGL et 3D, sites animés. Par exemple, pour GRDF, une application autour de la collecte et du tri des biodéchets, déployée au Printemps de Pérouges en partenariat avec les grands festivals. Notre règle : une animation doit aider à comprendre, sans jamais retarder l’affichage.
Questions sur les expériences interactives
Oui, si le contenu critique est rendu en HTML et si l’animation ne retarde pas l’affichage. C’est notre règle de conception.
Oui. Les expériences sont conçues d’abord pour le mobile, avec des scènes dégradées proprement sur les appareils modestes. Par exemple, la grande capture des bio-monstres se joue sur le téléphone des festivaliers, sans installation.
Oui, en co-traitance technique : votre agence garde la création, nous réalisons l’expérience. Plusieurs de nos expériences ont été menées ainsi.
Oui. Le contenu est repris et restructuré pour l’écran : chapitres, chiffres clés, visualisations, version imprimable conservée.
Une campagne a une date. Notre organisation agile permet de la tenir, y compris sur des périodes de quelques semaines pour une expérience ciblée.
Imaginer
votre expérience
Un rapport, une campagne, un lancement : un atelier d’une demi-journée suffit à poser le scénario.
