web3d-integration-patterns

This meta-skill provides architectural patterns, best practices, and integration strategies for combining multiple 3D and animation libraries in web applications. It synthesizes knowledge from the threejs-webgl, gsap-scrolltrigger, react-three-fiber, motion-framer, and react-spring-physics skills into cohesive patterns for building complex, performant 3D web experiences.

Pattern 1: Layered Separation (Three.js + GSAP + React UI)

Pattern 2: Unified React Component (React Three Fiber + Motion)

Méta-compétence pour combiner Three.js, GSAP ScrollTrigger, React Three Fiber, Motion et React Spring pour des expériences Web 3D complexes. À utiliser lors de la création d'applications intégrant plusieurs bibliothèques 3D et d'animation, nécessitant des modèles d'architecture, une gestion des états et une optimisation des performances sur l'ensemble de la pile. Se déclenche sur des tâches impliquant l'intégration de bibliothèques, des architectures multi-bibliothèques, des expériences 3D pilotées par défilement, des animations 3D basées sur la physique ou des applications 3D interactives complexes. Source : freshtechbro/claudedesignskills.