05 mécaniques · rejouables en direct 05 mechanics · replayable live

Laboratoire

Chaque lab isole une technique d'interaction pour la comparer, la rejouer et la lire de près. Each lab isolates one interaction technique so you can compare it, replay it and read it up close.

CatalogueCatalogue Du plus simple au plus avancéFrom simplest to most advanced
01 DébutantBeginner

Scroll Lab

IntersectionObserver · Scroll-driven

Quinze mécaniques de scroll indépendantes — panneaux, parallaxe, progression, révélations, corridor — chacune isolée pour être comparée aux autres.Fifteen independent scroll mechanics — panels, parallax, progress, reveals, corridor — each isolated so they can be compared side by side.

Ouvrir
02 IntermédiaireIntermediate

Animation Lab

GSAP · Catalogue de déclenchement

Neuf concepts d'entrée à l'écran rejoués au passage dans le viewport plutôt qu'au scroll continu.Nine screen-entry concepts replayed as they enter the viewport rather than on continuous scroll.

Ouvrir
03 AvancéAdvanced

Barba Lab

Barba.js · Transitions de page

Le système de transitions réellement branché sur le site — corridor, rideau, épingle — documenté en dix scènes autonomes.The transition system actually wired into the site — corridor, curtain, pin — documented across ten standalone scenes.

Ouvrir
04 ExpertExpert

Three Lab

Three.js · Scènes WebGL au survol

Les scènes WebGL du site — trou noir, forêt, orbite — montées à la demande, en pilotage interne ou externe.The site's WebGL scenes — black hole, forest, orbit — mounted on demand, internally or externally driven.

Ouvrir
05 ExpertExpert

Carousel Lab

Three.js · Post-traitement

Une seule valeur — la position fractionnaire dans la liste — pilote six dispositions spatiales et deux transitions par post-traitement.A single value — the fractional position in the list — drives six spatial layouts and two post-processing transitions.

Ouvrir