Koukaki

Contexte OpenClassrooms :
En tant qu’intégrateur WordPress chez MyCustomiWP, j’ai travaillé sur la montée en gamme du site du studio d’animation Koukaki, dont le dernier film a été nominé aux Oscars. L’objectif était d’enrichir la page d’accueil avec une série d’animations et de transitions immersives, à partir d’une maquette UX, d’un prototype Figma et d’assets fournis par l’agence.

Le site existant devait évoluer vers une expérience beaucoup plus vivante, sans recourir à un page builder et en respectant les bonnes pratiques WordPress. Il fallait intégrer plusieurs types d’animations selon leur contexte technique : CSS pour les rotations simples, JavaScript/jQuery pour les interactions dynamiques, ainsi qu’un carrousel Cover Flow pour la section des personnages. Le tout devait être proprement intégré dans un thème enfant.

J’ai développé l’ensemble des évolutions directement dans le thème enfant du site, en séparant proprement la logique d’animation et les composants.
J’ai notamment :

• ajouté un fade-in progressif des sections au chargement de la page ;
• créé une rotation continue des fleurs en CSS ;
• intégré une nouvelle section dédiée à la nomination aux Oscars ;
• mis en place des animations d’apparition des titres au scroll ;
• ajouté une vidéo de fond dans le hero header, avec fallback mobile et image de secours ;
• développé un effet de flottement continu sur le titre principal ;
• créé un effet de parallaxe entre le titre et la vidéo au scroll ;
• remplacé la section personnages par un carrousel SwiperJS avec effet Cover Flow, via un template part dédié ;
• animé le déplacement horizontal des nuages selon la position de scroll ;
• conçu un menu fullscreen affiché au clic sur le menu hamburger ;
• intégré les scripts en respectant les bonnes pratiques WordPress.

La page d’accueil est devenue beaucoup plus cinématique et engageante, en cohérence avec l’univers du studio. Le projet m’a permis de combiner intégration WordPress sur thème enfant, structuration Sass, animations CSS et interactions avancées en JavaScript dans une logique de performance et de maintenabilité.