Auryntix
Agence IA & Web · 2026 — en cours
Site vitrine d'une agence IA fondée à Dakar
Décision clé : GSAP + ScrollTrigger remplace Framer Motion pour des animations scroll 60fps sans layout shift
Auryntix est une agence IA & Web basée à Dakar. Le site devait incarner le positionnement premium de l'agence — animations fluides, identité forte — sans les compromis habituels des templates SaaS génériques. Framer Motion introduisait des layout shifts et des re-renders inutiles sur les sections hero et expertise.
Migration complète vers GSAP 3 + ScrollTrigger. Architecture d'animations en couches : hero stagger (entrée des éléments H1 + sous-titres), ScrollReveal générique pour les sections, ScrollTrigger.batch pour l'expertise (stagger scroll-aware), AIVisual rebuildé avec timeline GSAP (draw-in + pulse organique), ApproachTimeline avec connector line progressive. next-intl pour l'i18n FR/EN. Déploiement Vercel direct.
GSAP plutôt que Framer Motion
ScrollTrigger.batch permet un stagger scroll-aware natif. GSAP `useGSAP` + `gsap.context().revert()` = cleanup automatique sans memory leaks. Framer Motion manque de contrôle fin sur les timelines complexes.
ScrollReveal générique partagé
Un composant `<ScrollReveal>` réutilisable sur toutes les sections évite de dupliquer la logique GSAP. Chaque section déclare juste ses enfants — le composant gère l'animation.
prefersReducedMotion() vérifié partout
Accessibilité non-négociable. Si l'utilisateur a activé 'réduire les animations' dans son OS, toutes les animations GSAP sont court-circuitées.
- L01GSAP est la référence mondiale pour les animations web complexes — pas un luxe, un outil de précision.
- L02Enregistrer ScrollTrigger une seule fois dans un module partagé évite les conflits de plugins.
- L03Une agence doit manger sa propre cuisine : si tu vends du web premium, ton site doit être le meilleur exemple de ce que tu fais.